Base class for the rich user experience features of the ImageViewer.
public abstract class ImageViewerInteractiveMode
ImageViewerInteractiveMode works with the InteractiveService object of the ImageViewer to provide rich user interface experiences when the user interacts with the viewer using mouse or touch.
ImageViewerInteractiveMode is a base abstract class: from it you can derive your own class to handle custom interaction with the viewer. For more information and for a list of the out-of-the-box modes provided by LEADTOOLS, refer to Image Viewer Interactive Modes.
ImageViewerInteractiveMode has the following functionality:
Member | Description |
---|---|
Cursor to use when the interactive mode is in an idle, working or hit-test state (for desktop browsers). |
|
The mouse button attached to this mode (for desktop browsers) |
To use an interactive mode, you create an instance of any of the derived classes and assign it to the viewer using one of the following methods:
ImageViewer.DefaultInteractiveMode: Assigns the interactive mode to the left mouse button on desktop browsers or default touch events on devices that support touch.
ImageViewer.InteractiveModes: Add more than one interactive mode to the viewer.
Within the derived class, attach listeners to the events of InteractiveService to perform actions based on user input. Set InteractiveEventArgs.IsHandled to true to mark the events as handled so that other interactive modes will not also respond to the events, if desired.
You can use multiple interactive modes at the same time. For example, use the following code to support panning/zooming with the left mouse button and magnify glass with the right button:
This example will create a custom ImageViewerInteractiveMode that will rotate the image when the user clicks or touches and drags on the viewer.
using Leadtools;
using Leadtools.Controls;
using Leadtools.Codecs;
using Leadtools.Drawing;
using Leadtools.ImageProcessing;
using Leadtools.ImageProcessing.Color;
public ImageViewerForm _form = new ImageViewerForm();
public ImageViewer _imageViewer;
public void ImageViewerInteractiveModeExample()
{
// Get the Form's ImageViewer control
_imageViewer = _form.ImageViewer;
// Use vertical view layout
_imageViewer.ViewLayout = new ImageViewerVerticalViewLayout();
// Add 4 items to the viewer
using (var codecs = new RasterCodecs())
{
for (var page = 1; page <= 4; page++)
{
var item = new ImageViewerItem();
var fileName = Path.Combine(LEAD_VARS.ImagesDir, string.Format("ocr{0}.tif", page));
// Create a thumbnail from the image
using (var image = codecs.Load(fileName, page))
{
item.Image = image.CreateThumbnail(180, 180, 24, RasterViewPerspective.TopLeft, RasterSizeFlags.Resample);
}
item.Text = string.Format("Item {0}", page - 1);
_imageViewer.Items.Add(item);
}
}
// Create and add the ItemRotate interactive mode to the viewer
ItemRotateInteractiveMode itemRotate = new ItemRotateInteractiveMode { IsEnabled = true };
_imageViewer.InteractiveModes.BeginUpdate();
_imageViewer.InteractiveModes.Add(itemRotate);
_imageViewer.InteractiveModes.EndUpdate();
}
public class ItemRotateInteractiveMode : ImageViewerInteractiveMode
{
public ItemRotateInteractiveMode() : base()
{
this.AutoItemMode = ImageViewerAutoItemMode.AutoSet;
this.IdleCursor = Cursors.VSplit;
this.MouseButtons = MouseButtons.Left | MouseButtons.Right;
}
public override string Name
{
get { return "ItemRotate"; }
}
public override int Id
{
get { return ImageViewerInteractiveMode.UserModeId; }
}
public override void Start(ImageViewer imageViewer)
{
base.Start(imageViewer);
var service = base.InteractiveService;
// Rotate events on horizontal drag
service.DragStarted += new EventHandler<InteractiveDragStartedEventArgs>(service_DragStarted);
service.DragDelta += new EventHandler<InteractiveDragDeltaEventArgs>(service_DragDelta);
service.DragCompleted += new EventHandler<InteractiveDragCompletedEventArgs>(service_DragCompleted);
// Reset event on double tap
service.DoubleTap += new EventHandler<InteractiveEventArgs>(service_DoubleTap);
}
public override void Stop(ImageViewer imageViewer)
{
if (IsStarted)
{
var service = base.InteractiveService;
service.DragStarted -= new EventHandler<InteractiveDragStartedEventArgs>(service_DragStarted);
service.DragDelta -= new EventHandler<InteractiveDragDeltaEventArgs>(service_DragDelta);
service.DragCompleted -= new EventHandler<InteractiveDragCompletedEventArgs>(service_DragCompleted);
service.DoubleTap -= new EventHandler<InteractiveEventArgs>(service_DoubleTap);
base.Stop(imageViewer);
}
}
private void service_DragStarted(object sender, InteractiveDragStartedEventArgs e)
{
// Make sure pinch is not working, otherwise, ignore pan
if (!this.CanStartWork(e))
return;
// Make sure we are on an item
if (this.Item == null)
return;
Debug.WriteLine("Item Starting Rotation Angle: " + this.Item.RotateAngle);
e.IsHandled = true;
this.OnWorkStarted(EventArgs.Empty);
}
private void service_DragDelta(object sender, InteractiveDragDeltaEventArgs e)
{
if (!this.IsWorking)
return;
var item = this.Item;
if (item == null)
return;
// Find out what to do
if (e.Change.X == 0 && e.Change.Y == 0)
return;
// Rotate clockwise when dragging right and counter-clockwise when dragging left
if(e.Change.X > 0)
this.Item.RotateAngle += 2;
else if (e.Change.X < 0)
this.Item.RotateAngle -= 2;
e.IsHandled = true;
}
private void service_DragCompleted(object sender, InteractiveDragCompletedEventArgs e)
{
if (!this.IsWorking)
return;
Debug.WriteLine("Item Final Rotation Angle: " + this.Item.RotateAngle);
e.IsHandled = true;
OnWorkCompleted(EventArgs.Empty);
}
private void service_DoubleTap(object sender, InteractiveEventArgs e)
{
// Make sure we not working already
if (this.IsWorking || !this.CanStartWork(e))
return;
// Make sure we have an item
var item = this.Item;
if (item == null)
return;
e.IsHandled = true;
this.OnWorkStarted(EventArgs.Empty);
ResetPosition(this.ImageViewer, item);
this.OnWorkCompleted(EventArgs.Empty);
}
private void ResetPosition(ImageViewer imageViewer, ImageViewerItem item)
{
// Use the identity matrix to reset the transform of the item
item.Transform = LeadMatrix.Identity;
}
}
static class LEAD_VARS
{
public const string ImagesDir = @"C:\LEADTOOLS23\Resources\Images";
}