我完全懂你碰到的这个麻烦——想让图片占满父容器宽度，同时根据加载后的真实尺寸自动调整高度，既不能拉伸也不能裁剪，还得避免初始状态下高度为0的情况。下面给你一套可行的解决方案：

核心思路 #

利用Coil的加载状态监听图片的实际尺寸，动态计算宽高比，再把这个比例应用到Image组件的aspectRatio修饰符上。这样既能保证宽度填满父容器，高度也会跟着图片真实比例自动适配，完美解决你的需求。

具体实现代码 #

推荐用Coil的rememberAsyncImagePainter来实现，逻辑清晰且易维护：

val imageUrl = viewModel.fullImageUrl
// 初始化图片加载器并监听其状态
val painter = rememberAsyncImagePainter(model = imageUrl)
val imageState = painter.state

// 根据加载结果动态计算宽高比，用remember确保仅状态变化时重新计算
val aspectRatio = remember(imageState) {
    when (imageState) {
        is AsyncImagePainter.State.Success -> {
            // 获取图片真实的内在尺寸，计算宽高比
            val intrinsicSize = imageState.result.drawable.intrinsicSize
            intrinsicSize.width / intrinsicSize.height
        }
        else -> 1f // 加载中/失败时用默认比例（比如1:1，也可以换成你的占位图比例）
    }
}

Image(
    painter = painter,
    contentDescription = null,
    // 让图片宽度填满容器，高度按比例适配，保证完整显示
    contentScale = ContentScale.FillWidth,
    modifier = Modifier
        .fillMaxWidth()
        .aspectRatio(aspectRatio)
)

代码细节解释 #

1. 状态监听：通过painter.state能获取图片的加载状态（加载中、成功、失败），当状态变为Success时，就能拿到图片的真实尺寸。
2. 动态比例计算：用remember包裹计算逻辑，确保只有加载状态变化时才重新计算，避免不必要的组件重组。
3. ContentScale设置：ContentScale.FillWidth会让图片宽度完全填满父容器，高度按照真实比例自动缩放，既不会拉伸变形，也不会裁剪内容。
4. 默认比例兜底：加载中或加载失败时设置默认比例，避免组件高度为0，也可以换成你的占位图比例，提升用户体验。

更简洁的AsyncImage写法（Coil新版本推荐） #

如果你用的是Coil最新版本，也可以直接用AsyncImage组件，内部已经封装了状态管理，代码更简洁：

val imageUrl = viewModel.fullImageUrl
val aspectRatioState = remember { mutableStateOf(1f) }

AsyncImage(
    model = imageUrl,
    contentDescription = null,
    contentScale = ContentScale.FillWidth,
    modifier = Modifier
        .fillMaxWidth()
        .aspectRatio(aspectRatioState.value),
    onSuccess = { successResult ->
        // 加载成功后立即更新宽高比
        val size = successResult.drawable.intrinsicSize
        aspectRatioState.value = size.width / size.height
    },
    placeholder = painterResource(R.drawable.placeholder) // 可选：添加占位图优化加载体验
)

这种写法直接通过onSuccess回调获取图片尺寸，逻辑更直观，适合快速实现需求。

内容的提问来源于stack exchange，提问作者Eugene