An IInputMode that can navigate an IGraph displayed in a graphComponent.
Remarks
Examples
Typically the NavigationInputMode
is installed as child mode of a GraphEditorInputMode or GraphViewerInputMode and can be retrieved from the navigationInputMode property.
const navigationInputMode = mode.navigationInputMode
The NavigationInputMode
supports e.g. opening and closing group nodes. These actions can be configured in details:
// mode is either an instance of GraphEditorInputMode or GraphViewerInputMode
// enable expanding and collapsing group nodes
mode.navigationInputMode.allowCollapseGroup = true
mode.navigationInputMode.allowExpandGroup = true
// don't fit the content after expand/collapse
mode.navigationInputMode.fitContentAfterGroupActions = false
// expand/collapse group nodes in a way that their
// top right corner stays at its current coordinates
mode.navigationInputMode.autoGroupNodeAlignmentPolicy =
NodeAlignmentPolicy.TOP_RIGHT
It also reports when groups are opened or collapsed interactively by raising the following events:
// mode is either an instance of GraphEditorInputMode or GraphViewerInputMode
mode.navigationInputMode.addGroupExpandingListener((sender, args) => {
const node = args.item
// do something with the node before it will be expanded
})
mode.navigationInputMode.addGroupExpandedListener((sender, args) => {
const node = args.item
// do something with the node after it has been expanded
})
mode.navigationInputMode.addGroupCollapsingListener((sender, args) => {
/* same for collapse operations */
})
mode.navigationInputMode.addGroupCollapsedListener((sender, args) => {
/* same for collapse operations */
})
Type Details
- yfiles module
- view-component
- yfiles-umd modules
- All view modules
- Legacy UMD name
- yfiles.input.NavigationInputMode
See Also
Constructors
Properties
Gets or sets a value that determines whether it is allowed to collapse group nodes via the COLLAPSE_GROUP.
Remarks
true
.Examples
// mode is either an instance of GraphEditorInputMode or GraphViewerInputMode
// enable expanding and collapsing group nodes
mode.navigationInputMode.allowCollapseGroup = true
mode.navigationInputMode.allowExpandGroup = true
// don't fit the content after expand/collapse
mode.navigationInputMode.fitContentAfterGroupActions = false
// expand/collapse group nodes in a way that their
// top right corner stays at its current coordinates
mode.navigationInputMode.autoGroupNodeAlignmentPolicy =
NodeAlignmentPolicy.TOP_RIGHT
See Also
Gets or sets a value that determines whether it is allowed to enter group nodes via the ENTER_GROUP.
Remarks
true
.Examples
// mode is either an instance of GraphEditorInputMode or GraphViewerInputMode
// enable expanding and collapsing group nodes
mode.navigationInputMode.allowCollapseGroup = true
mode.navigationInputMode.allowExpandGroup = true
// don't fit the content after expand/collapse
mode.navigationInputMode.fitContentAfterGroupActions = false
// expand/collapse group nodes in a way that their
// top right corner stays at its current coordinates
mode.navigationInputMode.autoGroupNodeAlignmentPolicy =
NodeAlignmentPolicy.TOP_RIGHT
See Also
Gets or sets a value that determines whether it is allowed to exit the current group node via the EXIT_GROUP.
Remarks
true
.Examples
// mode is either an instance of GraphEditorInputMode or GraphViewerInputMode
// enable expanding and collapsing group nodes
mode.navigationInputMode.allowCollapseGroup = true
mode.navigationInputMode.allowExpandGroup = true
// don't fit the content after expand/collapse
mode.navigationInputMode.fitContentAfterGroupActions = false
// expand/collapse group nodes in a way that their
// top right corner stays at its current coordinates
mode.navigationInputMode.autoGroupNodeAlignmentPolicy =
NodeAlignmentPolicy.TOP_RIGHT
See Also
Gets or sets a value that determines whether it is allowed to expand group nodes via the EXPAND_GROUP.
Remarks
true
.Examples
// mode is either an instance of GraphEditorInputMode or GraphViewerInputMode
// enable expanding and collapsing group nodes
mode.navigationInputMode.allowCollapseGroup = true
mode.navigationInputMode.allowExpandGroup = true
// don't fit the content after expand/collapse
mode.navigationInputMode.fitContentAfterGroupActions = false
// expand/collapse group nodes in a way that their
// top right corner stays at its current coordinates
mode.navigationInputMode.autoGroupNodeAlignmentPolicy =
NodeAlignmentPolicy.TOP_RIGHT
See Also
Gets or sets the location that should be kept fixed if toggling a group node state.
Remarks
Examples
navigationMode.autoGroupNodeAlignmentPolicy = NodeAlignmentPolicy.TOP_RIGHT
graph.groupNodeDefaults.style = new CollapsibleNodeStyleDecorator({
buttonPlacement: InteriorLabelModel.NORTH_EAST
})
See Also
Gets the list of commands that are available in this instance.
Remarks
By default, all supported commands are available
Removing commands from this collection also removes the command bindings registered by this instance.
Add supported commands to make them available in this instance.
Supported commands are
See Also
Gets the installed controller.
Gets or sets the enabled state of this input mode.
Remarks
Examples
Gets or sets a value indicating whether this mode will be the only one running when it has the mutex.
Remarks
The value of this property will be delegated to the exclusive property of the controller.
If this mode is marked as exclusive and has the mutex, all other modes added to the same MultiplexingInputMode will be deactivated. Otherwise it will always run concurrently with all other modes.
Gets or sets a value that determines whether fitContent or the FIT_CONTENT should be triggered after a group navigation action.
Remarks
Note that collapseGroup and expandGroup only fit the content when autoGroupNodeAlignmentPolicy is NONE.
The default value is false
.
Gets or sets the graph this mode operates on.
Gets or sets the graphComponent this mode acts on.
Gets or sets the IGraphSelection this mode operates on.
Gets the context instance this mode is currently installed in or null
if this instance is not installed.
Remarks
Implements
Gets the priority of this input mode.
Remarks
See Also
Implements
Gets or sets a value determining whether a node that has been focused or selected with a keyboard gesture should be made visible by adjusting the viewport.
Remarks
true
.See Also
Gets the types of the items that should be selectable by this instance.
Remarks
Gets or sets a value indicating whether to use the currentItem as a fallback for the commands if no item is provided in the parameter and the current selection is empty.
Remarks
Methods
Adjusts the contentRect to encompass all elements.
Remarks
Adjust the group node location according to the value of autoGroupNodeAlignmentPolicy.
Called by the client to unconditionally cancel all editing.
Remarks
This will be called prior to the uninstalling of this instance.
In order to stop an active input mode manually, client code should use the following idiom:
if (!mode.tryStop()) {
mode.cancel()
}
Implements
Clears the selection in the graphComponent.
Collapses the given group node to hide the contents of the group node from this IFoldingView.
Parameters
A map of options to pass to the method.
- groupNode - INode
- The group node to collapse.
See Also
Performs collapseGroup for all selectedNodes.
This method allows for entering a group node so that the currently displayed IFoldingView's localRoot will be reset to the provided node.
Remarks
node
argument, as well as an item that belongs to the masterGraph to allow for switching to group nodes which are currently not being displayed in this view.Parameters
A map of options to pass to the method.
- node - INode
- The node that needs to be either part of the current graph, or part of the masterGraph.
See Also
Performs enterGroup for the first valid selectedNodes.
Exits the current localRoot of the currently displayed view and shows the contents of the parent container.
Expands the given group node to show the contents of the collapsed group node in this IFoldingView.
Parameters
A map of options to pass to the method.
- groupNode - INode
- The group node to expand
See Also
Performs expandGroup for all selectedNodes.
Moves the focus into the given direction, extending the selection to the new element.
Parameters
A map of options to pass to the method.
- direction - MoveFocusDirection
- The direction to move the focus and extend the selection.
findNearestItem
(context: IInputModeContext, startLocation: Point, direction: MoveFocusDirection, itemsToCheck: IEnumerable<IModelItem>) : IModelItemDetermines the nearest item in the given direction
.
Remarks
The default implementation uses the euclidean distance from startLocation
which is additionally weighted to prefer items in the geometric direction
. This method is called by the default implementation of findNextItem when MoveFocusDirection corresponds to an actual direction in the geometric sense. The method will be called at most twice by the default implementation of findNextItem. If it returns null
the first time with a smaller set of possible candidates, the default implementation will call it again with more possible candidates.
Note that the default implementation ignores any projection and treats directions to be in world coordinates unless useViewCoordinates is set.
Parameters
A map of options to pass to the method.
- context - IInputModeContext
- The current input mode context.
- startLocation - Point
- The reference location for the gesture.
- direction - MoveFocusDirection
- The direction for the move action.
- itemsToCheck - IEnumerable<IModelItem>
- The items that should be considered.
Returns
- ↪IModelItem
- The nearest item in
direction
ornull
if no suitable item can be determined.
Determines the next item when a navigation command is executed.
Parameters
A map of options to pass to the method.
- context - IInputModeContext
- The current input mode context.
- direction - MoveFocusDirection
- The direction of the command.
Returns
- ↪IModelItem
- The next item in
direction
, ornull
.
Adjusts the viewport to fully encompass the contentRect.
Remarks
Installs this mode into the given context that is provided by the canvas.
Remarks
In general a mode can only be installed into a single canvas at all times.
This method is called to initialize this instance. Subclasses should override this method to register the corresponding event handler delegates for the various input events they need to register with.
Overriding implementations should call the base implementation, first.
Parameters
A map of options to pass to the method.
- context - IInputModeContext
- The context that this instance shall be installed into. The same instance will be passed to this instance during uninstall. A reference to the context may be kept and queried during the time the mode is installed.
- controller - ConcurrencyController
- The controller for this mode.
See Also
Implements
Moves the focus into the given direction, not changing the current selection.
Parameters
A map of options to pass to the method.
- direction - MoveFocusDirection
- The direction to move the focus.
Moves the focus into the given direction, setting the selection to the new element.
Parameters
A map of options to pass to the method.
- direction - MoveFocusDirection
- The direction to move the focus and selection.
Called after cancel has been called.
Remarks
Can be overridden in subclasses to perform additional actions after the mode has been canceled.
This implementation does nothing.
Called after the active property of the installed ConcurrencyController has been set to true
.
Remarks
Can be overridden in subclasses to perform additional actions after the mode has been activated.
Overriding implementations should call the base implementation.
Called after the active property of the installed ConcurrencyController has been set to false
.
Remarks
Can be overridden in subclasses to perform additional actions after the mode has been deactivated.
Overriding implementations should call the base implementation.
Raises the GroupCollapsed event.
Parameters
A map of options to pass to the method.
- evt - ItemEventArgs<INode>
- The ItemEventArgs<T> instance containing the event data.
Raises the GroupCollapsing event.
Parameters
A map of options to pass to the method.
- evt - ItemEventArgs<INode>
- The ItemEventArgs<T> instance containing the event data.
Raises the GroupEntered event.
Parameters
A map of options to pass to the method.
- evt - ItemEventArgs<INode>
- The ItemEventArgs<T> instance containing the event data.
Raises the GroupEntering event.
Parameters
A map of options to pass to the method.
- evt - ItemEventArgs<INode>
- The ItemEventArgs<T> instance containing the event data.
Raises the GroupExited event.
Parameters
A map of options to pass to the method.
- evt - ItemEventArgs<INode>
- The ItemEventArgs<T> instance containing the event data.
Raises the GroupExiting event.
Parameters
A map of options to pass to the method.
- evt - ItemEventArgs<INode>
- The ItemEventArgs<T> instance containing the event data.
Raises the GroupExpanded event.
Parameters
A map of options to pass to the method.
- evt - ItemEventArgs<INode>
- The ItemEventArgs<T> instance containing the event data.
Raises the GroupExpanding event.
Parameters
A map of options to pass to the method.
- evt - ItemEventArgs<INode>
- The ItemEventArgs<T> instance containing the event data.
Actually sets the current item property.
Parameters
A map of options to pass to the method.
- graphComponent - GraphComponent
- The graphComponent to set the current item of.
- item - IModelItem
- The item to set.
Returns
- ↪boolean
- Whether the operation was actually performed.
Called after tryStop has been called.
Remarks
Can be overridden in subclasses to perform additional actions after the mode has been stopped.
This implementation does nothing.
Selects the currentItem current item.
Remarks
Selects the given item.
Parameters
A map of options to pass to the method.
- graphComponent - GraphComponent
- The graphComponent.
- item - IModelItem
- The item to select.
- extendSelection - boolean
- if set to
true
the current selection is extended otherwise it is cleared beforehand.
See Also
Sets the "current" item to the given one.
Remarks
null
.Parameters
A map of options to pass to the method.
- item - IModelItem
- The item to set as the current item.
See Also
Sets the graphComponent to use for the various actions.
Remarks
Parameters
A map of options to pass to the method.
- graphComponent - GraphComponent
- The control to use or
null
.
Predicate method that decides whether it is allowed to collapse the given group node.
Remarks
Returns
- ↪boolean
- Whether to collapse the given group or not.
Predicate method that decides whether it is allowed to enter the specific group node.
Remarks
Parameters
A map of options to pass to the method.
- node - INode
- The group node to enter.
Returns
- ↪boolean
- Whether to enter the group or not.
Predicate method that decides whether it is allowed to exit the current group node.
Remarks
Returns
- ↪boolean
- Whether to exit the current group or not.
Predicate method that decides whether it is allowed to expand the given group node.
Remarks
Returns
- ↪boolean
- Whether to expand the given group or not.
Determines whether the input mode should try to request the mutex when a command is executed.
Remarks
This resets the state of any other input mode, unless it currently possesses the mutex.
The value of this method is queried for COLLAPSE_GROUP, EXPAND_GROUP, TOGGLE_EXPANSION_STATE, ENTER_GROUP and EXIT_GROUP.
Returns
- ↪boolean
- whether the input mode should request the mutex.
Determines whether a given model item should be selected.
Remarks
item
should be selected.Parameters
A map of options to pass to the method.
- item - IModelItem
- The model item.
Returns
- ↪boolean
- Whether the item should be selected by the navigational commands.
Predicate method that decides whether it is allowed to toggle the collapsed state of the given group node.
Remarks
Returns
- ↪boolean
- Whether to expand the given group or not.
Toggles the expanded/collapsed state for the given group node in the IFoldingView.
Parameters
A map of options to pass to the method.
- groupNode - INode
- The group node to toggle the state for.
See Also
Overridden to only return true
if this instance does not currently have the input mutex.
Uninstalls this mode from the given context.
Remarks
This code should clean up all changes made to the canvas in the install method. After a mode has been uninstalled it can be installed again into the same or another canvas.
Overriding implementations should call the base implementation after their own code.
Parameters
A map of options to pass to the method.
- context - IInputModeContext
- The context to deregister from. This is the same instance that had been passed to install during installation.
Implements
Events
Occurs whenever a group has been Collapsed.
Event Registration
addGroupCollapsedListener(function(this, ItemEventArgs<INode>):void)
Event Deregistration
removeGroupCollapsedListener(function(this, ItemEventArgs<INode>):void)
Signature Details
function(sender: this, evt: ItemEventArgs<INode>)
Parameters
- sender - this
- The source of the event.
- evt - ItemEventArgs<INode>
- An object that contains the event data.
Occurs before a group will be Collapsed.
Event Registration
addGroupCollapsingListener(function(this, ItemEventArgs<INode>):void)
Event Deregistration
removeGroupCollapsingListener(function(this, ItemEventArgs<INode>):void)
Signature Details
function(sender: this, evt: ItemEventArgs<INode>)
Parameters
- sender - this
- The source of the event.
- evt - ItemEventArgs<INode>
- An object that contains the event data.
Occurs whenever a group has been Entered.
Event Registration
addGroupEnteredListener(function(this, ItemEventArgs<INode>):void)
Event Deregistration
removeGroupEnteredListener(function(this, ItemEventArgs<INode>):void)
Signature Details
function(sender: this, evt: ItemEventArgs<INode>)
Parameters
- sender - this
- The source of the event.
- evt - ItemEventArgs<INode>
- An object that contains the event data.
Occurs before a group will be Entered.
Event Registration
addGroupEnteringListener(function(this, ItemEventArgs<INode>):void)
Event Deregistration
removeGroupEnteringListener(function(this, ItemEventArgs<INode>):void)
Signature Details
function(sender: this, evt: ItemEventArgs<INode>)
Parameters
- sender - this
- The source of the event.
- evt - ItemEventArgs<INode>
- An object that contains the event data.
Occurs whenever a group has been Exited.
Event Registration
addGroupExitedListener(function(this, ItemEventArgs<INode>):void)
Event Deregistration
removeGroupExitedListener(function(this, ItemEventArgs<INode>):void)
Signature Details
function(sender: this, evt: ItemEventArgs<INode>)
Parameters
- sender - this
- The source of the event.
- evt - ItemEventArgs<INode>
- An object that contains the event data.
Occurs before a group will be Exited.
Event Registration
addGroupExitingListener(function(this, ItemEventArgs<INode>):void)
Event Deregistration
removeGroupExitingListener(function(this, ItemEventArgs<INode>):void)
Signature Details
function(sender: this, evt: ItemEventArgs<INode>)
Parameters
- sender - this
- The source of the event.
- evt - ItemEventArgs<INode>
- An object that contains the event data.
Occurs whenever a group has been Expanded.
Event Registration
addGroupExpandedListener(function(this, ItemEventArgs<INode>):void)
Event Deregistration
removeGroupExpandedListener(function(this, ItemEventArgs<INode>):void)
Signature Details
function(sender: this, evt: ItemEventArgs<INode>)
Parameters
- sender - this
- The source of the event.
- evt - ItemEventArgs<INode>
- An object that contains the event data.
Occurs before a group will be Expanded.
Event Registration
addGroupExpandingListener(function(this, ItemEventArgs<INode>):void)
Event Deregistration
removeGroupExpandingListener(function(this, ItemEventArgs<INode>):void)
Signature Details
function(sender: this, evt: ItemEventArgs<INode>)
Parameters
- sender - this
- The source of the event.
- evt - ItemEventArgs<INode>
- An object that contains the event data.