ImageViewerSelectItemsInteractiveMode Object

Summary

Allows selection of items using the mouse, touch or keyboard.

Syntax
TypeScript
JavaScript
function lt.Controls.ImageViewerSelectItemsInteractiveMode 
	extends lt.Controls.ImageViewerRubberBandInteractiveMode 
class lt.Controls.ImageViewerSelectItemsInteractiveMode() 
	extends ImageViewerRubberBandInteractiveMode 
Remarks

The ImageViewerSelectItemsInteractiveMode object derives from the ImageViewerRubberBandInteractiveMode object and subscribes to the following extra events:

In a break from normal behavior, the InteractiveEventArgs.IsHandled property is explicitly set to false when a valid rubberband operation starts in order to allow fall-through to other interactive modes that may handle scrolling.

If isKeyboardEnabled is true and a valid navigation key is pressed (Left, Up, Right, or Down arrows; or the PageUp, PageDown, Home, or End keys), the InteractiveEventArgs.isHandled will be set to true regardless of whether selections change.

This mode allows you to use the mouse, touch or keyboard devices to select items in the image viewer. Use this interactive mode to create an image viewer that acts like a Windows Explorer view in thumbnail modes.

The selectionMode property determines whether one or multiple items can be selected. Items are selected by modifying the ImageViewerItem.isSelected property (refer to Image Viewer Items).

If the viewer was set up with a different style for selected items, then the UI will be updated accordingly. Refer to Image Viewer Appearance for more information.

If selectionMode is Single, then this mode will work as follows:

  • Clicking an item will select it. The previously selected item, if any, will be de-selected.

  • When isKeyboardEnabled is true, using the cursor, page up/down, home and end keys will move the selection in the items in a grid fashion inside the current ViewLayout. For example, pressing the left key will select the item to the left of the currently selected one while pressing up will select the item above, and so forth. The previously selected item, if any, will be de-selected.

  • Clicking an area outside any item will be ignored.

If selectionMode is Multi, then this mode will work as follows:

  • Clicking an item will select it, if the current multiSelectKeyModifier is pressed (by default it is CTRL), then the previously selected item(s) state will not change. If the key was not pressed, the previously selected item(s) will be de-selected.

  • When IsKeyboardEnabled is true, using the keys mentioned above will work in the same manner except that MultiSelectKeyModifier is also used to keep or remove the selection state of the previously selected items.

  • Clicking an area outside any item and dragging with the mouse will start drawing a rubber band selection rectangle. When this is done, all the items that intersect with this rectangle will be selected. The multiSelectKeyModifier is also used as before. If no items intersect with the rubber band rectangle and the multiSelectKeyModifier was not pressed, then all the items are de-selected.

If SelectionMode is None, then this interactive mode does not change an item's selection state. Hover will continue working.

The ImageViewerSelectItemsInteractiveMode will also update the hover state of the items in platforms where a mouse is supported. When the mouse is over an item, the ImageViewerItem.isHovered property will be set to true. If the viewer was set up with different styles for hovered items, the UI is updated. Moving out of an item area will set the ImageViewerItem.isHovered back to false.

Yhe canSelectDisabledItems and canHoverDisabledItems properties control how the mode treats items that are disabled (the value of ImageViewerItem.IsEnabled is false). By default, these items' selection and hover states cannot be changed. By setting CanSelectDisabledItems or CanHoverDisabledItems to true, disabled items can be selected/deselected or hovered/unhovered accordingly.

The mode sets the value of ImageViewerInteractiveMode.workOnBounds to false and autoItemMode to ImageViewerAutoItemMode.never since it does not work on any specific items. The isDragMouseWheelEnabled property is set to false as well, to disable firing drag events using the mouse wheel.

Note: For optimization purposes, this mode will use ImageViewerItems.select to select and unselect items in a bulk instead of setting the ImageViewerItem.IsSelected property directly.

For more information, refer to Image Viewer Interactive Modes, Image Viewer Items and Image Viewer Appearance.

Example

For an example, see ImageViewer.SelectedItemsChanged.

Requirements

Target Platforms

Help Version 22.0.2021.9.24
Products | Support | Contact Us | Intellectual Property Notices
© 1991-2021 LEAD Technologies, Inc. All Rights Reserved.

Leadtools.Controls Assembly
Products | Support | Contact Us | Intellectual Property Notices
© 1991-2021 LEAD Technologies, Inc. All Rights Reserved.