layout/DSImageGallery
DSImageGallery
layoutHorizontal scrolling image gallery with page indicators.
iOS 17+macOS 14+watchOS 10+tvOS 17+visionOS 1+
Purpose
Use to display multiple images in a compact, swipeable carousel. Perfect for product photos or media galleries.
Interactive Reference
Live showroom
Need the full visual surface?
Screenshots do not scale well across every component, state, and variant. For the real interactive reference, import the package and launch DSShowcaseRoot().
Best for exploring:
variants, states, categories, and real app examples in one place.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| itemCountreq | Int | — | Number of pages. |
| spacing | CGFloat | DSSpacing.sm | Gap between the gallery and its page indicator. |
| accessibilityLabel | String? | nil | VoiceOver label for the gallery. |
| contentreq | @ViewBuilder (Int) -> Content | — | Builds the page at each index. You supply the image view. |
Examples
Product gallery
Paged images with an indicator.
swift
DSImageGallery(itemCount: product.imageNames.count, accessibilityLabel: "Product photos") { index in
Image(product.imageNames[index])
.resizable()
.scaledToFill()
.frame(height: 300)
.clipShape(RoundedRectangle(cornerRadius: DSRadius.large))
}Usage Guidelines
- Use for 2-10 images; more than 10 consider grid view
- Maintain consistent image aspect ratios
- Page indicators show current position