C

MoveViewportInputMode

Show Usages
An IInputMode implementation that can be used to pan or zoom the viewport of a CanvasComponent via mouse, stylus, and multitouch gestures.
ImplementsInheritance Hierarchy

Remarks

This implementation will request the mutex as soon as it recognizes a drag with the pointers or touch devices.

If allowPinchZoom is enabled, zooming is done with two touch pointers using the pinch zoom gesture. If the primary pointer is released during pinch, the secondary pointer is used for moving the viewpoint. The pinch zoom then can be restarted by touching another pointer that is recognized as the primary pointer.

If allowSinglePointerMovement is enabled, moving the viewport can be started with a single pointer, i.e., touching with one finger. Disabling this property is especially useful for applications that allow editing. When disabled, other gestures like moving items, or creating edges can be configured to start without a long press.

This mode is exclusive by default.

Examples

Typically, the MoveViewportInputMode is installed as child mode of a GraphEditorInputMode or GraphViewerInputMode and can be retrieved from the moveViewportInputMode property. Note that in these scenarios, the configuration may be different from the documentation of the defaults of this type.
Getting the MoveViewportInputMode from its parent input mode
const moveViewportInputMode = mode.moveViewportInputMode

See Also

Developer's Guide

Members

Show:

Constructors

MoveViewportInputMode

()
Creates a new instance of the move viewport mode

Parameters

Properties

allowPinchZoom

: boolean
Gets or sets a value indicating whether to allow the pinch zoom gesture.
final

Property Value

true if the pinch zoom gesture is allowed to change the zoom level; otherwise, false.

See Also

Developer's Guide

allowSinglePointerMovement

: boolean
Gets or sets a value indicating whether moving the viewport can be started with a single pointer, i.e., touching with one finger.
The default value is true.
final

Examples

Setting this property to false is especially useful for applications that allow editing. When disabled, other gestures like moving items, or creating edges can be configured to start without a long press.
Configure touch gestures without long press
mode.moveViewportInputMode.allowSinglePointerMovement = true
mode.createBendInputMode.beginRecognizerTouch =
  EventRecognizers.TOUCH_PRIMARY_DOWN
mode.createEdgeInputMode.beginRecognizerTouch =
  EventRecognizers.TOUCH_PRIMARY_DOWN
mode.handleInputMode.beginRecognizerTouch =
  EventRecognizers.TOUCH_PRIMARY_DOWN
mode.lassoSelectionInputMode.beginRecognizerTouch =
  EventRecognizers.TOUCH_PRIMARY_DOWN
mode.marqueeSelectionInputMode.beginRecognizerTouch =
  EventRecognizers.TOUCH_PRIMARY_DOWN
mode.moveSelectedItemsInputMode.beginRecognizerTouch =
  EventRecognizers.TOUCH_PRIMARY_DOWN

beginPinchZoomRecognizer

: function(EventArgs, unknown): boolean
Gets or sets the event recognizer that determines whether to start the 'pinch' gesture with TOUCH input.
final

Property Value

The default recognizer detects down events of the secondary touch device.

See Also

Developer's Guide

beginRecognizer

: function(EventArgs, unknown): boolean
Gets or sets the event recognizer that determines whether to start moving the viewport.

The default instance detects MOUSE or PEN DOWN events with the MOUSE_LEFT or MOUSE_MIDDLE button.

If this input mode is a child mode of GraphEditorInputMode, the default is another recognizer which additionally requires the Ctrl modifier or Space key to be held down.

final

See Also

Developer's Guide

beginRecognizerTouch

: function(EventArgs, unknown): boolean
Gets or sets the event recognizer that determines whether to start the 'move viewport' gesture with TOUCH input.
final

Property Value

The default recognizer is TOUCH_PRIMARY_DOWN.

See Also

Developer's Guide

controller

: ConcurrencyController
protectedreadonly
Gets the installed controller.
protectedreadonlyfinal

dragCursor

: Cursor
Gets or sets the cursor to use during dragging.
The default is POINTER.
conversionfinal

See Also

Developer's Guide

enabled

: boolean
Gets or sets the enabled state of this input mode.
Clients can use this property to disable or reenable this instance. This will set the enabled property of the installed controller so a disabled instance should never try to acquire the input mutex.

Examples

Disabling the MoveViewportInputMode on its parent input mode
mode.moveViewportInputMode.enabled = false

See Also

Developer's Guide

exclusive

: boolean
Gets or sets a value indicating whether this mode will be the only one running when it has the mutex.

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.

final

finishPinchZoomRecognizer

: function(EventArgs, unknown): boolean
Gets or sets the event recognizer that determines whether to finish the pinch zoom gesture or finish the move if no primary device is down.
final

Property Value

The default instance detects detects up events of the secondary touch device, CANCEL, and DRAG_CAPTURE_LOST events.

See Also

Developer's Guide

finishRecognizer

: function(EventArgs, unknown): boolean
Gets or sets the event recognizer that determines whether to finish moving the viewport.
The default instance detects UP events with the MOUSE_LEFT button, MOUSE_MIDDLE button, CANCEL, or DRAG_CAPTURE_LOST events for MOUSE or PEN input.
final

See Also

Developer's Guide

finishRecognizerTouch

: function(EventArgs, unknown): boolean
Gets or sets the event recognizer that determines whether to finish the 'move viewport' or 'pinch' gesture with TOUCH input.
final

Property Value

The default instance detects primary touch up, CANCEL and DRAG_CAPTURE_LOST events.

See Also

Developer's Guide

inertia

: InertiaPolicies
Gets or sets the mode that determines when to use inertia when dragging the viewport.
conversionfinal

inertiaDuration

: TimeSpan
Gets or sets the duration of the inertia movement.
The default value is 1.5 seconds.
conversionfinal

moveRecognizer

: function(EventArgs, unknown): boolean
Gets or sets the event recognizer that determines whether to move the viewport.
final

Property Value

The default recognizer is MOUSE_DRAG.

See Also

Developer's Guide

moveRecognizerTouch

: function(EventArgs, unknown): boolean
Gets or sets the event recognizer that determines whether to move the viewport or zoom the canvas with TOUCH input.
final

Property Value

The default recognizer is TOUCH_PRIMARY_DRAG.

See Also

Developer's Guide

parentInputModeContext

: IInputModeContext
protectedreadonly
Retrieves the IInputModeContext this mode has been installed in.
The value will be null if this mode is currently not installed.
protectedreadonlyfinal

pinchLockZoomThreshold

: number
Gets or sets the distance threshold for returning from pinch zoom to two-finger panning with locked zoom level.
final

pinchZoomRecognizer

: function(EventArgs, unknown): boolean
Gets or sets the event recognizer that determines whether to zoom the canvas using the 'pinch' gesture or move the viewport if no primary device is down.
final

Property Value

The default recognizer detects move events of the secondary touch device.

See Also

Developer's Guide

pinchZoomThreshold

: number
Gets or sets a value that determines how far the two pointers have to move apart while panning with two fingers in order to start a zoom gesture.
Moving the fingers away from each other right from the start will instantly result in a pinch zoom.
final

priority

: number
Gets the priority of this input mode.
The priority will influence the order in which the modes will be installed into the CanvasComponent. The lower the priority value, the earlier it will be installed. If two modes are using the same priority value, the first one to be registered will be installed earlier.
final

snapPanning

: SnapPanningBehaviors
Gets or sets a value indicating whether touch panning should snap to the x- or y-axis.
This only applies to panning with touch gestures.
conversionfinal

See Also

API
snapPanningThreshold

snapPanningThreshold

: number
Gets or sets a value that determines how far the pointer has to move away from the snapped axis in order to start with free panning.
This only applies to panning with touch gestures.
final

See Also

API
snapPanning

validBeginCursor

: Cursor
Gets or sets the cursor to use when beginning to move the viewport is valid.
The default is null
conversionfinal

validBeginRecognizer

: function(EventArgs, unknown): boolean
Gets or sets the event recognizer that determines whether it is valid to begin moving the viewport.
The default recognizer is ALWAYS.
final

See Also

Developer's Guide

Methods

arm

()
protected
Called to prepare moving the viewport when the mouse is pressed.
This will set the mouse cursor to dragCursor.
protected

cancel

()
Cancels navigation.

disarm

()
protected
Called after moving the viewport is finished or canceled.
This will reset the mouse cursor.
protected

install

(context: IInputModeContext, controller: ConcurrencyController)
Installs this mode into the given context that is provided by the canvas.

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

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

API
uninstall

onCanceled

()
protected
Called after cancel has been called.

Can be overridden in subclasses to perform additional actions after the mode has been canceled.

This implementation does nothing.

protected

onConcurrencyControllerActivated

()
protected
Called after the active property of the installed ConcurrencyController has been set to true.

Can be overridden in subclasses to perform additional actions after the mode has been activated.

Overriding implementations should call the base implementation.

protected

onConcurrencyControllerDeactivated

()
protected
Called after the active property of the installed ConcurrencyController has been set to false.

Can be overridden in subclasses to perform additional actions after the mode has been deactivated.

Overriding implementations should call the base implementation.

protected

onDragCanceled

(evt: InputModeEventArgs)
protected
Triggers the drag-canceled event.
protected

Parameters

evt: InputModeEventArgs
The event argument that contains context information.

onDragCanceling

(evt: InputModeEventArgs)
protected
Triggers the drag-canceling event.
protected

Parameters

evt: InputModeEventArgs
The event argument that contains context information.

onDragFinished

(evt: InputModeEventArgs)
protected
Called once the drag has been finalized.
This method triggers the drag-finished event.
protected

Parameters

evt: InputModeEventArgs
The event argument that contains context information.

onDragFinishing

(evt: InputModeEventArgs)
protected
Called before the drag will be finalized.
This method triggers the drag-finishing event.
protected

Parameters

evt: InputModeEventArgs
The event argument that contains context information.

onDragged

(evt: InputModeEventArgs)
protected
Called at the end of each drag.
This method triggers the dragged event.
protected

Parameters

evt: InputModeEventArgs
The event argument that contains context information.

onDragging

(evt: InputModeEventArgs)
protected
Called at the start of each drag.
This method triggers the dragging event.
protected

Parameters

evt: InputModeEventArgs
The event argument that contains context information.

onDragStarted

(evt: InputModeEventArgs)
protected
Triggers the drag-started event.
protected

Parameters

evt: InputModeEventArgs
The event argument that contains context information.

onDragStarting

(evt: InputModeEventArgs)
protected
Triggers the drag-starting event.
protected

Parameters

evt: InputModeEventArgs
The event argument that contains context information.

onStopped

()
protected
Called after tryStop has been called.

Can be overridden in subclasses to perform additional actions after the mode has been stopped.

This implementation does nothing.

protected

tryStop

(): boolean
Will be called to request a stop of the current editing progress.
This should stop the current edit, if one is in progress, and possibly commit all pending changes. If stopping is not possible, this method can return false

Return Value

boolean
true if and only if the editing has been stopped or there was no edit in progress

uninstall

(context: IInputModeContext)
Uninstalls this mode from the given context that is provided by the canvas.

This method is called to unregister this instance. Subclasses should override this method to unregister the event handler delegates and free resources which were registered in the install method.

Overriding implementations should call the base implementation at the end.

Parameters

context: IInputModeContext
The context that this instance shall be uninstalled from.

See Also

API
install

Events

'drag-canceled'

: InputModeEventArgs
Occurs when the drag has been canceled.

Properties of

InputModeEventArgs
context: IInputModeContext
Gets the context for the current event.

See Also

Developer's Guide

'drag-canceling'

: InputModeEventArgs
Occurs before the drag will be canceled.

Properties of

InputModeEventArgs
context: IInputModeContext
Gets the context for the current event.

See Also

Developer's Guide

'drag-finished'

: InputModeEventArgs
Occurs once the drag has been finished.

Properties of

InputModeEventArgs
context: IInputModeContext
Gets the context for the current event.

See Also

Developer's Guide

'drag-finishing'

: InputModeEventArgs
Occurs before the drag will be finished.

Properties of

InputModeEventArgs
context: IInputModeContext
Gets the context for the current event.

See Also

Developer's Guide

'drag-started'

: InputModeEventArgs
Occurs once the drag is initialized and has started.

Properties of

InputModeEventArgs
context: IInputModeContext
Gets the context for the current event.

See Also

Developer's Guide

'drag-starting'

: InputModeEventArgs
Occurs once the drag is starting.

Properties of

InputModeEventArgs
context: IInputModeContext
Gets the context for the current event.

See Also

Developer's Guide

'dragged'

: InputModeEventArgs
Occurs at the end of every drag.

Properties of

InputModeEventArgs
context: IInputModeContext
Gets the context for the current event.

See Also

Developer's Guide

'dragging'

: InputModeEventArgs
Occurs at the start of every drag.

Properties of

InputModeEventArgs
context: IInputModeContext
Gets the context for the current event.

See Also

Developer's Guide