I’m trying to upload an Image from a Compose Multiplatform via Ktor. I have the image data as ImageB...

# compose

[msomu]

I’m trying to upload an Image from a Compose Multiplatform via Ktor.
I have the image data as ImageBitmap object how can I convert it into a Bitmap so that i can upload via Ktor?

When I tried to change the androidx.compose.ui.graphics.ImageBitmap into a org.jetbrains.skia.Bitmap using asSkiaBitmap I’m getting this error Unresolved reference: asSkiaBitmap
Any help on resolving how to use asSkiaBitmap() function in the commonMain module?

[msomu]

val apiEndpoint = "https://$hostName/$referenceName.png"
        val fileType = "image/png"
        val cloudflareSecret = "$cf-secret"

        val response = httpClient.submitFormWithBinaryData(url = apiEndpoint,
            formData = formData {
                                append("image",bitmap.asSkiaBitmap(), Headers.build {
                                    append(HttpHeaders.ContentType, fileType)
                                    append("X-CF-Secret", cloudflareSecret)
                                })
        }, block = {
            method = HttpMethod.Put
        })

This is the ktor code I’m trying to execute and asSkiaBitmap() is throwing an compile time error.

[Alexander Zhirkevich]

org.jetbrains.skia can't be used on Android. it is visible in commonMain by mistake. if you want to use such convertions in common you have to write expect with actual Android bitmap and actual Skia bitmap

[msomu]

I have managed to convert androidx.compose.ui.graphics.ImageBitmap to base64 string on Android using this code, how can I achieve the same in iOS?
I’m able to convert the imageBitmap to org.jetbrains.skia.Bitmap using asSkiaBitmap() after the Bitmap how can I convert it into a Base64 encodedString?
Any help or guidance? Thanks a lot.

actual fun ImageBitmap.toBase64(): String {
    val bitmap = this.asAndroidBitmap()
    val byteArrayOutputStream = ByteArrayOutputStream()
    bitmap.compress(Bitmap.CompressFormat.PNG, 100, byteArrayOutputStream)
    val byteArray = byteArrayOutputStream.toByteArray()
    return Base64.encodeToString(byteArray, Base64.DEFAULT)
}

[John O'Reilly]

I think the code in following does this (if I understand you correctly) https://github.com/joreilly/GeminiKMP

[John O'Reilly]

along with using Base64.Default.decode() in common code

[John O'Reilly]

that project is also uploading base64 encoded version of image using ktor

[msomu]

Thanks @John O'Reilly this should help. Will try this.

[Michael Paus]

I think this code should do what you want on iOS (and desktop).

import androidx.compose.ui.graphics.ImageBitmap
import androidx.compose.ui.graphics.asSkiaBitmap
import org.jetbrains.skia.EncodedImageFormat
import org.jetbrains.skia.Image
import kotlin.io.encoding.Base64
import kotlin.io.encoding.ExperimentalEncodingApi

@OptIn(ExperimentalEncodingApi::class)
fun ImageBitmap.toBase64(): String {
    val encodedBytes = Image.makeFromBitmap(this.asSkiaBitmap()).encodeToData(EncodedImageFormat.PNG, 100)?.bytes
    return Base64.Default.encode(encodedBytes!!)    
}

I haven’t tested it so keep your fingers crossed when you first try it 😉.

[Zach Klippenstein (he/him) [MOD]]

FYI #compose-ios is a thing