ImageViewerAutoPanInteractiveMode Object

Summary

Automatically pans the view when the mouse, touch screen, or multi-touch device is next to the edge.

Syntax

JavaScript Syntax

function lt.Controls.ImageViewerAutoPanInteractiveMode 
	extends lt.Controls.ImageViewerInteractiveMode

TypeScript Syntax

class lt.Controls.ImageViewerAutoPanInteractiveMode() 
	extends lt.Controls.ImageViewerInteractiveMode

Remarks

The ImageViewerAutoPanInteractiveMode object derives from the ImageViewerInteractiveMode object and subscribes to the following events of the InteractiveService:

ImageViewerAutoPanInteractiveMode works when the view boundary is larger than the current image viewer client area as follows:

When the mouse or touch device is close to the edge of the viewer, and there is more room in that direction, then this mode will call ImageViewer.scrollByRestrict to pan the view in that direction. How far the pointer is from the boundary to be considered "close" is determined by the edgeSize property. The delay before auto-panning starts is controlled by the beginDelay property.
If the user does not move the pointer, and the panDelay has elapsed, then this mode will continue panning the viewer in that direction until it reaches the maximum value allowed by the scrollByRestrict method.

The ImageViewerAutoPanInteractiveMode can work with or without the user holding a mouse button down through the value of the mouseButtons property. It can also be combined with any other mode to allow auto-panning the viewer while the other mode is running because it:

does not set the InteractiveEventArgs.isHandled property to true when working
relies on the Move event instead of more commonly used dragDelta event

The example code shows how to use auto-pan with the ImageViewerRubberBandInteractiveMode object to allow drawing a rubber band and moving toward the edge of the viewer when the user reaches the edge. This is the auto-pan performing extra functionality to rubber-band.

For more information, refer to Image Viewer Interactive Modes.

Example

JavaScript Example

this._imageViewer.interactiveModes.beginUpdate(); 
var autopan = new lt.Controls.ImageViewerAutoPanInteractiveMode(); 
autopan.panDelay = 100; 
this._imageViewer.interactiveModes.add(autopan); 
this._imageViewer.interactiveModes.endUpdate();

Requirements

Target Platforms

Reference

ImageViewerAutoPanInteractiveMode Members

Leadtools.Controls Namespace

Help Version 19.0.2017.10.27

Leadtools.Controls Assembly

Introduction

Getting Started

Namespaces

Leadtools.Controls Namespace

Assemblies