[null,null,["最后更新时间 (UTC):2025-08-21。"],[],[],null,["# Build a details screen\n\nMany TV apps include content detail pages with relevant metadata for a given\npiece of content (i.e. a specific movie). Detail pages can be implemented as a\ncomposable function, taking metadata of the selected content as its argument.\n\nThe following code is a typical implementation of the details screen. It\n[loads an image](/jetpack/compose/graphics/images/loading#internet-loading)\nof the given movie with its title and description. The user's able to make a\nscreen transition to the player screen, which can be triggered by clicking a\nbutton to start movie playback. You can handle this action to make the screen\ntransition by setting a callback function. \n\n @Composable\n fun DetailsScreen(\n movie: Movie,\n modifier: Modifier = Modifier,\n onStartPlayback: (Movie) -\u003e Unit = {}\n ) {\n Box(modifier = modifier.fillMaxSize()){\n AsyncImage(\n modifier = Modifier.fillMaxSize()\n model = movie.image,\n contentDescription = null,\n contentScale = ContentScale.Crop,\n )\n Column(modifier = Modifier.padding(32.dp)){\n Text(\n text = movie.title,\n style = MaterialTheme.typeography.heading2\n )\n Text(text = movie.description)\n Button(onClick = { onStartPlayBack(movie) }){\n Text(text = R.string.startPlayback)\n }\n }\n }\n }\n\n| **Note:** `AsyncImage` is a composable to load an image from the internet. See [Loading Images](/develop/ui/compose/graphics/images/loading#internet-loading) for details."]]