Kotlin Compose forEach中的负间距

Question

我试图在一些圆形图案上设置负间距，但无论是：

.padding(horizontal = (-5).dp)

还是

.offset(x = (-5).dp)

都没有成功。

我不太确定如何实现这一点，我想要达到的效果如下：

正如您所看到的，该图片确实包含一个覆盖层，但图像是相互重叠的。

在Kotlin Compose中有没有办法实现这个效果？

- Heron. F

Answer 1

你可以通过使用 Box 包装第二个图像，设置背景和偏移量来实现此目标。

@Composable
private fun ImageSample() {

    Row(
        modifier = Modifier
            .wrapContentHeight()
            .padding(20.dp), verticalAlignment = Alignment.CenterVertically
    ) {
        Image(
            modifier = Modifier
                .size(100.dp)
                .clip(CircleShape),
            painter = painterResource(id = R.drawable.landscape1),
            contentDescription = null,
            contentScale = ContentScale.FillBounds
        )

        Box(
            modifier = Modifier
                .offset((-20).dp)
                .background(Color.White, CircleShape)
                .padding(10.dp)
        ) {
            Image(
                modifier = Modifier
                    .size(100.dp)
                    .clip(CircleShape),
                painter = painterResource(id = R.drawable.landscape2),
                contentDescription = null,
                contentScale = ContentScale.FillBounds
            )
        }
    }
}

- Thracian