hitTestItem Method

Summary

First item that is under a physical (in viewer pixel) coordinates.

Syntax

JavaScript Syntax

ImageViewer.prototype.hitTestItem = function(point)

TypeScript Syntax

hitTestItem(point: LeadPointD): ImageViewerItem;

Parameters

point

The point in physical (in viewer pixel) coordinates.

Return Value

The first item that is under this point or null if no such item exists.

Remarks

HitTestItem method will return the item if any part of it is under the specified point. To further fine-tune the hit testing operation and obtain the specific item part, call HitTestItemPart passing the item obtained from HitTestItem and the desired part.

For more information refer to Image Viewer Layouts, Image Viewer Appearance, Image Viewer Items, Image Viewer Transformation, and Image Viewer Bounds and Transform.

Example

This example will add a few items to the viewer and then perform hit-testing using the mouse showing the specific item part.

Run the demo, click the Example button and notice perform hit-testing.

Start with the ImageViewer example, remove all the code inside the example function (search for the "// TODO: add example code here" comment) and insert the following code:

JavaScript Example

// Clear all the images already the viewer 
this._imageViewer.items.clear(); 
// Use vertical view layout 
this._imageViewer.viewLayout = new lt.Controls.ImageViewerVerticalViewLayout(); 
// Make sure the item size is larger than the image size (thumbnails mode) 
this._imageViewer.itemSize = lt.LeadSizeD.create(200, 200); 
this._imageViewer.itemPadding = lt.Controls.ControlPadding.create(8, 8, 8, 20); 
this._imageViewer.imageBorderThickness = 1; 
 
// Add 4 items to the viewer 
for (var page = 1; page <= 4; page++) { 
   var item = new lt.Controls.ImageViewerItem(); 
   var imageUrl = "http://demo.leadtools.com/images/png/ocr" + page.toString() + ".png"; 
   item.url = imageUrl; 
   this._imageViewer.items.add(item); 
} 
 
var itemPartNames = [ "View", "Item", "Content", "Image", "TextArea", "Text", "Floater" ]; 
 
this._imageViewer.interactiveService.tap.add(function (sender, e) { 
   var point = lt.LeadPointD.create(e.position.x, e.position.y); 
   // Hit-test the item 
   var item = this.owner.hitTestItem(point); 
   // If we have an item, find out the part 
   if (item != null) { 
      var part = this.owner.hitTestItemPart(item, point); 
      infoLabel.textContent = "Clicked the " + itemPartNames[part] + " part of item at index " + this.owner.items.indexOf(item).toString(); 
   } 
   else { 
      infoLabel.textContent = "Click the view"; 
   } 
});

Requirements

Target Platforms

Reference

ImageViewer Class

ImageViewer Members

Leadtools.Controls Namespace

Help Version 19.0.2017.10.27

Leadtools.Controls Assembly

Introduction

Getting Started

Namespaces

Leadtools.Controls Namespace

Assemblies