Jenga
A full-screen image viewer on a dark backdrop: a top row with a close button, a title and trailing actions (e.g. download, share), above the image in content. The image can be pinch-zoomed and panned, and a double tap toggles zoom. Pressing back or the close button calls onDismissRequest.
Control visibility by conditional composition.
Parameters
called when the viewer should close.
the title shown in the top row (e.g. the file name).
accessibility label for the close button.
the Modifier for the viewer.
trailing actions in the top row; inherit the content color.
the title text style.
the largest zoom factor; at least 1.
the color set; defaults to JengaImageViewerDefaults.colors.
the image (e.g. a JengaImage that fills the space).
Samples
var open by remember {
mutableStateOf(
value = true,
)
}
if (open) {
JengaImageViewer(
onDismissRequest = { open = false },
title = "photo.jpg",
closeContentDescription = "Close",
content = {
JengaImage(
url = "https://example.com/photo.jpg",
contentDescription = null,
fit = JengaImageFit.Contain,
)
},
)
}A full-screen viewer for several images: swipe sideways between pageCount pages, each pinch-zoomed on its own. Pages swipe only while the current page is not zoomed in, and a page's zoom resets when it leaves the screen. Pressing back or the close button calls onDismissRequest.
Control visibility by conditional composition.
Parameters
the number of pages.
called when the viewer should close.
the title for a page (e.g. "Photo 2 of 3").
accessibility label for the close button.
the Modifier for the viewer.
the page shown first.
trailing actions in the top row for the shown page.
content under the pages (e.g. a strip of thumbnails), given the shown page and a function that moves to another page.
the title text style.
the largest zoom factor; at least 1.
the color set; defaults to JengaImageViewerDefaults.colors.
the image for a page.
Samples
val urls = listOf(
"https://example.com/1.jpg",
"https://example.com/2.jpg",
)
var open by remember {
mutableStateOf(
value = true,
)
}
if (open) {
JengaImageViewer(
pageCount = urls.size,
onDismissRequest = { open = false },
title = { page -> "Photo ${page + 1} of ${urls.size}" },
closeContentDescription = "Close",
pageContent = { page ->
JengaImage(
url = urls[page],
contentDescription = null,
fit = JengaImageFit.Contain,
)
},
)
}