Skip to main content
A newer version of this page is available. .

Image Slider

  • 2 minutes to read

The ImageSlider is an image-browsing control with two click-able navigation elements that are visible when hovered. To display images in an ImageSlider, add them to the ImageSlider.Images collection. See the example below to learn more.

Image appearance within an ImageSlider can be tuned via the ImageSlider.LayoutMode property. The ImageSlider.CurrentImage property specifies the currently displayed image. Image navigation via code is managed by the SliderBase.SlideNext and SliderBase.SlidePrev inherited methods. The SliderBase.AnimationTime property specifies the duration of the image sliding animation. If the WindowsFormsSettings.AnimationMode global setting is set to DisableAll, the animation is disabled.

This control provides built-in touch-input device support.

The ImageSlider supports dynamic image upload. See the Virtual Mode topic to learn more.

Example

The example demonstrates how to create and customize an ImageSlider control.

XtraEditors ImageSlider

using DevExpress.XtraEditors.Controls;

ImageSlider mySlider = new ImageSlider();
mySlider.Parent = this;
mySlider.Size = new Size(240, 200);
//Populate ImageSlider with images
mySlider.Images.Add(Image.FromFile(@"c:\Images\im1.jpg"));
mySlider.Images.Add(Image.FromFile(@"c:\Images\im2.jpg"));
mySlider.Images.Add(Image.FromFile(@"c:\Images\im3.jpg"));
mySlider.Images.Add(Image.FromFile(@"c:\Images\im4.jpg"));
//Increase image sliding animation duration (default is 700 ms)
mySlider.AnimationTime = 1200;
//Display images at the center of ImageSlider in their original size
mySlider.LayoutMode = DevExpress.Utils.Drawing.ImageLayoutMode.MiddleCenter;
//...
//Slide to the next image
mySlider.SlideNext();