Image Gallery Elements
- 3 minutes to read
This topic lists the ASPxImageGallery elements that are displayed onscreen. Each section contains a screenshot that illustrates the element, with a brief overview of its functionality.
The visual elements of the ASPxImageGallery are as follows:
Thumbnail
A Thumbnail denotes an image in the image gallery.
If a thumbnail image is not specified explicitly, it is automatically created by the ASPxImageGallery control.
The table below lists the main members that affect element appearance.
| Characteristics | Members |
|---|---|
| Size | ASPxImageGallery.ThumbnailHeight, ASPxImageGallery.ThumbnailWidth |
| Image Size Mode | ASPxImageGallery.ThumbnailImageSizeMode |
| Content | ImageGalleryItem.ThumbnailUrl |
Thumbnail Text Area
The Thumbnail Text Area displays item text over thumbnails.
The table below lists the main members that affect element appearance.
| Characteristics | Members |
|---|---|
| Visibility | ASPxImageGallery.TextVisibility |
| Style | ImageGalleryStyles.ThumbnailTextArea |
| Text | ImageGalleryItem.Text |
| Template | ASPxImageGallery.ItemTextTemplate, ImageGalleryItem.TextTemplate |
| Behavior | ASPxImageGallery.AllowExpandText |
Pager
The Pager is displayed in the image gallery and allows an end user to navigate through thumbnails.
The table below lists the main members that affect element appearance.
Fullscreen Viewer
The Fullscreen Viewer is displayed when an end user clicks a thumbnail. The viewer displays images and allows the user to navigate through them.
The Fullscreen Viewer can display the following elements.
- Close Button
- Play and Pause Buttons
- Navigation Buttons
- Fullscreen Viewer Text Area
- Navigation Bar Marker
- Navigation Bar
The table below lists the main members that affect element appearance.
| Characteristics | Members |
|---|---|
| Settings | ASPxImageGallery.SettingsFullscreenViewer |
| Images | ASPxImageGallery.ImagesFullscreenViewer |
| Styles | ASPxImageGallery.StylesFullscreenViewer |
Close Button
The Close button is displayed in the fullscreen viewer and allows end users to close it.
The table below lists the main members that affect element appearance.
| Characteristics | Members |
|---|---|
| Visibility | ImageGalleryFullscreenViewerSettings.ShowCloseButton |
| Image | ImageGalleryFullscreenViewerImages.CloseButton |
| Style | ImageGalleryFullscreenViewerStyles.CloseButton |
Play and Pause Buttons
The Play and Pause buttons are displayed in the fullscreen viewer, and allow end users to play and pause a slide show.
The table below lists the main members that affect element appearance.
| Characteristics | Members |
|---|---|
| Visibility | ImageGalleryFullscreenViewerSettings.ShowPlayPauseButton |
| Image | ImageGalleryFullscreenViewerImages.PlayButton, ImageGalleryFullscreenViewerImages.PauseButton |
| Style | ImageGalleryFullscreenViewerStyles.PlayPauseButton |
Navigation Buttons
Previous and Next navigation buttons are displayed in the fullscreen viewer and allow end users to navigate between images.
The table below lists the main members that affect element appearance.
Fullscreen Viewer Text Area
The Fullscreen Viewer Text Area displays the current item’s text in the fullscreen viewer.
The table below lists the main members that affect element appearance.
Navigation Bar Marker
The Navigation Bar Marker is displayed in the fullscreen viewer and allows end users to show the Navigation Bar.
The table below lists the main members that affect element appearance.
| Characteristics | Members |
|---|---|
| Visibility | ImageGalleryFullscreenViewerSettings.NavigationBarVisibility |
| Image | ImageGalleryFullscreenViewerImages.NavigationBarMarker |
| Style | ImageGalleryFullscreenViewerStyles.NavigationBarMarker |
Navigation Bar
The Navigation Bar is displayed in the fullscreen viewer and allows end users to quickly navigate through images.
The Navigation Bar displays fullscreen viewer thumbnails and page navigation buttons.
You can use the ImageGalleryFullscreenViewerSettings.NavigationBarVisibility property to specify the Navigation Bar visibility mode.
Fullscreen Viewer Thumbnail
The Fullscreen Viewer Thumbnail is displayed in the navigation bar and denotes an image.
If a thumbnail image is not specified explicitly, it is automatically created by the ASPxImageGallery control.
The table below lists the main members that affect element appearance.
| Characteristics | Members |
|---|---|
| Size | ImageGalleryFullscreenViewerSettings.ThumbnailHeight, ImageGalleryFullscreenViewerSettings.ThumbnailWidth |
| Content | ImageGalleryItem.FullscreenViewerThumbnailUrl |
Page Navigation Buttons
Page Navigation Buttons are displayed in the navigation bar and allow end users to navigate through image pages.
The table below lists the main members that affect element appearance.