In this lesson, you add images to a profile and its tooling.
Before you begin, you need access to graphic files such as
a 16 pixel x 16 pixel GIF or JPG file for the icons that are displayed
in the Project Explorer view, as well as a 50 pixel x 50 pixel SVG
or GIF file for the images that are displayed in the diagram editor.
When you, as a profile author, add custom icons and images
to a stereotype in a profile, the custom graphics are displayed in
the following locations in the generated profile tooling:
- Icon:
- Palette
- Project Explorer view
- Outline view
- Properties view
You can specify an icon and a graphic to identify each stereotype
that you create. When you apply the stereotype to a model element,
the specified icon is displayed beside the stereotype name, and the
specified graphic replaces the default graphic for a diagram element
in the diagram editor.
Note: In this lesson, the icon file named yellowA.gif
is used for the icon graphic, and the image file named greenA.gif
is used for the image of Stereotype <A>.
To add custom
images to a profile:
- Create a new Profile Tooling plug-in project, as described
in Lesson 1 and Lesson 2.
- Using a graphics editing program, create two graphic files
to use later in this lesson. Although the appearance of the graphics
is not important for this tutorial, you might want to create graphics
that are similar to those in the screen capture that is displayed
later in this lesson:
- Create a small stereotype icon for the Project Explorer
view. Create an uppercase A with a yellow background, name the file
yellowA.gif, and ensure it is a 16 pixel x 16 pixel GIF file.
- Create an image for the diagram editor. Create an uppercase
A with a green background, name the file greenA.gif, and ensure it
is a 50 pixel x 50 pixel GIF file.
Note: These image files
do not have to reside in your project directory; you can browse to
your local file system to find the images.
- Create a small stereotype icon to appear on the Property
tab of a stereotype in the Properties view. Create an uppercase A
with an orange background, name the file orangeA.gif, and ensure it
is a 16 pixel x 16 pixel GIF file.
Important: This
file must reside in the package of the Profile Tooling plug-in project.
Before you customize the Property tab, you must import this graphic
into the profile tooling plug-in project (for example, icons/orangeA.gif).
- To add an icon and image to a stereotype, in the Project
Explorer view, in the Profiles folder, navigate to the stereotype
(for example, <<A>>).
- In the Properties view, click the General tab;
in the Icon field, navigate to and specify
the location of the yellowA.gif file.
- In the Properties view, click the General tab;
in the Shape Image field, navigate to and specify
the location of the greenA.gif file.
- Click File > Save.
- In the Project Explorer view, under Profiles,
right-click My Profile; then click Generate
Profile Tooling Model.
Note: If the tooling
model was generated, you must update the tooling model after you add
the images to the profile. However, in the visual compare-merge window,
you can overwrite any customizations that you made to the profile
tooling model.
- To add a custom image to a stereotype's Property tab, ensure
that the image is available in the package of the profile tooling
plug-in project. Before you customize the Property tab, import the
orangeA.gif image into the icons directory for the project.
- In the Project Explorer view, open the My Profile tooling
model, and expand the following elements: <<Properties>>
Properties package and the <<PropertyTabs>> Property Tabs.
- Select the Property tab for the element for which to add
a custom icon: <<PropertyTab>> <A> Actor.
- In the Properties view, select the PropertyTab tab.
- Set the value of the image property to the location of
the custom icon: icons/orangeA.gif.
- To indent the Property tab, you can specify True for
the indented property. The following figure shows the
resulting properties for the <<PropertyTab>><A> Actor.

- Click File > Save.
- In the Project Explorer view, right-click on the tooling
model; then click Generate Tooling.
When you deploy the Profile Tooling plug-in and create
a new model based on this profile, the custom images are displayed
in the diagram editor, Project Explorer view, Palette, Outline view,
and Properties view and should look similar to the following figure: 