Skip to main content

ImageZoomNavigatorSettings Class

Contains the ImageZoomNavigator extension settings.

Namespace: DevExpress.Web.Mvc

Assembly: DevExpress.Web.Mvc5.v24.2.dll

Declaration

public class ImageZoomNavigatorSettings :
    SettingsBase

Remarks

To declare the ImageZoomNavigator in a View, invoke the ExtensionsFactory.ImageZoomNavigator helper method. This method returns the ImageZoomNavigator extension that is implemented by the ImageZoomNavigatorExtension class.

To configure the ImageZoomNavigator extension, pass the ImageZoomNavigatorSettings object to the ExtensionsFactory.ImageZoomNavigator helper method as a parameter. The ImageZoomNavigatorSettings object contains all the ImageZoomNavigator extension settings.

Refer to the ImageZoomNavigator Overview topic to learn how to add the ImageZoomNavigator extension to your project.

Example

Dynamically added items:

@Html.DevExpress().ImageZoomNavigator(settings => {
settings.Name = "zoomNavigator";
...
settings.Items.Add("~/Images/small/img1.jpg", "~/Images/large/img1.jpg");
settings.Items.Add("~/Images/small/img2.jpg", "~/Images/large/img2.jpg");
settings.Items.Add("~/Images/small/img3.jpg", "~/Images/large/img3.jpg");
...
}).GetHtml()

Data Binding:

@Html.DevExpress().ImageZoomNavigator(
    settings => {
        settings.Name = "zoomNavigator";
        settings.SettingsAutoGeneratedImages.ImageHeight = Unit.Pixel(350);
        settings.SettingsAutoGeneratedImages.ImageWidth = Unit.Pixel(350);
        settings.SettingsAutoGeneratedImages.LargeImageHeight = Unit.Pixel(900);
        settings.SettingsAutoGeneratedImages.LargeImageWidth = Unit.Pixel(900);
        settings.SettingsAutoGeneratedImages.ThumbnailHeight = Unit.Pixel(75);
        settings.SettingsAutoGeneratedImages.ThumbnailWidth = Unit.Pixel(75);
        settings.SettingsAutoGeneratedImages.ImageCacheFolder = "~/Thumb/";
        settings.Styles.Thumbnail.ImageHeight = Unit.Pixel(75);
        settings.Styles.Thumbnail.ImageWidth = Unit.Pixel(75);
    }).BindToFolder("~/Content/ImageZoom/shoes/").GetHtml()

Online Demo

Image Zoom Navigator

Inheritance

Object
SettingsBase
ImageZoomNavigatorSettings
See Also