Android 我如何剪裁一个可由另一个合成的

使用Modifier.onPlaced可以在父对象中获得Rect%的合成对象.

将这Rect设置为路径并判断差异，即可得到新的Path.通过与这Path剪裁，你可以剪裁移动合成.

enum class State {
    Collapsed,
    Expanded
}

@Preview
@Composable
fun Main() {
    val cardSize = 100.dp
    var currentState by remember { mutableStateOf(State.Collapsed) }

    val pathStationary = remember {
        Path()
    }


    val pathMoving = remember {
        Path()
    }
    val transition = updateTransition(
        targetState = currentState, label = "expand_transition"
    )
    val animateDpAsState by transition.animateDp(
        targetValueByState = { state ->
            when (state) {
                State.Expanded -> cardSize + 8.dp
                State.Collapsed -> 8.dp
            }
        },
        label = ""
    )

    Box(
        modifier = Modifier
            .width(cardSize + animateDpAsState)
            .clickable {
                currentState = if (currentState == State.Collapsed) {
                    State.Expanded
                } else {
                    State.Collapsed
                }
            }
    ) {
        Element(
            modifier = Modifier.onPlaced {
                pathStationary.reset()
                pathStationary.addRect(it.boundsInParent())
            },
            i = 1
        )
        Element(
            modifier = Modifier

                .drawWithContent {
                    val diffPath =
                        Path.combine(PathOperation.Difference, path1 = pathMoving, path2 = pathStationary)

                    clipPath(diffPath){
                        this@drawWithContent.drawContent()
                    }
                }
                .offset(x = animateDpAsState + 4.dp)
                .scale(0.90f)
                .onPlaced {
                    pathMoving.reset()
                    pathMoving.addRect(it.boundsInParent())
                }
            ,
            i = 2
        )
    }
}

@Composable
fun Element(modifier: Modifier = Modifier, i: Int) {
    Box(
        modifier = modifier
            .size(100.dp)
            .border(2.dp, Color.Black),
        contentAlignment = Alignment.Center
    ) {
        Text(text = "ITEM $i")
    }
}