stream-chat-android-compose/io.getstream.chat.android.compose.ui.attachments.preview/MediaGalleryPreviewScreen

MediaGalleryPreviewScreen

fun MediaGalleryPreviewScreen(viewModel: MediaGalleryPreviewViewModel, initialPage: Int, onHeaderLeadingContentClick: () -> Unit, onOptionClick: (Attachment, MediaGalleryPreviewOption) -> Unit, onRequestShareAttachment: (Attachment) -> Unit, onConfirmShareAttachment: (Attachment) -> Unit, modifier: Modifier = Modifier, config: MediaGalleryConfig = ChatTheme.mediaGalleryConfig, onHeaderTrailingContentClick: () -> Unit = { viewModel.toggleMediaOptions(true) }, onFooterLeadingContentClick: (Attachment) -> Unit = onRequestShareAttachment, onFooterTrailingContentClick: (Attachment) -> Unit = { viewModel.toggleGallery(true) }, onDismissShareAttachment: () -> Unit = { viewModel.promptedAttachment = null }, onDismissOptionsMenu: () -> Unit = { viewModel.toggleMediaOptions(false) }, onDismissGallery: () -> Unit = { viewModel.toggleGallery(false) }, header: @Composable (attachments: List<Attachment>, currentPage: Int) -> Unit = { _, _ -> MediaGalleryPreviewHeader( modifier = Modifier .fillMaxWidth() .height(56.dp), message = viewModel.message, connectionState = viewModel.connectionState, onLeadingContentClick = onHeaderLeadingContentClick, onTrailingContentClick = onHeaderTrailingContentClick, ) }, content: @Composable (padding: PaddingValues, pagerState: PagerState, attachments: List<Attachment>, onPlaybackError: () -> Unit) -> Unit = { padding, pagerState, attachments, onPlaybackError -> MediaGalleryPager( modifier = Modifier .fillMaxSize() .background(ChatTheme.colors.appBackground) .padding(padding), pagerState = pagerState, attachments = attachments, onPlaybackError = { onPlaybackError() }, ) }, footer: @Composable (attachments: List<Attachment>, currentPage: Int) -> Unit = { attachments, currentPage -> MediaGalleryPreviewFooter( attachments = attachments, currentPage = currentPage, totalPages = attachments.size, connectionState = viewModel.connectionState, isSharingInProgress = viewModel.isSharingInProgress, onLeadingContentClick = onFooterLeadingContentClick, onTrailingContentClick = onFooterTrailingContentClick, ) }, optionsMenu: @Composable (attachment: Attachment, options: List<MediaGalleryPreviewOption>) -> Unit = { attachment, options -> MediaGalleryOptionsMenu( attachment = attachment, options = options, onOptionClick = onOptionClick, onDismiss = onDismissOptionsMenu, ) })

A stateful composable function rendering a screen for previewing visual media attachments (images and videos). Renders a screen with the following structure:

Header consisting of:
Leading content (close icon)
Center content (title)
Trailing content (options icon)
Content (pager with images/videos)
Footer consisting of:
Leading content (share icon)
Center content (page indicator or sharing progress)
Trailing content (photos/gallery icon)

Parameters

viewModel

The MediaGalleryPreviewViewModel instance to use for managing the state of the screen.

initialPage

The initial page to display in the pager.

onHeaderLeadingContentClick

Callback to be invoked when the leading content in the header is clicked. Usually closes the screen.

onOptionClick

Callback to be invoked when an option in the options menu is clicked.

onRequestShareAttachment

Callback to be invoked when the share icon in the footer is clicked.

onConfirmShareAttachment

Callback to be invoked when the user confirms sharing an attachment.

modifier

The Modifier to be applied to the screen.

config

The configuration for the media gallery.

onHeaderTrailingContentClick

Callback to be invoked when the trailing content in the header is clicked. By default, it shows the options menu.

onFooterLeadingContentClick

Callback to be invoked when the leading content in the footer is clicked. By default, it shares the attachment.

onFooterTrailingContentClick

Callback to be invoked when the trailing content in the footer is clicked. By default, it shows a bottom sheet gallery with all attachments in the message.

onDismissShareAttachment

Callback to be invoked when the user dismisses the share large file dialog.

onDismissOptionsMenu

Callback to be invoked when the options menu is dismissed.

onDismissGallery

Callback to be invoked when the gallery bottom sheet is dismissed.

header

Composable function to render the header. By default, it renders a MediaGalleryPreviewHeader.

content

Composable function to render the content. By default, it renders a MediaGalleryPager.

footer

Composable function to render the footer. By default, it renders a MediaGalleryPreviewFooter.

optionsMenu

Composable function to render the options menu. By default, it renders a MediaGalleryOptionsMenu.

@Composable

fun MediaGalleryPreviewScreen(message: Message, connectionState: ConnectionState, currentUser: User?, initialPage: Int, promptedAttachment: Attachment?, isSharingInProgress: Boolean, isShowingOptions: Boolean, isShowingGallery: Boolean, onOptionClick: (Attachment, MediaGalleryPreviewOption) -> Unit, onRequestShareAttachment: (Attachment) -> Unit, modifier: Modifier = Modifier, config: MediaGalleryConfig = ChatTheme.mediaGalleryConfig, onHeaderLeadingContentClick: () -> Unit = {}, onHeaderTrailingContentClick: () -> Unit = {}, onFooterLeadingContentClick: (Attachment) -> Unit = onRequestShareAttachment, onFooterTrailingContentClick: (Attachment) -> Unit = {}, onConfirmShareAttachment: (Attachment) -> Unit = {}, onDismissShareAttachment: () -> Unit = {}, onDismissOptionsMenu: () -> Unit = {}, onDismissGallery: () -> Unit = {}, header: @Composable (attachments: List<Attachment>, currentPage: Int) -> Unit = { _, _ -> MediaGalleryPreviewHeader( modifier = Modifier .fillMaxWidth() .height(56.dp), message = message, connectionState = connectionState, onLeadingContentClick = onHeaderLeadingContentClick, onTrailingContentClick = onHeaderTrailingContentClick, ) }, content: @Composable (padding: PaddingValues, pagerState: PagerState, attachments: List<Attachment>, onPlaybackError: () -> Unit) -> Unit = { padding, pagerState, attachments, onPlaybackError -> MediaGalleryPager( modifier = Modifier .fillMaxSize() .background(ChatTheme.colors.appBackground) .padding(padding), pagerState = pagerState, attachments = attachments, onPlaybackError = { onPlaybackError() }, ) }, footer: @Composable (attachments: List<Attachment>, currentPage: Int) -> Unit = { attachments, currentPage -> MediaGalleryPreviewFooter( attachments = attachments, currentPage = currentPage, totalPages = attachments.size, connectionState = connectionState, isSharingInProgress = isSharingInProgress, onLeadingContentClick = onFooterLeadingContentClick, onTrailingContentClick = onFooterTrailingContentClick, ) }, optionsMenu: @Composable (attachment: Attachment, options: List<MediaGalleryPreviewOption>) -> Unit = { attachment, options -> MediaGalleryOptionsMenu( attachment = attachment, options = options, onOptionClick = onOptionClick, onDismiss = onDismissOptionsMenu, ) })

A stateless composable function rendering a screen for previewing visual media attachments (images and videos). Renders a screen with the following structure:

Header consisting of:
Leading content (close icon)
Center content (title)
Trailing content (options icon)
Content (pager with images/videos)
Footer consisting of:
Leading content (share icon)
Center content (page indicator or sharing progress)
Trailing content (photos/gallery icon)