将数据从修改器传递给画家

Question

如何从修改器获取数据并将其传递给画家。在获取以像素为单位的视图宽度后，我想为图像构建一个地址。我该怎么做？

Image(
       contentDescription = null,
       modifier = Modifier
                .fillMaxSize()
                .onGloballyPositioned { layoutCoordinates ->
                      layoutCoordinates.size.width                  <--- get width in px
                 },

       painter = rememberImagePainter(
                    data = "https://example.com/width_in_px/image.jpg", <--- pass width in px
                    builder = {
                        size(OriginalSize)
                    },
                )
            )

Answer 1

在 Compose 中，您可以使用状态变量传递任何数据。在我的示例中，我使用 Box 来测量尺寸，因此只有当您知道宽度时才能将图像添加到视图树中。我还使用 value+setter 可变状态语法来允许智能转换。

val (width, setWidth) = remember { mutableStateOf<Int?>(null) }
Box(
    Modifier
        .fillMaxSize()
        .onSizeChanged { size ->
            setWidth(size.width)
        }
) {
    if (width != null) {
        Image(
            contentDescription = null,
            painter = rememberImagePainter(
                data = "https://example.com/${width}/image.jpg",
                builder = {
                    size(OriginalSize)
                },
            ),
            modifier = Modifier
                .matchParentSize()
        )
    }
}

将数据从修改器传递给画家

Pass data from modifier to painter

android

image

android-jetpack-compose