Creating the video playback user interface

In this section, we’re going to build the video playback UI and focus on the essentials: a title bar, close, play/pause, forward and rewind buttons, a progress bar, and a time indicator. We will start by creating the PlaybackScreen composable, the main composable for this new screen, after which we will add the additional components required to make it function.

Building PlaybackScreen and its composables

Let’s start building the PlaybackScreen composable:

@Composable
fun PlaybackScreen() {
    Box(
        modifier = Modifier
            .fillMaxSize()
            .background(Color.Black)
    ) {
        TopMediaRow(Modifier.align(Alignment.TopCenter))
     ...