Diagram Editor Programming Discussion

Table of Contents Programming Overview Common Components Graph Components Topics in this section

The ATF Diagram Editor Sample serves as a great example of how powerful MEF component composition can be. This sample simply puts the MEF components used in the other graph samples in its TypeCatalog to produce an application that has nearly all the capabilities of the individual graph samples:

• ATF Circuit Editor Sample, described in Circuit Editor Programming Discussion.
• ATF Fsm Editor Sample, described in FSM Editor Programming Discussion.
• ATF State Chart Editor Sample, described in State Chart Editor Programming Discussion.

DiagramEditor can edit circuits, simple state machines, and statecharts.

Programming Overview

DiagramEditor provides all of its capabilities by adding graph components from the graph samples to its MEF TypeCatalog. Everything else that is needed is included by referencing it, such as XML Schema files from SchemaLoader classes. The TypeCatalog includes (almost) a superset of the components in the three graph editor samples, so DiagramEditor provides all the capabilities those components do.

Common Components

The only file in this sample of any substance is Program.cs. Its Main() function sets up the MEF components in a typical fashion. The MEF components it uses are a superset of the components used in the other three graph samples, with the few exceptions noted.

Some of these components are the ones most samples include: CommandService, ControlHostService, and WindowLayoutService. PaletteService is used in about half the samples and is needed here, because all the graph samples use palettes and have palette clients. A few are ones that are common to the graph samples, but not the other samples, such as PrototypeLister.

Graph Components

DiagramEditor must also include the key graph components in the graph samples. Here are the editor components listed for these samples:

// Editors
typeof(StatechartEditorSample.Editor),          // sample statechart editor
typeof(StatechartEditorSample.SchemaLoader),    // loads statechart schema and extends types
typeof(StatechartEditorSample.PaletteClient),   // component which adds palette items

typeof(CircuitEditorSample.Editor),             // sample circuit editor
typeof(CircuitEditorSample.SchemaLoader),       // loads circuit schema and extends types
typeof(GroupingCommands),                       // circuit group/ungroup commands
typeof(CircuitControlRegistry),                 // circuit controls management
typeof(MasteringCommands),                      // circuit master/unmaster commands
typeof(CircuitEditorSample.ModulePlugin),       // component that defines circuit module types
typeof(LayeringCommands),                       // "Add Layer" context menu command for the Layer Lister

typeof(FsmEditorSample.Editor),                 // editor which manages FSM documents and controls
typeof(FsmEditorSample.PaletteClient),          // component which adds palette items
typeof(FsmEditorSample.SchemaLoader),           // loads FSM schema and extends types

There are three components that are common to all the samples:

• SchemaLoader: Schema loader, derived from XmlSchemaTypeLoader, that loads the schema file describing the sample's data model. All the graph samples use the ATF DOM and define their data model with an XML Schema.
• Editor: Editor that opens and closes documents and manages the document editing controls. This is both a document and control host client, implementing IDocumentClient and IControlHostClient. These components perform in a similar way in the different samples. For more details of what they do, see Editor Component in FsmEditor and Circuit Document Display and Editing in CircuitEditor.
• PaletteClient: Palette client that populates the palette with the items that can be dragged onto a canvas. CircuitEditor sample's palette client class is called ModulePlugin. Note that the application handles multiple palettes smoothly, combining them in one pane, with individual palette items separated by headers. In addition, you can only drag items onto a canvas of the proper type. You can't drag circuit items onto a statechart canvas, for example. For more details on palettes, see Using a Palette.

Note that though DiagramEditor itself has only a few files associated directly with it, it depends on classes and files in other samples. For instance, the SchemaLoader classes all need to load their XML Schema .xsd files. SchemaLoader also depends on the type metadata classes in the Schema class for each sample. DiagramEditor is built out of much more than appears in its project.

For FsmEditor and StateChartEditor, these three components above are the only ones needed, because they are the only components implemented in those samples.

CircuitEditor, however, has several more listed that provide important capabilities. GroupingCommands, for example, is used for commands to group and ungroup modules and the connections between them. LayerLister is also used only by CircuitEditor, even though it is not grouped with the other components.

Some of the components in CircuitEditor are not listed in DiagramEditor, such as GraphViewCommands or any of the template related components like TemplateLister. This means that DiagramEditor doesn't have the commands to increase or decrease the magnification of the graph using zoom presets, because GraphViewCommands provides that. Nor does it have templates. These absences also demonstrate how capabilities can be easily removed from (or added to) applications by encapsulating them in components.

Topics in this section