Image Gallery Elements

• Jul 28, 2021
• 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
• Thumbnail Text Area
• Pager
• Fullscreen Viewer

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.

Characteristics	Members
Settings	ASPxImageGallery.PagerSettings
Alignment	ASPxImageGallery.PagerAlign
Styles	ImageGalleryStyles.PagerSummary, ImageGalleryStyles.PagerPanel, ImageGalleryStyles.PagerPageSizeItem, ImageGalleryStyles.PagerPageNumber, ImageGalleryStyles.PagerDisabledButton, ImageGalleryStyles.PagerCurrentPageNumber, ImageGalleryStyles.PagerButton, ImageGalleryStyles.Pager

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.

Characteristics	Members
Visibility	ImageGalleryFullscreenViewerSettings.NavigationButtonVisibility
Image	ImageGalleryFullscreenViewerImages.PrevButton, ImageGalleryFullscreenViewerImages.NextButton
Style	ImageGalleryFullscreenViewerStyles.PrevButton, ImageGalleryFullscreenViewerStyles.NextButton

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.

Characteristics	Members
Visibility	ImageGalleryFullscreenViewerSettings.ShowTextArea
Style	ImageGalleryFullscreenViewerStyles.TextArea
Text	ImageGalleryItem.Text, ImageGalleryItem.FullscreenViewerText
Template	ASPxImageGallery.FullscreenViewerItemTextTemplate, ASPxImageGallery.FullscreenViewerTextTemplate, ImageGalleryItem.FullscreenViewerTextTemplate

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.

Characteristics	Members
Paging Mode	ImageSliderNavigationBarSettings.PagingMode
Image	ImageGalleryFullscreenViewerNavigationBarImages.PrevPageButton, ImageGalleryFullscreenViewerNavigationBarImages.NextPageButton
Style	ImageGalleryFullscreenViewerNavigationBarStyles.PrevPageButton, ImageGalleryFullscreenViewerNavigationBarStyles.NextPageButton