Skip to main content

Gallery

<Gallery
  mediaItems={items}
  layout={layout}
  isItemPlayableInGalleryList={inlinePlay}
  HeaderComponent={renderHeader}
/>
APIThis is the list of additional props for the component

FooterComponent
React.ReactElement | null
​

Render custom footer

HeaderComponent
React.ReactElement | null
​

Render custom header

isItemPlayableInGalleryList
(mediaItem: GalleryMediaItemType) => boolean
​

Allow you to play video media items in the gallery

isItemPressable
(mediaItem: GalleryMediaItemType) => boolean
​

Allow you to decide if the media items is pressable

layout
GALLERY_LAYOUT
​

Choose gallery presentation layout

mediaItems
GalleryMediaItemType[]
​

Gallery media items to show inside the gallery

mediaSourceGenerator
(mediaItem: GalleryMediaItemType, dimensions: GalleryItemDimensions) => ImageURISource
​

Allow you to generate your media image/video/other source. For example: generating image url depending on the screen dimensions for smaller image size

onEndReached
((info: {distanceFromEnd: number}) => void) | null
​

Called when the gallery reach to the end of the list

onMediaItemPress
(mediaItem: GalleryMediaItemType, mediaIndex: number) => void
​

Called when media item was press

onOpenUrl
(url: string) => void
​

Allow you to open url to play external video sources (youtube, vimeo, etc)

renderCustomMediaItem
(mediaItem: GalleryMediaItemType, style: StyleProp<any>, isVisible: boolean) => React.ReactElement
​

Allow you to render custom component for non supported media types

testID
string
​

Component test id