Jetpack Compose - 当宽度增加时行裁剪 Children

Question

在右边，我有一个可组合项中的项目列表，每个项目都在一行中，所有项目都在一列中

所有 children 都被裁剪以适应我不想要的屏幕，我希望这些项目即使在屏幕外也能完全呈现，因为我在它们上面有一个可缩放的容器

如您所见，文本字段中的文本如何垂直排成一行而不是扩展宽度，这就是问题所在

代码：

Row(
        modifier = modifier.zIndex(3f),
        verticalAlignment = Alignment.CenterVertically,
        horizontalArrangement = Arrangement.Center,
    ) {
        SimpleNodesList(
            modifier = Modifier.padding(8.dp),
            parentNode = state.center,
            nodes = state.center.left,
            renderRight = false,
        )

        SimpleNode(node = state.center, parentNode = null)

        SimpleNodesList(
            modifier = Modifier.padding(8.dp),
            parentNode = state.center,
            nodes = state.center.right,
            renderLeft = false
        )
    }

简单节点列表是一列行，我左边一列，右边一列，如果左边列的宽度增加，右边的行会被屏幕截断

Answer 1

如果您对文本使用硬编码宽度，在每个容器上应用 Modifier.wrapContentSize() 可能就可以了

Answer 2

使用此修改器完成行的工作，在我的情况下，我还需要此布局修改器，wrapContentSize(unbounded = true) 工作正常但由于某种原因在缩放容器的边界之外无法单击子项！

我还必须创建一个修饰符 zoomable 而不是使用一个 zoomable box ，所以 zoomable 触摸事件将被调度到这个可组合项而不是父项！

modifier = Modifier
        .layout { measurable, constraints ->
            val r =
                measurable.measure(constraints = constraints.copy(maxWidth = Constraints.Infinity))
            layout(r.measuredWidth, r.measuredHeight, placementBlock = {
                r.placeWithLayer(0, 0, 0f) {

                }
            })
        }
        .wrapContentSize(unbounded = true)

Jetpack Compose - 当宽度增加时行裁剪 Children

Jetpack Compose - Row Clipping Children When Width Increases

android-jetpack-compose

android-jetpack-compose-list