Up Previous Next Title Page Index Contents

1.8 Symbol Editor

See also the Menu Reference, Section 3.8.

To create or modify the graphical symbol of an object, role or relationship type as displayed in the Diagram and Matrix Editors, press the Symbol button in the corresponding Object, Relationship, or Role Tool. As a result, a Symbol Editor opens showing the symbol of that type (empty if no symbol has been defined).

The Symbol Editor is a special kind of drawing tool that allows you to make symbols out of a variety of shapes, colours, and text fields. The values of properties can be shown in rectangular property labels, whose font and layout can be changed. Each shape can have a condition attached to it, which determines whether it is drawn, depending on the value of a property. Object and relationship symbols can define connection points to determine how and where role lines are attached to them. In addition to these, the Symbol Editor allows the user to store and to retrieve symbols from the symbol library in the current default project.

Figure 1-29 shows an open Symbol Editor with a symbol of a Process used in Data Flow Diagrams.

Figure 1-29. Symbol Editor.

The main area is the symbol itself, containing a black hollow circle with a slightly offset filled light grey circle for a shadow. There are two property labels, one bold for the Process ID, and a larger one for its name. The green circles are connection points, which together form a polygon approximating to the boundary of the circular symbol.

In the toolbar on the left there are two displays at the top, showing the current foreground and background colours, and the current line width. Below these are grey drawing tool buttons, row by row from the top left: Select, Line, Rectangle, Polyline, Curved line, Ellipse, Polygon, Curved polygon, Text, and Scale. The first and last of these are for selecting and moving or resizing existing elements; the other buttons all create a new element. Property values can be inserted by selecting a property from the Properties list below. At the bottom of the window is a status bar showing which shape is selected, and grid and zoom settings.

Adding shapes to the symbol

New shapes are added on top of all existing shapes, and using the current colour and line width settings. Shapes can later be moved forward or backward in the order of display, and their colours and line width changed.

Adding a shape to a symbol works differently depending whether the shape requires two points to define it (line, rectangle, ellipse, text field, property), or several points (polyline, curved line, polygon, curved polygon).

To add a shape requiring two points:
1)Select the shape from the toolbar to the left of the drawing area.
2)Position the cursor at the point where you want to start to draw the selected shape.
3)Click and hold down the mouse button. The shape will start to be drawn in its default size.
4)Holding down the mouse button, drag the cursor to the point where the shape is what you want, and release the mouse button.

To draw a rounded rectangle, select the Rectangle tool and hold down shift when clicking the starting point. At the end of the creation you will be prompted for the radius of the rectangle corners, and a rounded rectangle will be drawn as a polygon with the parameters you specified.

Similarly, to draw an arc or segment of an ellipse, hold down shift when starting to draw an ellipse. At the end of the creation you will be prompted for the angle at which the arc begins, and the angle it sweeps through in degrees. These can be changed later with the Arc Settings item in the ellipse’s pop-up menu.

To draw perfect squares and circles, choose a suitably large grid, and make sure the Show Grid and Snap to Grid settings are on.

To add a shape which have more than two points you need to click as many times as the shape has vertices, with the last click being with the right mouse button:
1)Select the shape from the toolbar to the left of the drawing area.
2)Click at the point where you want the first point of the shape to be.
3)Click at each subsequent point, except the last one. For a polygon or closed curve, the last point is not the same as the first point, but rather the point before that. Thus for a triangle, you click once in step 2), once in step 3), and once with the right mouse button in step 4).
4)Clicked the right mouse button on the last point. If you are drawing a polygon or closed curve, the last line segment closing it will be drawn automatically.

After creation, shapes can later be moved, scaled and removed. Individual points in shapes with more than two points cannot be moved later. Individual shapes can also have conditions for when they are displayed in the symbol, depending on the value of a property.

Adding property values to the symbol

It is quite common to add property values to the symbols. For example the name of an object is usually written inside the object symbol. To add the property value into the symbol do the following:
1)Select the appropriate property from the property list at the bottom left of the Symbol Editor. The list shows all properties of the type whose symbol you are drawing.
2)Position the cursor at the point where you want the top left of the property label box to be.
3)Click and hold down the mouse button. The label will start to be drawn in its default size.
4)Holding down the mouse button, drag the cursor to the point where the label is the size and shape you want, and release the mouse button.
5)A property label will appear. The box around the label represents the area within which the actual property value will be displayed, when instances of this type are drawn. The box itself is only displayed in the Symbol Editor.

The property label can later be moved, scaled or deleted. It can also be refined by setting its font, text alignment, word wrapping and text colour; properties do not have a background colour. A property label can also have a condition for when it is displayed in the symbol, depending on the value of its property or another property.

Defining the connection points for symbols

All object and relationship symbols need a set of points, called connection points, which form a polygon to which the role lines coming to the symbol attach. A role line initially points towards the centre of the whole symbol, and stops at the point where it intersects the polygon defined by the connection points. If the line to the centre of the symbol does not intersect the connection point polygon, the line will instead be drawn to the closest connection point. Such lines however have the side effect that ‘straight’ binary relationships are no longer visually straight: the line visibly bends at the relationship. For this reason, the connection points should generally form a polygon that contains the centre of the symbol.

To generate connection points:
1)Select Connections | Generate defaults from the menu bar. This will generate four default connection points, at the corners of the enclosing rectangle of the symbol.

If you want to add more than four connection points for one object/relationship type, copy one of these points and paste it to desired location or choose Connections | Add Point. However, notice that the order of connection points is important: Generate defaults generates points 1–4, from the top left of the enclosing rectangle clockwise. The first added extra point is 5 and so on, and is thus in order after the bottom left point, and before the top left point (the last point is connected to the first point, to close the polygon of connection points).

To find out whether the connection points are added correctly choose Connections | Join Points. As a result, a green line is drawn through every connection point to show the connection point polygon. If the line between connection points crosses itself you need to reorganise the connection points by moving them to remove crossings. To change the order of connection points, select them all in the order you want them to be in, and cut and then paste them.

Connection points may also be generated for specific elements within the symbol. To add connection points for one or more elements:
1)Select the symbol element(s).
2)Select Connections | Add Points For Selection from the menu bar. This will generate selection points at the same points where selection handles are shown for the selected shape(s): one for each vertex of most symbols, and 12 for a full ellipse.

In some cases it is useful to have only one connection point in the middle of the symbol. This is typical for relationships which include only property label(s) as a symbol, and where the relationship line should go through the middle of the symbol (as in Figure 2-18). For this purpose the Symbol Editor can add one connection point to the middle of the symbol (Connections | Add Point at Center). This function should be made after the whole symbol has been finished: if you change the position of symbol elements, the point will no longer be in the middle, and relationship lines in diagrams will appear bent.

Editing symbols

You can cut, copy, paste and delete the shapes drawn into Symbol Editor. To copy a symbol element:
1)Select a shape with the left mouse button. Select Edit | Copy from the menu bar or Copy from the shape’s pop-up menu. The shape is now copied into buffer.
2)Select Edit | Paste from the menu bar or Paste from the pop-up menu when nothing is selected. The shape will be pasted in the drawing area at the same place from which it was copied.

Similarly you can cut a shape and paste it.

You can also select several shapes to be copied. If you want to select all shapes use Edit | Select All. The following selection modes are available:
Normal: normal selection with the left mouse button.
Incremental: press shift button down when selecting/releasing shapes with the left mouse button.
Area: press ctrl button down and drag an area with the left mouse button; ctrl is not needed if the drag begins in an empty area.

Also, you can delete individual shapes by selecting them and choosing Edit | Delete or Delete from the pop-up menu. To clear the entire symbol, choose Symbol | New....

Scaling symbols

All symbol elements can be scaled individually or as groups. To scale, first select the elements you want to scale, then press the scale button (bottom right push button) and click within the selected element or elements. The selected element(s) are then shown as a box for resizing, and you can drag the bottom right corner to the desired size. If you have chosen Snap to Grid (on by default) the resizing is performed according to the selected grid size.

Scaling of single lines allows you to move the end of the line nearest the point you initially clicked. Scaling of rounded rectangles may flatten or squash the rounded corners: you may prefer to redraw the symbol to be the shape you want, ensuring that the corners are built from quarter circles.

Changing the order of overlapping symbols

The order of symbol elements can be changed from the Edit menu. First select the symbol elements and then choose Edit | Send to Back to move the selected elements behind the other symbol elements, or Edit | Bring to Front to move them in front of other elements.

Aligning shapes

To align one or more shapes relative to another shape:
1)Select the shape which you want to use as the basis of alignment: this shape will not move (except for Align to Grid).
2)Incrementally select one or more other shapes to align to this shape with the mouse by keeping the shift button pressed while clicking the shapes.
3)Select the type of alignment from the Align menu.

Available alignments are: left sides, right sides, bottoms, tops, vertical centres, horizontal centres, centres, left to right, right to left, bottom to top, and top to bottom. Note that all of these only move the shapes: they do not change their shape or scale them.

For example to align a group of shapes so that they all start from the same x-coordinate, select Align | Left Sides.

Changing line widths

Shapes and lines are drawn always with the current line width. The line width can be changed by clicking the top right button, above the toolbar. You will be prompted for the thickness of the line in pixels at 100% zoom. A value for a normal line is 1, and the thickness increases when the number increases. Fill the dialog (e.g. 2, 3, 4, ...) and press return. A value of 0 represents a hairline, which will always be the thinnest line possible; other line widths scale to become wider at zoom factors >100%. The line in the button will show you the current thickness, or grey for a hairline.

Defining colours

A property label or fixed text can have colour. Other symbol elements can have a foreground colour (colour for frame or line) and a background colour (fill). To change the background colour do the following:
1)Select a shape or shapes to be filled.
2)Select Colours | Background... from the menu bar.
3)A colour palette appears. Select a colour by clicking one colour item, or close the palette from the window closing menu.

The Tran colour button represents a transparent colour: the shape will not be filled (or will have no frame for a foreground colour). This is useful for making symbols for objects that will later be scaled very large in a diagram, to enclose other object symbols.

The rectangle in the top left corner will show you the current colour settings.

Defining text alignment and wrapping

A property or fixed text label can have various alignments. You can change the text alignment from the menu bar Label | Text Alignment or from the label’s pop-up menu.

Select the alignment of the text within the label by choosing the dialog that opens (Figure 1-30). Usually just select the centre, because then the text is aligned both vertically and horizontally to start from the middle of the box. Selecting a point on the left will cause the text to be left-aligned.

Figure 1-30. Alignment dialog.

The text alignment dialog has also a checkbox to define word wrapping. If you want that a line of text which does not fit in the width of the label should be wrapped round to the next line, choose word wrap (default selection). If the property label is used for collections you should normally take the wrapping off: each element in the collection is then shown on its own line, and cut short if it is too long. This is the desired behaviour for attribute lists in class symbols etc.

Defining fonts

Label fonts and styles can be changed with the font setting tool (choose Label | Font). Fonts include sans serif, serif and fixed. Font sizes are expressed in pixels, and font styles include normal, italic, bold, underline and strikethrough. The tool shows a sample of the font with the current settings, as the user will see it at 100% zoom.

Figure 1-31. Font setting dialog.

Changing the contents of a property or text label

From the Label or popup menu (Label | Change Contents...), you can change the text in a fixed text label, or the property that a property label refers to. The latter is especially useful when pasting property labels into this symbol from a symbol of another type: then they are not connected to any property (unless they are shared in a supertype), and will be displayed in the Symbol Editor as question marks, and elsewhere not displayed at all.

Displaying conditional symbols

All symbol elements can have one condition, which must be met for them to be displayed. For example, a filled black circle at the end of a role line can be shown only when the role’s Cardinality property value is M.

Display conditions for symbols can be given by selecting the symbol element(s), and then Edit | Set Condition... or directly from the popup menu of the symbol element(s).

Figure 1-32. Display condition dialog.

The display condition dialog has two fields. The Property list includes all the property types defined for the non-property, and the Value field contains the value for the display condition. The symbol element will be shown only when the value of the specified property matches the string specified in the Value field.

To set a display condition:
1)From the property list, select the property type whose value determines whether this element is displayed.
2)Enter the value which that property must have for this element to be displayed.
3)Accept the display condition by pressing OK.

Condition values are dependent on the data type of the property. Use T for Boolean value true and F for false (i.e. checkbox checked and not checked). Wildcards # (any single character) and * (0 or more characters) can also be used: a useful condition for a ‘non-empty’ value is #*.

Note that an empty Value field means this element will only be displayed if the given property is empty. To remove a condition completely, press the Clear button.

View settings

You can define your own zoom and grid factors for Symbol Editor. These are found in View | Zoom... and View | Choose Grid.... The default zoom for the Symbol Editor is 400%: at this zoom factor, one pixel is equal to one unit of the scale that MetaEdit+ uses for storing symbol element co-ordinates, and hence symbol manipulation is most accurate. You should however check the look of your symbols at 100%, since this is the default zoom level in the Diagram Editor.

To change the zoom settings:
1)Select View | Zoom... from the menu bar.

Figure 1-33. A dialog for selecting the zoom level.

2)Choose a new zoom factor in the dialog (Figure 1-33) and press OK. If you do not want to change the settings click the Cancel button.

The units of the grid are smaller than those in the Diagram Editor (4 units here correspond to one unit in the Diagram Editor), as more accuracy is required here. One grid unit corresponds to one pixel at 400% zoom.

To change the grid settings:
1)Select View | Choose Grid... from the menu bar.

Figure 1-34. A dialog for selecting the grid size.

2)The grid can be set with the sliders or by directly entering the values for the grid. Grid values can be set uniformly for both dimensions, or individually for the horizontal and vertical dimensions. Select the desired values in the dialog (Figure 1-34) and press OK. If you do not want to change the settings click the Cancel button.

You can toggle the display of the grid by choosing View | Show Grid from the menu. View | Snap to Grid turns the functionality of the grid on or off. When creating an element, all its points are constrained to be on the grid. When moving an element, its top left corner is constrained to be on the grid. When scaling an element, its bottom right corner is constrained to be on the grid.

Saving symbols

After the modifications the symbol can be saved by selecting Symbol | Save from the menu bar.

Symbol library

Once you have drawn symbol definitions you can add them to the Symbol Library for later reuse (Symbol | Add to Library...). Try to give as generic a name as possible for the symbol, to help those who are searching later for a symbol to reuse. Note that Symbol Library is specific to the currently selected default project.

Symbol | Browse Library... opens a browser dialog where the symbol library of the default project can be browsed. If you want to add a symbol from the library to the current symbol, select the appropriate symbol and press Insert in the browser view.


Figure 1-35. Shape library.

When inserting symbols from the library, remember to update the contents of any property label that refers to a property not present in the current type: such labels are shown with a question mark ‘?’.

Exiting the Symbol Editor

To close the symbol editor select Symbol | Exit from the menu bar.

1.8.1 Push buttons

Select

Changes to selection mode, where you can select elements from the drawing area by clicking with the mouse. By holding shift down when making a selection multiple elements can be selected. The selected elements can be moved by dragging them to a new position. After any of the creation operations below, control always returns to the Select tool.

Line

Changes to line drawing mode, in which straight lines can be drawn by clicking the mouse at one end and dragging to the other end of the line.

Rectangle

Changes to rectangle drawing mode, in which rectangles can be drawn by clicking with the mouse at the top left corner of the desired rectangle, and dragging to the bottom right corner.

Rounded rectangles can be created by holding shift down when starting to create a rectangle. You will be prompted for the radius of the rounded corners.

Polyline

Changes to polyline mode. Polylines are made out of several connected straight lines, and are never filled. To start drawing, click at one end of the desired polyline. Click at each intermediate vertex with the left mouse button, clicking the last vertex with the right mouse button.

Curved line

Changes to curved line mode. Curves are splines drawn through the vertices, and are never filled. To start drawing, click at one end of the desired curve. Click at each intermediate vertex with the left mouse button, and click the last vertex with the right mouse button.

Ellipse

Changes to ellipse drawing mode. Ellipses always have their axes horizontally and vertically, as they are defined by a bounding rectangle. Click at the top left corner of the bounding rectangle, and drag to the bottom right corner.

You can draw a partial ellipse (arc or segment) by holding shift down when you start to create the ellipse: you will be prompted for the starting angle of the arc, and the angle it sweeps through. These settings can be changed later with Arc Settings in the ellipse’s pop-up menu.

Polygon

Changes to polygon drawing mode. Polygons are made out of several connected straight lines, with the end of the last line connected to the start of the first line. To start drawing, click at one vertex of the desired polygon. Click at each intermediate vertex with the left mouse button, clicking the last vertex with the right mouse button: the last line segment, connecting this vertex with the first vertex, will be added automatically.

Curved polygon

Changes to curved polygon drawing mode. A curved polygon is a curved line whose last point is connected with its first point. To start drawing, click at one vertex of the desired curve. Click at each intermediate vertex with the left mouse button, clicking the last vertex with the right mouse button: the last part of the curve, connecting this vertex with the first vertex, will be added automatically.

Text

Changes to text drawing mode. This allows you to write fixed text as part of symbols. The text attributes can be changed in the Label menu. Text has no background colour.

Scale

Changes to scaling mode, where the already selected element or group of elements can be scaled. To scale, first select an element or group of elements, then press the scale button and click within the element(s). The selected element(s) are then shown as a box for resizing, and you can drag the bottom right corner to the desired size. Note that since scaling only affects the bottom right corner, it is normally best to first move the element to be scaled so that its top left corner is in the right place, and then scale it.

1.8.2 Symbol Editor for Roles

The Symbol Editor for Roles works similarly to the normal Symbol Editor, except for a few details presented in this chapter.

The Symbol Editor for Roles has a line coming from the left side of the drawing area. This line represents the role line coming from an imaginary relationship left of the picture, and ending at an imaginary object in the centre of the picture (you may need to resize the window to see the end of the line). The role symbol should be defined relative to the end of the line, and not beyond it, because the end represents the position where the role line will connect to the object symbol. The symbol should be as it will look when pointing horizontally from left to right: role symbols are rotated according to the angle of the role line.

Figure 1-36. Symbol for a role Entity part.

Some common symbols are already defined: for example to draw an arrowhead at the end of the relationship select Role | Add Filled Arrow from the menu bar. Arrow size and location can be entered by holding shift down during the arrow symbol creation and by entering the width, length, and offset values for the arrow.

To change the appearance of the role line you can set the colour of the line and its width by selecting from the Role menu on the menu bar: other colour and line width selections affect the normal elements of the symbol, not the line.

There is no need to define connection points, and thus there is no menu for connections in the Symbol Editor for Roles. Otherwise the Symbol Editor for Roles works as an ordinary Symbol Editor. When building symbols for roles, however, you should take into account the rotation of role symbols with their lines, in particular with labels and ellipses.

Property and text labels

When adding property or fixed text labels, remember that the box for the label will be rotated with the rest of the role elements. Thus the label box should generally be approximately square. For instance, a box 10 characters wide and 2 character high, allowing four 4-character words, will turn into a box 2 characters wide and 10 characters high when the role line is vertical: such text is generally hard to read. Better would be a box 5 characters wide by 5 characters high: this would then show one full word per line at any angle, and will maintain its relationship with other components of the role symbol better.

As text can only be printed horizontally, bounded by a rectangle with horizontal and vertical sides, the actual area used for a rotated label is the smallest such rectangle that encloses the rotated label box. This has no effect for vertical and horizontal role lines, but for diagonal role lines is slightly larger than the original rectangle.

Ellipses

The set of ellipses is restricted to those with vertical and horizontal axes: ellipses with axes along diagonal lines are not possible. This is generally not a problem for object and relationship symbols, as such ellipses are rare in methods. In roles, however, the symbol should be rotated, thus turning a ‘horizontal’ ellipse into a ‘diagonal’ ellipse: in practice, only the bounding box of the ellipse is rotated, leading to results different from what might be expected.

This is not a problem for circles, as they effectively do not rotate. Other ellipses, arcs and segments however will not behave properly under rotation, and so should generally not be used in role symbols.

One solution is to define a rounded rectangle at the default size (just click quickly holding shift, and do not drag), and give a radius of 150 for its corners. This is then a polyline approximation to a circle, and you can scale it to be the size and shape of ellipse you want. The shape will then rotate properly.

Up Previous Next Title Page Index Contents