如何在Jetpack Compose中显示SVG图片？已用AsyncImage尝试但未成功

你用rememberAsyncImagePainter（基于Coil库）加载SVG没显示，核心原因是Coil默认不支持SVG格式的解码，得做以下几步调整：

1. 添加Coil的SVG扩展依赖 #

在你的模块级build.gradle.kts（或build.gradle）中添加SVG解码扩展：

// 版本号可根据Coil最新版本调整，当前示例为2.5.0
implementation("io.coil-kt:coil-svg:2.5.0")

2. 配置支持SVG的ImageLoader #

创建一个包含SVG解码器的ImageLoader实例，建议在应用初始化时全局配置，或者在Compose组件中局部配置：

// 在Application类或Compose上下文初始化
val imageLoader = ImageLoader.Builder(context)
    .components {
        // 添加SVG解码器工厂
        add(SvgDecoder.Factory())
    }
    .build()

如果是全局配置，可通过LocalImageLoader在Compose树中提供：

// 在App主题或根组件中设置
CompositionLocalProvider(LocalImageLoader provides imageLoader) {
    // 你的Compose内容
}

3. 修改加载SVG的代码 #

如果是全局配置了ImageLoader，直接用AsyncImage即可：

AsyncImage(
    model = mealImage,
    contentDescription = "",
    modifier = Modifier.size(150.dp).padding(5.dp)
)

如果是局部使用配置好的ImageLoader，则显式传入参数：

Image(
    painter = rememberAsyncImagePainter(
        model = mealImage,
        imageLoader = imageLoader
    ),
    contentDescription = "",
    modifier = Modifier.size(150.dp).padding(5.dp)
)

额外注意事项 #

• 先确认SVG链接能正常在浏览器打开，排除资源不可访问的问题；
• 如果加载的是HTTP链接，需在AndroidManifest.xml的<application>标签中添加android:usesCleartextTraffic="true"，或者改用HTTPS链接；
• 确保SVG文件本身格式有效，避免因文件损坏导致加载失败。

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