How to Change the Appearance of a Newly Created Dummy Element

Tips & Tricks

Summary

This article shows how to create an IDummyEdgeConverter which copies all labels from the current master edge. More, it demonstrates how to implement own IDummyEdgeConverters.

Description

Folding, i.e. collapsing and expanding group nodes, is realized as a model-view setup, where a "managed view" presents a folding-enabled graph that is derived from the so-called master graph which holds the entire model. Graph elements in a managed view can be different from those in another view. A group node in a closed state can look different than in its opened state. Also edges which connect to a closed group node ("folder node") can be completely different from those which connect to the open group or its contents.

The elements in a managed view are represented by so-called "dummy" elements, i.e. dummy nodes and dummy edges. When such a dummy element does not exist at the time a folder is closed or opened, a new instance will be created using an IDummyNodeConverter or IDummyEdgeConverter, respectively.

Customizing dummy edge creation

The default implementation, DefaultDummyNodeConverter and DefaultDummyEdgeConverter create dummy nodes and edges using all state (layout and style or port locations, bends and style, respectively) from the original node or edge. They also copy the first label from the master element.

The most convenient way to customizing dummy edge creation is to create a custom IDummyEdgeConverter based on the abstract implementation AbstractDummyEdgeConverter or one of the default implementations

  • DefaultDummyEdgeConverter>: creates a dummy edge for each edge which connects to a node which is hidden in the managed view.
  • MergingDummyEdgeConverter: creates one dummy edge which merges all edges which connect to a node which is hidden in the managed view and which would result in edges connecting the same nodes in that view.

The edge creation can be customized by overriding one or more of the following methods:

Example: a dummy edge converter which copies all labels from the original edge

The default implementation only copies the first label of the master edge. In this example we want to create a dummy edge converter which copies all labels. Also, our custom dummy edge creator should create a dummy edge for each edge in the master graph. The most convenient way would be to subclass DefaultDummyEdgeConverter, but for demonstration purposes, we subclass AbstractDummyEdgeConverter.

The method in AbstractDummyEdgeConverter which has to be implemented is addDummyEdge(). Also, to customize label handling, we have to override the method createInitialLables():

public class CustomDummyEdgeConverter extends AbstractDummyEdgeConverter { // Called to create the labels for the newly created dummy edge. // Parameters: // callback The IChangeDummyEdgeAppearanceCallback which can be // used to modify the labels (and style and geometry) // of the dummy edge. // foldedGraph The folded graph of the current view. // dummyEdge The newly created dummy edge. // masterEdges A list of one or more master edges which are // represented by the dummy edge. // protected override function createInitialLabels( callback:IChangeDummyEdgeAppearanceCallback, foldedGraph:IFoldedGraph, dummyEdge:IEdge, masterEdges:List):void { // First: clear all existing labels callback.clearLabels(); // for each master edge in the list for (var it:Iterator = masterEdges.iterator(); it.hasNext();) { var me:IEdge = it.next() as IEdge; // take each label of the master edge for each (var label:ILabel in me.labels) { // and create a clone of it for the dummy edge callback.addLabel(label.labelModelParameter, label.style, label.text, label.preferredSize.width, label.preferredSize.height); } } } // // Creates a new dummy edge for the given master edge // using the given callback. // public override function addDummyEdge( callback:IAddDummyEdgeCallback, foldedGraph:IFoldedGraph, masterEdge:IEdge, localSourceNode:INode, sourceDummy:Boolean, localTargetNode:INode, targetDummy:Boolean):IEdge { return callback.addAsSeparateEdge(null, null); } }

The dummy converter instance has to be set on the folding manager:

// fm is of type com.yworks.graph.model.FoldingManager // and is the folding manager which manages the folded // graph and its managed views fm.dummyEdgeConverter = new CustomDummyEdgeConverter();

Customizing dummy node creation

Analogous to the dummy edge creation, dummy nodes are created using IDummyNodeConverter implementations. The yFiles FLEX library does not provide an abstract implementation. Custom implementations can be created by subclassing the default implementation, DefaultDummyNodeConverter, however.

The node creation can be customized by overriding one or more of the following methods:

Categories this article belongs to:
yFiles FLEX > Displaying and Editing Graphs > Graph Structure
Applies to:
yFiles FLEX: 1.5, 1.6, 1.7, 1.8
Keywords:
folding - FoldingManager - IDummyEdgeConverter - IDummyNodeConverter - dummy elements