加载后如何使用 ContentScale.Fit 测量 Coil AsyncImage 的大小？

Question

我在Jetpack Compose中有一个Coil AsyncImage，如下：

    AsyncImage(
      model = imageRequest,
      contentDescription = "Ground plan",
      contentScale = ContentScale.Fit,
      modifier = Modifier.fillMaxWidth()
    )

它显示建筑物的平面图并将其大小调整为全屏宽度，同时保持纵横比。

我想在这个平面图上放置一系列按钮。对于每个按钮，我都有 X 和 Y 坐标，根据图像的原始大小（以像素为单位），指示按钮应位于的位置。

加载后，如何获取此 AsyncImage Composable（即不是容器）内的图像的确切大小和位置，以便我可以移动和乘以按钮坐标并将按钮放置在图像上？

Answer 1

我构建了一个 library ，它返回在 Image 可组合项中绘制的图像的

Rect

，目的是获取绘制的图像的 Rect 而不是整个容器，但是它需要

ImageBitmap

作为参数，但你可以轻松获得ImageBitmap 如此答案中所述。

获得此矩形后，您可以缩放 rect.start + rectWidth * (positionInBitmp/BitmapWidth) 来设置 X 位置，y 位置也同样如此。

假设您从我的库中获取 Rect(0,200 1000,1000)，并且您希望在屏幕上放置一个按钮，该按钮位于位图 (2000,2000) 处，对于宽度和高度为 4000px 的位图，结果将是

0 + 1000 * 2000/4000 = 500 像素 x

200 + 1000 * 2000/4000 = 700 像素（y）

您可能还需要将其转换为 dp 或使用采用 IntOffset 的 Modifier.offset{}。