如何在 jetpack compose 中使用来自 URI 的 Coil 加载图像

Question

我正在使用最新版本的线圈：

implementation("io.coil-kt:coil-compose:2.0.0-rc01")

我想将条形码标签图像加载到我的 Jetpack Compose 文件中，例如如下所示：

Box(modifier = Modifier.background(Color.DarkGray).fillMaxSize()) {
    AsyncImage(
        model = ImageRequest.Builder(LocalContext.current)
            .data("https://www.researchgate.net/profile/Adnan-Ghaffar/publication/313103370/figure/fig3/AS:456489858015234@1485847071322/An-example-of-barcode.png")
            .crossfade(true)
            .build(),
        contentDescription = "barcode image",
        contentScale = ContentScale.Crop,
        modifier = Modifier
    )

}

这工作正常，当我尝试从如下所示的 URI 加载图像时，就会出现问题：

http://api.labelary.com/v1/printers/8dpmm/labels/4x6/0/^xa^cfa,50^fo100,100^fdHello World^fs^xz

但它不起作用，例如我尝试过的代码：

Box(modifier = Modifier.background(Color.DarkGray).fillMaxSize()) {
    AsyncImage(
        model = ImageRequest.Builder(LocalContext.current)
            .data("http://api.labelary.com/v1/printers/8dpmm/labels/4x6/0/^xa^cfa,50^fo100,100^fdHello World^fs^xz")
            .crossfade(true)
            .build(),
        contentDescription = "barcode image",
        contentScale = ContentScale.Crop,
        modifier = Modifier
    )
}

有关如何在labelary上创建标签 .png 的更多信息

Answer 1

根据网络安全配置，我认为是HTTP地址，

创建文件 res/xml/network_security_config.xml：

<?xml version ="1.0" encoding ="utf-8"?>
<network-security-config>
    <base-config cleartextTrafficPermitted="true" />
</network-security-config>

AndroidManifest.xml：

<?xml version="1.0" encoding="utf-8"?>
<manifest ...>
    <uses-permission android:name="android.permission.INTERNET" />
    <application
        ...
        android:networkSecurityConfig="@xml/network_security_config"
        ...>
        ...
    </application>
</manifest>