Search
Controlling User Interaction

There are several ways to control user actions on the diagram as a whole or on separate objects.

Display-only mode

The property with most impact on user interaction is StaticMode, which allows disabling all interaction with diagram elements. If StaticMode is set, FlowChartX functions as nothing more than a static image used to present some data to users.

Drawing Modes

The Behavior property provides predefined sets of rules how user interaction with the mouse/keyboard is interpreted. The default Behavior is bhFlowChart, where drawing with the mouse from an unoccupied point of the document is processed as a Box creation request, and drawing from a node creates an Arrow. Note that such behavior leads to some extra work when creating overlaying boxes - users need to draw the second box on an empty area and move it over the first one afterwards. In order to avoid that, use bhCreateBox behavior. Additional members of the EBehavior enumeration provide modes for drawing different node types (e.g. bhTableRelations), and ones that allow only limited interactions, such as bhSelectOnly or bhModify.

Document extents

Document size is set by SetDocSize method. By default users are able to move objects outside document bounds. To prevent this use RestrObjsToDoc property. It provides two options to restrict object positions, eventually not to restrict them at all. The first one is to keep objects entirely inside the document area. The second option allows objects to be partially outside, leaving some draggable part inside document.

Item constraints

Constraints upon how users are allowed to modify a node are set through the Constraints and MnpHandlesMask properties. The former specifies constraints on move direction and node size. The latter enables or disables specific manipulation handles of a node. That allows making the node non-moveable, non-resizable, or resizable only horizontally/vertically.

Items can be locked via the Box.Locked, Table.Locked and Arrow.Locked properties. Locked items are excluded from selection and users cannot re-select, move or modify them.

Creation of arrows

The AllowRefLinks property specifies if reflexive arrows can be created (having the same box for both target and origin); reflexive links are enabled by default, but can be disabled if they are meaningless for your application. AllowLinksRepeat specifies if more than one arrow can link the same origin and destination diagram nodes. AllowUnanchoredArrows specifies whether arrows can be linked to a node that does not have any anchor points defined. AllowUnconnectedArrows specifies whether users are allowed to draw unconnected arrows, i.e. arrows not connected to any node.

Modification of arrows

Once an arrow is created, a user can still move its end points to a different position. SnapToNodeBorder specifies whether arrow's end can be connected to a point that is not placed at node outlines. Moving arrow ends can be disabled altogether by setting ArrowEndsMovable to false. This can also be controlled on a per-arrow basis via AllowMoveEnd and AllowMoveStart properties. Validation of changing arrow's origin or destination can also be done in a RequestAttachArrow event handler.

Control how arrows connect to nodes

The AllowIncomingArrows property of nodes lets you specify whether incoming arrows can be drawn to a node. The AllowOutgoingArrows property lets you do that for outgoing arrows.

Anchor points define where arrow's ends should be placed when a user attaches an arrow to a node. Anchor points can be assigned to boxes, separately for incoming and outgoing arrows, via the Box.OutgAnchor and Box.IncmAnchor properties. Use the FlowChart's BoxOutgAnchor and BoxIncmAnchor to set the default values for new boxes. The AnchorPattern class allows defining sets of anchor points that can be assigned as integral entities to nodes. Boxes have an AnchorPattern property of that type, and tables provide AnchorPattern and RowAnchorPattern properties. The SnapToAnchor property specifies whether arrow ends are aligned to anchor points when creating or modifying arrows.

Adding arrow segments interactively

A segment of a poly-line arrow can be split in two by clicking and dragging any of its points. Two adjacent segments can be merged by moving their common control point to a position which makes the resulting angle obtuse. Splitting and merging segments of asPerpendicular-style arrows works too, but in a slightly different manner: two segments are inserted on split, and are removed when two adjacent control-points overlap. The ArrowsSplittable property controls whether such interactive manipulation of segments is enabled.

Unconnected arrows

To allow users draw arrows that are not connected to any node, set AllowUnconnectedArrows to true. Such arrows can be created programmatically, independently of the AllowUnconnectedArrows value, by using the CreateArrow method and passing null (Nothing in Visual Basic) as values of the destination or origin arguments.

In-place text editing

The text of boxes, tables and arrows can be edited in-place by double-clicking the respective objects. For tables both captions and cells can be edited in this way. To enable the feature set the InplaceEditAllowed property to true. Depending on the type of item whose text is edited, one of these events is raised when editing completes: BoxTextEdited, TableCaptionEdited, CellTextEdited, ArrowTextEdited, ArrowLabelEdited. In-place editing mode finishes after a mouse click outside the text entry control. In-place editing mode can be entered or cancelled programmatically, via the BeginInplaceEdit and EndInplaceEdit methods of the Box or Table class. Pressing ENTER or ESC exits inplace-edit mode if respectively InplaceEditAcceptOnEnter and InplaceEditCancelOnEsc are enabled.

Validation events

When a user tries to create, modify, delete or select an item, one of the following events is raised. To ban the action, set corresponding event boolean argument to false:

Event

Description

RequestCreateBox

Raised when the user is to create a box.

RequestCreateTable

Raised when the user is to create a table.

RequestCreateArrow

Raised when the user is to create an arrow.

RequestSelectBox

Raised when the user is to select a box.

RequestSelectTable

Raised when the user is to select a table.

RequestSelectArrow

Raised when the user is to select an arrow.

RequestDeleteBox

Raised when the user is to delete a box.

RequestDeleteTable

Raised when the user is to delete a table.

RequestDeleteArrow

Raised when the user is to delete an arrow.

ArrowModifying

Occurs while an arrow is being modified.

BoxModifying

Occurs while a box is being modified.

TableModifying

Occurs while a table is being modified.

Consult the FlowChartX Events section in this document for more events that can be raised in response to user's actions.

Selection

Multiple selection can be enabled or disabled via AllowMultiSel. Selection can be controlled on a per-object basis by handling one of the RequestSelect* events listed above.

Mouse wheel

By default, the mouse wheel scrolls the view vertically. Users can scroll horizontally by holding down the Shift modifier key while rotating the mouse wheel. The Control modifier scrolls the view in larger amounts (half the viewport width or height depending on scroll direction). Setting the MouseWheelAction property to Zoom makes wheel rotation zoom into the view instead. You could implement your own mouse-wheel logic by setting MouseWheelAction to None and handling the MouseWheel event.

Keyboard interaction

Setting the KbdActive property to false allows preventing users from modifying a FlowChartX document through keyboard. Setting it to true or false, respectively enables or disables all keyboard combinations, through which the diagram could be changed without the control of your application.

Finally, assigning true to the SelectAfterCreate property automatically selects every new item so it can be immediately modified, which is often very useful.