How to clip an image to remove its padding-CodePudding

I'm displaing thumbnail image from YouTube. These images has black rectangles at the top and bottom.

I want to display image without that rectangles. How I can set vertical "padding" to remove that black rectangles.

Image(
       painter = rememberImagePainter("https://img.youtube.com/vi/RS6By_pE7uo/0.jpg"),
       modifier = Modifier
            .width(itemWidth)
            .height(photoImageHeight)
       contentScale = ContentScale.FillBounds
 )

CodePudding user response：

Place the image inside a Box whose width is the same as the image but whose height is reduced by the amount of height used by the black bars above and below the image. Then use cropToBounds:

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

        setContent {
            val w = 480f / LocalDensity.current.density * 2.7f
            val h = 360 / LocalDensity.current.density * 2.7f

            Box(
                modifier = Modifier
                    .requiredWidth(w.dp)
                    .requiredHeight(h.dp - 70.dp)
                    .clip(shape= RoundedCornerShape(30.dp))
            ) {
                Image(
                    modifier = Modifier
                        .requiredWidth(w.dp)
                        .requiredHeight(h.dp),
                    painter = rememberImagePainter(
                        data = "https://img.youtube.com/vi/RS6By_pE7uo/0.jpg",
                    ),
                    contentDescription = null,
                    contentScale = ContentScale.FillWidth,
                )
            }
        }
    }
}