[Expand]General Information
[Collapse]WinForms Controls
  .NET Core Support
 [Expand]What's Installed
 [Expand]Build an Application
 [Collapse]Controls and Libraries
  [Expand]Forms and User Controls
  [Expand]Messages, Notifications, and Dialogs
  [Collapse]Editors and Simple Controls
    Included Controls and Components
   [Expand]Common Editor Features and Concepts
   [Expand]Lookup Editors
    Popup Container Editor
   [Expand]Token Edit Control
   [Expand]Breadcrumb Edit Control
   [Expand]Range Control
   [Collapse]Image Slider
     Virtual Mode
    Camera Control
    Templated ListBox Controls
  [Expand]Ribbon, Bars and Menu
  [Expand]Application UI Manager
  [Expand]Docking Library
  [Expand]Data Grid
  [Expand]Vertical Grid
  [Expand]Property Grid
  [Expand]Pivot Grid
  [Expand]Tree List
  [Expand]Gantt Control
  [Expand]Chart Control
  [Expand]Map Control
  [Expand]Rich Text Editor
  [Expand]Spell Checker
  [Expand]Form Layout Managers
  [Expand]Navigation Controls
  [Expand]PDF Viewer
  [Expand]TreeMap Control
  [Expand]Sunburst Control
 [Expand]Common Features
  Get More Help
 [Expand]API Reference
[Expand]ASP.NET Controls and MVC Extensions
[Expand]ASP.NET Bootstrap Controls
[Expand]ASP.NET Core Bootstrap Controls
[Expand]WPF Controls
[Expand]Xamarin Controls
[Expand]Windows 10 App Controls
[Expand]Office File API
[Expand]Report and Dashboard Server
[Expand]eXpressApp Framework
[Expand]eXpress Persistent Objects
[Expand]CodeRush Classic
[Expand]Cross-Platform Core Libraries
[Expand]Tools and Utilities
 End-User Documentation
View this topic on docs.devexpress.com (Learn more)

Virtual Mode

The Image Slider control in the Virtual Mode does not display images from its ImageSlider.Images collection. Instead, each time a new image needs to be displayed, the ImageSlider.GetImage event occurs. Handling this event allows you to pass the required image to the control. In other words, the Virtual Mode is the mode for the upload of dynamic images.

To make an ImageSlider control run in the Virtual Mode, set the ImageSlider.VirtualMode property to true. After that each time an end-user hovers the control, the ImageSlider.CanGetNextPrevImage event is raised. Handling this event enables or disables specific Image Slider navigation buttons. This event receives the CanGetNextPrevImageEventArgs type parameter, which has two properties:

Consider the following example.

In the code above, the image slider will be able to display a sequence of three images. First, we check the CanGetNextPrevImageEventArgs.IsNext property. If it equals true, we check how many images have already been uploaded. If less than 3 (the custom customImageIndex variable is less than 2), forward image sliding will be allowed. In this case, the 'Next' button will be enabled and clicking it will raise the ImageSlider.GetImage event. Otherwise, if the CanGetNextPrevImageEventArgs.IsNext property equals false, the backward sliding will only be available if the currently displayed image is not the very first one (the customImageIndex variable is more than 0). If so, an end-user will be able to click the 'Previous' button and the ImageSlider.GetImage event will occur.

The ImageSlider.GetImage event receives the GetImageEventArgs type parameter and has five properties:

To display the correct image, check which of the GetImageEventArgs.IsStartUp, GetImageEventArgs.IsNext and GetImageEventArgs.IsPrev properties equals true and assign a required image to the GetImageEventArgs.Image property. Bear in mind that image sliding can be performed not only via navigation buttons, but via dragging the current image to left or right. If you drag the image not far enough, the Image Slider will skip back to the currently displayed image upon releasing. That is why the GetImageEventArgs.CurrentImageUpdated property check is required. Increment/decrement uploaded images count only if the GetImageEventArgs.CurrentImageUpdated property equals true.

See the following code for a complete example of how to implement custom image uploading logic in the Virtual Mode slider.

Expanded Example

This example demonstrates the ImageSlider control running in the Virtual Mode.


A complete sample project is available at https://github.com/DevExpress-Examples/imageslider-virtual-mode-e4285

Is this topic helpful?​​​​​​​