ImageViewer Client Object
The LEADTOOLS ImageViewer control includes a client-side Javascript class to update the server control without posting the entire page back to the server. Most of the ImageViewer server properties can be accessed through the Javascript class. You can access the LEADTOOLS ImageViewer control on the client side by using the ASP.NET generated ClientID on the WebForm.
Client Naming
The client-side version of the control uses the same naming convention as the server control version for easier coding. All Leadtools public class definitions in the ImageViewer.js and Utilities.js files contain the prefix "ltwf" to avoid conflicts with any other components on the page.
Client Public Methods/Properties
All server side object properties can be accessed on the client by using two methods: "GetServerPropertyName", and "SetServerPropertyName", where “ServerPropertyName” is replaced with the name of the property to be accessed or set.
The following table lists the Server properties and the mapped client methods:
Property Name(Server) | Method Name(Client) | Description | Input Type |
---|---|---|---|
N/A | ID | Gets the generated by ASP.NET control identifier. | - |
ImageUrl |
GetImageUrl():string SetImageUrl(value: |
Gets or sets the URL of the image to be displayed. |
|
GetImageSize():ltwfSize Client Class SetImageSize(value:ltwfSize Client Class) |
Gets or sets the size(width/height) of the image to be loaded in the ImageViewer Control. |
ltwfSize Client Class representing the size of the image. |
|
GetScaleFactor(): SetScaleFactor(value: |
Gets/sets The zoom factor used to display the image. |
100 means displaying the image in original width/height (1:1). |
|
GetSizeMode(): SetSizeMode(value: |
Gets or sets how the control displays the image and the automatic adjustments of the display rectangles. |
||
GetHorizontalAlignMode(): SetHorizontalAlignMode(value: |
Gets or sets the horizontal alignment to display the image. |
||
GetVerticalAlignMode(): SetVerticalAlignMode(value: |
Gets or sets the vertical alignment to display the image. |
||
GetScrollBarSize(): SetScrollBarSize(value: |
Gets or sets the size of the scroll bar used if the image to be displayed is greater than the control client area. |
||
GetResourcesPath(): SetResourcesPath(value: |
Gets or sets the size of the scroll bar used if the image to be displayed is greater than the control client area. |
||
GetHorizontalRealScaleFactor(): |
Gets the real horizontal scale factor used to display the image. |
- | |
GetVerticalRealScaleFactor(): |
Gets the real vertical scale factor used to display the image. |
- | |
N/A | Apply() | Apply all the options set by the user and update the viewable area. | - |
Client Public Events
All public client-side Leadtools events can be overridden with your own function. The following example displays a Javascript alert whenever the ImageUrl property is changed on the ImageViewer client object.
ImageViewer1.ImageUrlChanged = myImageUrlChanged;
function myImageUrlChanged()
{
alert("ImageUrl Changed!");
}
The following table lists the Client side events that can be overridden:
Event Name(Server) | Event Name(Client) | Raised when |
---|---|---|
ImageUrlChanged |
ImageUrl property is changed. |
|
ImageSizeChanged |
ImageSize property is changed. |
|
ScaleFactorChanged |
ScaleFactor property is changed. |
|
SizeModeChanged |
SizeMode property is changed. |
|
HorizontalAlignModeChanged |
HorizontalAlignMode property is changed. |
|
VerticalAlignModeChanged |
VerticalAlignMode property is changed. |
|
ScrollbarSizeChanged |
ScrollBarSize property is changed. |
|
ResourcesPathChanged |
ResourcesPath property is changed. |