Leadtools.Controls Namespace > ImageViewer Object : Items Property |
get_items();
Object.defineProperty('items');
Type | Description |
---|---|
ImageViewerItems | The collection of items in this ImageViewer. |
Items is of type ImageViewerItems which supports standard collection operations such as adding, removing and enumerating the items.
The viewer listens to the events of ImageViewerItems (Using LeadCollection.CollectionChanged) and automatically re-calculates the view layout and update the transformations used when an item is added, removed or changed by the view and items by calling UpdateTransform.
Use BeginUpdate and EndUpdate to optimize this behavior when adding or removing multiple items at once.
The viewer will automatically keep the ActiveItem property set to an item inside this collection. Usually, the first item added if the user did not change the value. When an item is removed, the viewer will set ActiveItem to the new item that takes index in the collection. Finally when no items are left in the collection, ActiveItem will be set to null.
For more information, refer to Image Viewer Items.
This example will show how to add, remove and enumerate items in the viewer.
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:
// Clear all the images already the viewer this._imageViewer.items.clear(); // Use vertical view layout this._imageViewer.viewLayout = new lt.Controls.ImageViewerVerticalViewLayout(); 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; item.tag = page; // Set the tag of each item to be the page number this._imageViewer.items.add(item); } // Show the count alert("This must say 4: " + this._imageViewer.items.count); // Remove the item at index 1 (page 2) this._imageViewer.items.removeAt(1); alert("This must now say 3: " + this._imageViewer.items.count); // Loop through each item and show the tag, since we remove page 2, it must say 1, 3, 4 for (var i=0; i<this._imageViewer.items.count; i++) { var item = this._imageViewer.items.item(i); var pageNumber = item.tag; alert(pageNumber.toString()); }