Creating Custom Shape Libraries

CaseComplete’s diagramming and drawing tools come with several toolboxes for use case diagrams, flow charting and general shapes. Each of the toolboxes contains shapes that you can drag onto the diagram and tailor to your particular need, and because the shapes are pre-assembled, they save you time by not having to create the shape from primitive text, line and geometric elements. CaseComplete also lets you create your own custom toolboxes using “shape libraries.” Shape libraries are files that contain the definitions of shapes you can use from a toolbox. This article steps you through the process of creating your own custom shape library.

To demonstrate how to do this, I’m going to create a shape library for statechart diagrams. If you’re not familiar with statechart diagrams, please check out visualizing business rules with statecharts. The notation for statecharts is pretty simple, so this shape library will be quick and easy to create. There are only a handful of shapes we need for statecharts:

Shape Description Example
Transition directed arrow with text label state transition
Start State filled circle start
Stop State filled circle with concentric unfilled circle stop state
State rounded rectangle with inner label state shape
Guard condition text label surrounded by braces [ condition ]

To get started, create an empty project in CaseComplete. Next, create a new diagram in that project. Use the diagram surface to design the statechart shapes. After they’re complete, we’ll add them to a new shape library.

Create the Transition shape by drawing a directed arrow shape. Find the Connector Shapes library in the toolbox and drag a Line Connector to the drawing surface (Figure 1). Select the newly drawn connector and start typing to give it a name.

state transition diagram

Figure 1. Assemble new shape from existing shapes

Create the rest of the statechart shapes by following the same process. Draw the parts of each shape by building it from existing shapes. If the new shape is composed from more than one shape, then group those parts together. Grouping the parts together will ensure that when you drag a shape around on a diagram, all of the pieces will stay together. Use a filled circle for the start state shape, and set the fill color to black from the context menu. The stop state is one filled circle atop a larger unfilled circle. Use a rounded rectangle shape for the state shape, and a simple text label for the guard condition. Set the line and fill colors, fonts and shape sizes. If you are having a hard time getting the shape parts to align, you can use the arrow keys on your keyboard to nudge them in tiny increments. When you are done, you should have five shapes on your diagram (Figure 2).

custom shapes

Figure 2. Statechart Shapes

Now that all of the shapes are assembled, it’s time to create a new shape library. Click the icon for a new shape library (Figure 3).

create custom shapes library

Figure 3. New Shape Library

CaseComplete will prompt you for a name for the new shape library. Enter a name and click OK. CaseComplete will create an empty toolbox. Drag each shape from the diagram onto the empty toolbox, and give each shape a name as you are prompted to do so. When you are done, you should have a toolbox that contains five statechart shapes. Click the Save Shape Library icon (directly above the shape library’s title; see Figure 4) to save your shape library. Since the shape library is saved as a file, you can easily share them. To open an existing shape library, click the Open Shape Library icon adjacent to the New Shape Library icon (Figure 3). Tip: Don’t save your shape libraries in the CaseComplete installation folder – keep them in a separate location where they won’t accidently get erased when you install a new version of CaseComplete.

custom shapes library

Figure 4. Save Shape Library with Statechart Shapes

You can now use your shape library in new diagrams. You can add this shape library to always display in CaseComplete by choosing Add or Remove Buttons from the Configure Buttons option (Figure 5).

configure custom shapes libraries

Figure 5. Configure Buttons for Shapes

That’s all there is to creating a custom shape library. There are free shape libraries that you can download from the CaseComplete knowledge base. If you have a shape library you’d like to share on the forum, let us know – send it to support@serlio.com.



blog comments powered by Disqus