QM  4.1.1
Working with Diagrams

In order to work with a diagram, you must first create it. For example, to create a State Machine diagram (Statechart), please refer to Section Adding a State Machine.

Note
Currently QM™ supports only State Diagrams, but it might support other diagram types in the future. This section describes generic operations applicable to any diagram type.

Opening a Diagram

Once a diagram exists, you have two options of opening it. First option is to double-click on the diagram item in the Model Explorer to trigger its default action, which is to show the diagram.

Alternatively, you can right-click on the diagram in the Model Explorer to launch the popup menu associated with the diagram, and then choosing the first action from this menu, which is Show Diagram.

diagram_open.png
Opening a Diagram

Closing a Diagram

To close a diagram, you click on the X button in the top-right corner of the diagram window, or in the MDI tab (if you use the Tabs View mode), as shown in the picture below.

diagram_close.png
Closing a Diagram

Alternatively, the current active MDI window can be closed by means of the keyboard shortcut: Ctrl-W.

Note
Closing a diagram does not delete the diagram, it merely hides the diagram window from view.

The Drawing Canvas

Every diagram in QM™ is drawn on the canvas, which is a rectangular background area behind the various shapes. Even though you can actually draw outside the canvas, QM™ will export to a graphic format (see Exporting Diagrams) only the part of the diagram enclosed by the canvas.

As shown in the screen shot below, you can easily resize the Drawing Canvas by dragging its right or bottom edges, or by dragging the resize handle in the bottom-right corner of the canvas. In each case the mouse cursor indicates the possible direction of resizing.

bm_diagram-canvas.gif
Resizing the Drawing Canvas

The Grid

All elements of any QM™ diagram are aligned with the grid. You can position the diagram nodes and route the connectors only along the grid nodes, and in fact, the geometry of any shape is stored in the grid coordinates, so you cannot achieve any finer positioning granularity than the grid size, which is currently 8 pixels horizontally and 8 pixels vertically.

However, even though you cannot remove the alignment of all shapes to the grid, you can show or hide the grid dots in the diagram. You show or hide the grid by means of the "Grid Options" selection in the View Menu, or by means of the grid drop-box (grid) in the View Toolbar.


Selecting Diagram Shapes

Typically, when you simply click on a shape in a diagram you select that shape and clear any previous selection, so that only one shape is selected at a time. The model item corresponding to the selected shape becomes Current Item.

However, QM™ also offers you the convenience of selecting and manipulating multiple shapes simultaneously. QM™ provides two options of selecting multiple diagram shapes: the lasso tool and mouse selection-toggle. These two methods can be combined to fine-tune the selection.

Selecting Shapes with the Lasso

To select shapes with the lasso, press the Ctrl key on your keyboard, at which point the mouse cursor changes to a hand-pointer.

When you press the left mouse button, the cursor changes to a hand-pointer with a lasso and you can start dragging the lasso from that point.

bm_diagram-lasso.gif
Selecting multiple shapes with a lasso

Selecting Shapes with the Mouse-Toggle

You can also select or deselect shapes with the mouse-toggle. You start exactly the same as for selecting with the lasso, that is by pressing the Ctrl key on your keyboard, at which point the mouse cursor changes to a hand-pointer.

Now you just hover the mouse over any shape (hover means just moving the mouse cursor without depressing any mouse buttons). Whenever you hover over an active part of a shape, the mouse cursor changes to a hand-pointer with "+". You can then click the left mouse button to select the shape, if it is not selected, or un-select it, if it was already selected.

bm_diagram-select.gif
Selecting/deselecting shapes with mouse toggle

Panning Diagrams

To pan the diagram with the mouse, press the Shift key. At this point the mouse cursor changes to the open hand:

When you press the left mouse button, you "grab" the diagram and the cursor changes to closed hand:

Hold down the left mouse button and drag the whole diagram under the viewing window.

bm_diagram-pan.gif
Panning a Diagram
See also
Bird's Eye View

Scrolling Diagrams

When the diagram window is smaller than the diagram canvas, QM™ displays scroll bars, which allow you to scroll the diagram horizontally and vertically.

scrolling.png
Scrolling a Diagram

Scrolling with the Keyboard

You can scroll the diagram using the keyboard. As expected, the "up" key (key-up) scrolls the diagram up, the "down" key (key-down) scrolls the diagram down, the "left" key (key-left) scrolls the diagram left, and the "right" key (key-right) scrolls the diagram right.

Scrolling with the Mouse Wheel

You can also scroll the diagram using the mouse wheel. As expected, rotating the wheel forward scrolls the diagram down and rotating the wheel backward scrolls the diagram up. By pressing the Ctrl key, you can also scroll the diagram horizontally. When the Ctrl is pressed, rotating the wheel forward scrolls the diagram right and rotating the wheel backward scrolls the diagram left.


Zooming Diagrams

You can zoom a diagram in and out using several methods.

zoom.png
Zooming a Diagram

Zooming with the Status Bar

You can zoom a diagram by clicking on the zoom buttons (zoom-in, zoom-out, and zoom to 100%) in the Status Bar. The zoom-1 button (zoom to 100%)restores the zoom of 100%.

zoom_slider.png
Zoom Slider in the Status Bar

Alternatively, you can use the zoom slider in the Status Bar. Shifting the slider left towards zoom-out zooms out, towards zoom-in zooms in the diagram.

Zooming with the View Menu

You can zoom the active diagram with the View Menu actions zoom-in, zoom-out, and zoom to 100%.

Zooming with the Keyboard

You can zoom a diagram in and out with the keyboard shortcuts, which are the same as those used in web browsers for zooming websites. The shortcut Ctrl - (Ctrl-minus) zooms out, Ctrl + (Ctrl-plus) zooms in, and Ctr 0 (Ctrl-zero) zooms the diagram to 100%.

Zooming with the Mouse Wheel

Finally, you can zoom the active diagram with the mouse wheel, in similar way as you zoom in or out on Google maps. To activate zoom by the mouse wheel, press the Shift key on your keyboard. Now, rotating the mouse wheel forward zooms out and rotating the wheel backward zooms the diagram in, which is the same convention used in mapping applications, such as Google maps.


Exporting Diagrams

QM™ provides a very useful feature of exporting the active diagram to a graphic format, such as Enhanced Windows Metafile (EMF) vector format and Portable Network Graphics (PNG) raster format. The EMF format is particularly interesting, because it is the only vector format supported by Microsoft Office and Open Office.

Note
The Enhanced Windows Metafile (EMF) vector format is currently supported only in QM™ for Windows.
emf.jpg
EMF in Open Office. Note that the vector format looks good at any zoom level.
Attention
If any shapes are selected in the active diagram, QM™ renders only the selected shapes to the graphic format and clips the image size to the smallest bounding rectangle that encompasses all selected shapes. If no shapes are selected, QM™ exports the entire diagram to the graphic format and uses the drawing canvas as the bounding rectangle.

Exporting Active Diagram to a Graphic File

You can export the selected items or the whole active diagram to a graphic file by means of the File->Export Diagram... menu. This menu opens up the File Save dialog box to choose the graphic file name and format (currently EMF or PNG) to save.

diagram_export.png
Export diagram to EMF vector format or PNG raster format


Copying active diagram to the Clipboard in EMF

You can also copy the selected items or the whole diagram to the Clipboard in EMF by means of the (export to EMF) button in the Edit Toolbar. Once the EMF image is stored in the Clipboard, you can conveniently paste it directly to Microsoft Office, Open Office, or any other application that accepts EMF.

Note
The direct diagram export to the Clipboard in EMF vector format is currently supported only in QM™ for Windows.

Next: Working with Code Editors