getItemViewBounds Method

Summary

Current physical (in control pixel coordinates) bounds of any part of an item.

Syntax

JavaScript Syntax

ImageViewer.prototype.getItemViewBounds = function(item, part, clipped)

TypeScript Syntax

getItemViewBounds(item: ImageViewerItem, part: ImageViewerItemPart, clipped: boolean): LeadRectD;

Parameters

item

The item. Must be a valid item inside this viewer.

part

The item part requested.

clipped

true to return the bounding rectangle intersected with the current viewer control area, otherwise; false.

Return Value

The bounding rectangle in pixels or LeadRectD.Empty if the item is not visible, does not have an image or outside the clipping area.

Remarks

Use ConvertBoundsToView to convert a bound from logical to physical coordinates.

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

Example

This example will show how to use GetItemBounds to perform manual hit-testing on the item.

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); 
} 
 
this._imageViewer.interactiveService.tap.add(function (sender, e) { 
   // Loop through each item, get the view bounds of the image (the physical location and size on the viewer surface of the item) 
   // and perform hit-testing 
   for (var i = 0; i < this.owner.items.count; i++) { 
      var item = this.owner.items.item(i); 
 
      // Pass part as image and clipped as true, we are only interested on what we are seeing 
      var bounds = this.owner.getItemViewBounds(item, lt.Controls.ImageViewerItemPart.image, true); 
      // Hit-test. GetItemViewBounds returns the value in the control coordinates, same as the mouse click 
      if (bounds.contains(e.position.x, e.position.y)) { 
         alert("Clicked the image of item at index " + this.owner.items.indexOf(item)); 
         return; 
      } 
   } 
});

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