@momo-kits/native-kits 0.162.1-gif.10-debug → 0.162.1-gif.11-debug

package/compose/build.gradle.kts

@@ -40,7 +40,7 @@ kotlin {
     }
 
     cocoapods {
-        version = "0.162.1-gif.10-debug"
+        version = "0.162.1-gif.11-debug"
         summary = "IOS Shared module"
         homepage = "https://momo.vn"
         ios.deploymentTarget = "15.0"
@@ -77,7 +77,7 @@ kotlin {
             implementation(libs.kotlinx.datetime)
             api(libs.native.max.api)
             implementation(libs.compottie)
-            implementation(libs.sketch.compose)
+            implementation(libs.sketch.core)
             implementation(libs.sketch.http.core)
             implementation(libs.sketch.animated.gif)
         }

package/compose/build.gradle.kts.backup

@@ -77,7 +77,7 @@ kotlin {
             implementation(libs.kotlinx.datetime)
             api(libs.native.max.api)
             implementation(libs.compottie)
-            implementation(libs.sketch.compose)
+            implementation(libs.sketch.core)
             implementation(libs.sketch.http.core)
             implementation(libs.sketch.animated.gif)
         }

package/compose/compose.podspec

@@ -1,6 +1,6 @@
 Pod::Spec.new do |spec|
     spec.name                     = 'compose'
-    spec.version                  = '0.162.1-gif.8'
+    spec.version                  = '0.162.1-gif.10'
     spec.homepage                 = 'https://momo.vn'
     spec.source                   = { :http=> ''}
     spec.authors                  = ''

package/compose/src/androidMain/kotlin/vn/momo/kits/utils/SketchGifBridge.android.kt

@@ -0,0 +1,161 @@
+package vn.momo.kits.utils
+
+import android.graphics.drawable.Animatable
+import android.graphics.drawable.BitmapDrawable
+import android.graphics.drawable.ColorDrawable
+import android.graphics.drawable.Drawable
+import android.os.Handler
+import android.os.Looper
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.RememberObserver
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableIntStateOf
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.setValue
+import androidx.compose.ui.geometry.Size
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.graphics.ColorFilter
+import androidx.compose.ui.graphics.ImageBitmap
+import androidx.compose.ui.graphics.asAndroidColorFilter
+import androidx.compose.ui.graphics.asImageBitmap
+import androidx.compose.ui.graphics.drawscope.DrawScope
+import androidx.compose.ui.graphics.drawscope.drawIntoCanvas
+import androidx.compose.ui.graphics.nativeCanvas
+import androidx.compose.ui.graphics.painter.BitmapPainter
+import androidx.compose.ui.graphics.painter.ColorPainter
+import androidx.compose.ui.graphics.painter.Painter
+import androidx.compose.ui.graphics.withSave
+import androidx.compose.ui.platform.LocalContext
+import androidx.compose.ui.unit.LayoutDirection
+import com.github.panpf.sketch.Bitmap
+import com.github.panpf.sketch.DrawableImage
+import com.github.panpf.sketch.Image
+import com.github.panpf.sketch.PlatformContext
+import kotlin.math.roundToInt
+
+@Composable
+internal actual fun rememberSketchPlatformContext(): PlatformContext {
+    return LocalContext.current.applicationContext
+}
+
+internal actual fun Bitmap.toComposeImageBitmap(): ImageBitmap {
+    return asImageBitmap()
+}
+
+internal actual fun Image?.toSketchGifPainter(): Painter? {
+    return when (this) {
+        is DrawableImage -> drawable.toPainter()
+        else -> null
+    }
+}
+
+private fun Drawable.toPainter(): Painter {
+    return when (this) {
+        is Animatable -> AnimatableDrawablePainter(mutate())
+        is BitmapDrawable -> BitmapPainter(bitmap.asImageBitmap())
+        is ColorDrawable -> ColorPainter(Color(color))
+        else -> DrawablePainter(mutate())
+    }
+}
+
+private open class DrawablePainter(
+    protected val drawable: Drawable,
+) : Painter(), RememberObserver {
+    private var drawTick by mutableIntStateOf(0)
+    private var drawableSize by mutableStateOf(drawable.intrinsicSize)
+
+    private val callback = object : Drawable.Callback {
+        override fun invalidateDrawable(who: Drawable) {
+            drawTick++
+            drawableSize = who.intrinsicSize
+        }
+
+        override fun scheduleDrawable(who: Drawable, what: Runnable, `when`: Long) {
+            mainHandler.postAtTime(what, `when`)
+        }
+
+        override fun unscheduleDrawable(who: Drawable, what: Runnable) {
+            mainHandler.removeCallbacks(what)
+        }
+    }
+
+    override val intrinsicSize: Size
+        get() = drawableSize
+
+    init {
+        if (drawable.intrinsicWidth >= 0 && drawable.intrinsicHeight >= 0) {
+            drawable.setBounds(0, 0, drawable.intrinsicWidth, drawable.intrinsicHeight)
+        }
+    }
+
+    override fun DrawScope.onDraw() {
+        drawTick
+        drawIntoCanvas { canvas ->
+            canvas.withSave {
+                drawable.setBounds(0, 0, size.width.roundToInt(), size.height.roundToInt())
+                drawable.draw(canvas.nativeCanvas)
+            }
+        }
+    }
+
+    override fun applyAlpha(alpha: Float): Boolean {
+        drawable.alpha = (alpha * 255).roundToInt().coerceIn(0, 255)
+        return true
+    }
+
+    override fun applyColorFilter(colorFilter: ColorFilter?): Boolean {
+        drawable.colorFilter = colorFilter?.asAndroidColorFilter()
+        return true
+    }
+
+    override fun applyLayoutDirection(layoutDirection: LayoutDirection): Boolean {
+        return if (android.os.Build.VERSION.SDK_INT >= 23) {
+            drawable.setLayoutDirection(
+                if (layoutDirection == LayoutDirection.Rtl) {
+                    android.view.View.LAYOUT_DIRECTION_RTL
+                } else {
+                    android.view.View.LAYOUT_DIRECTION_LTR
+                }
+            )
+        } else {
+            false
+        }
+    }
+
+    override fun onRemembered() {
+        drawable.callback = callback
+        drawable.setVisible(true, true)
+    }
+
+    override fun onAbandoned() = onForgotten()
+
+    override fun onForgotten() {
+        drawable.setVisible(false, false)
+        drawable.callback = null
+    }
+}
+
+private class AnimatableDrawablePainter(
+    drawable: Drawable,
+) : DrawablePainter(drawable) {
+    private val animatable = drawable as Animatable
+
+    override fun onRemembered() {
+        super.onRemembered()
+        animatable.start()
+    }
+
+    override fun onForgotten() {
+        animatable.stop()
+        super.onForgotten()
+    }
+}
+
+private val Drawable.intrinsicSize: Size
+    get() = if (intrinsicWidth >= 0 && intrinsicHeight >= 0) {
+        Size(intrinsicWidth.toFloat(), intrinsicHeight.toFloat())
+    } else {
+        Size.Unspecified
+    }
+
+private val mainHandler = Handler(Looper.getMainLooper())

package/compose/src/commonMain/kotlin/vn/momo/kits/components/Image.kt

@@ -17,19 +17,11 @@ import androidx.compose.ui.semantics.contentDescription
 import androidx.compose.ui.semantics.semantics
 import androidx.compose.ui.platform.LocalDensity
 import androidx.compose.ui.unit.dp
-import com.github.panpf.sketch.AsyncImage as SketchAsyncImage
-import com.github.panpf.sketch.LocalPlatformContext
-import com.github.panpf.sketch.PainterState
-import com.github.panpf.sketch.fetch.HttpUriFetcher
-import com.github.panpf.sketch.request.ImageRequest as SketchImageRequest
-import com.github.panpf.sketch.rememberAsyncImageState
 import coil3.compose.AsyncImage as CoilAsyncImage
 import vn.momo.kits.application.IsShowBaseLineDebug
 import vn.momo.kits.const.AppTheme
 import vn.momo.kits.const.Colors
 import vn.momo.kits.modifier.conditional
-import vn.momo.kits.utils.GifImageHttpClient
-import vn.momo.kits.utils.KitsKtorHttpStack
 
 data class Options(
     val alignment: Alignment = Alignment.TopStart,
@@ -124,7 +116,6 @@ fun Image(
             }
             .semantics { contentDescription = "img|$source" },
     ) {
-        val platformContext = LocalPlatformContext.current
         val urlToLoad = remember(source, maxWidth, maxHeight, density) {
             when (source) {
                 is String -> {
@@ -141,34 +132,20 @@ fun Image(
         }
 
         if (isGifUrl(urlToLoad)) {
-            val asyncImageState = rememberAsyncImageState()
-            val request = remember(platformContext, urlToLoad) {
-                SketchImageRequest(platformContext, urlToLoad) {
-                    components {
-                        add(HttpUriFetcher.Factory(KitsKtorHttpStack(GifImageHttpClient.client)))
-                    }
-                }
-            }
+            val imageState = remember(urlToLoad) { mutableStateOf(ImageState.Loading) }
 
-            SketchAsyncImage(
+            SketchGifImage(
                 modifier = Modifier.matchParentSize(),
-                request = request,
-                state = asyncImageState,
-                contentDescription = null,
+                url = urlToLoad,
                 contentScale = imageOptions.contentScale,
                 alignment = imageOptions.alignment,
                 colorFilter = imageOptions.colorFilter,
                 alpha = imageOptions.alpha,
+                onStateChanged = { imageState.value = it },
             )
 
-            val imageState = when (asyncImageState.painterState) {
-                is PainterState.Success -> ImageState.Success
-                is PainterState.Error -> ImageState.Error
-                else -> ImageState.Loading
-            }
-
             ImageStateContent(
-                imageState = imageState,
+                imageState = imageState.value,
                 loading = loading,
                 onLoadingChanged = currentOnLoadingChanged.value
             )

package/compose/src/commonMain/kotlin/vn/momo/kits/components/SketchGifImage.kt

@@ -0,0 +1,81 @@
+package vn.momo.kits.components
+
+import androidx.compose.foundation.Image
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.DisposableEffect
+import androidx.compose.runtime.LaunchedEffect
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.setValue
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.ColorFilter
+import androidx.compose.ui.graphics.DefaultAlpha
+import androidx.compose.ui.graphics.painter.Painter
+import androidx.compose.ui.layout.ContentScale
+import com.github.panpf.sketch.Sketch
+import com.github.panpf.sketch.decode.supportGif
+import com.github.panpf.sketch.fetch.HttpUriFetcher
+import com.github.panpf.sketch.request.ImageRequest
+import com.github.panpf.sketch.request.ImageResult
+import vn.momo.kits.utils.GifImageHttpClient
+import vn.momo.kits.utils.KitsKtorHttpStack
+import vn.momo.kits.utils.toSketchGifPainter
+import vn.momo.kits.utils.rememberSketchPlatformContext
+
+@Composable
+internal fun SketchGifImage(
+    url: String,
+    modifier: Modifier = Modifier,
+    contentScale: ContentScale = ContentScale.Crop,
+    alignment: Alignment = Alignment.Center,
+    colorFilter: ColorFilter? = null,
+    alpha: Float = DefaultAlpha,
+    onStateChanged: (ImageState) -> Unit,
+) {
+    val platformContext = rememberSketchPlatformContext()
+    val sketch = remember(platformContext) { Sketch(platformContext) }
+    var painter by remember(url) { mutableStateOf<Painter?>(null) }
+
+    DisposableEffect(sketch) {
+        onDispose { sketch.shutdown() }
+    }
+
+    LaunchedEffect(sketch, platformContext, url) {
+        painter = null
+        onStateChanged(ImageState.Loading)
+
+        val request = ImageRequest(platformContext, url) {
+            components {
+                add(HttpUriFetcher.Factory(KitsKtorHttpStack(GifImageHttpClient.client)))
+                supportGif()
+            }
+        }
+
+        when (val result = sketch.execute(request)) {
+            is ImageResult.Success -> {
+                val gifPainter = result.image.toSketchGifPainter()
+                if (gifPainter != null) {
+                    painter = gifPainter
+                    onStateChanged(ImageState.Success)
+                } else {
+                    onStateChanged(ImageState.Error)
+                }
+            }
+            is ImageResult.Error -> onStateChanged(ImageState.Error)
+        }
+    }
+
+    val currentPainter = painter ?: return
+    val rememberedPainter = remember(currentPainter) { currentPainter }
+    Image(
+        modifier = modifier,
+        painter = rememberedPainter,
+        contentDescription = null,
+        contentScale = contentScale,
+        alignment = alignment,
+        colorFilter = colorFilter,
+        alpha = alpha,
+    )
+}

package/compose/src/commonMain/kotlin/vn/momo/kits/utils/SketchGifBridge.kt

@@ -0,0 +1,116 @@
+package vn.momo.kits.utils
+
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.RememberObserver
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.setValue
+import androidx.compose.ui.geometry.Size
+import androidx.compose.ui.graphics.ColorFilter
+import androidx.compose.ui.graphics.DefaultAlpha
+import androidx.compose.ui.graphics.ImageBitmap
+import androidx.compose.ui.graphics.drawscope.DrawScope
+import androidx.compose.ui.graphics.painter.Painter
+import androidx.compose.ui.unit.IntSize
+import com.github.panpf.sketch.AnimatedImage
+import com.github.panpf.sketch.Bitmap
+import com.github.panpf.sketch.Image
+import com.github.panpf.sketch.PlatformContext
+import kotlinx.coroutines.CoroutineScope
+import kotlinx.coroutines.Dispatchers
+import kotlinx.coroutines.Job
+import kotlinx.coroutines.cancel
+import kotlinx.coroutines.delay
+import kotlinx.coroutines.isActive
+import kotlinx.coroutines.launch
+import kotlinx.coroutines.withContext
+import kotlin.math.ceil
+
+@Composable
+internal expect fun rememberSketchPlatformContext(): PlatformContext
+
+internal expect fun Bitmap.toComposeImageBitmap(): ImageBitmap
+
+internal expect fun Image?.toSketchGifPainter(): Painter?
+
+internal class SketchAnimatedImagePainter(
+    private val animatedImage: AnimatedImage,
+) : Painter(), RememberObserver {
+    private var alpha: Float = DefaultAlpha
+    private var colorFilter: ColorFilter? = null
+    private var frame by mutableStateOf<ImageBitmap?>(null)
+    private var scope: CoroutineScope? = null
+    private var playJob: Job? = null
+
+    override val intrinsicSize: Size = Size(
+        width = animatedImage.width.toFloat(),
+        height = animatedImage.height.toFloat(),
+    )
+
+    override fun DrawScope.onDraw() {
+        val currentFrame = frame ?: return
+        drawImage(
+            image = currentFrame,
+            dstSize = IntSize(
+                width = ceil(size.width).toInt(),
+                height = ceil(size.height).toInt(),
+            ),
+            alpha = alpha,
+            colorFilter = colorFilter,
+        )
+    }
+
+    override fun applyAlpha(alpha: Float): Boolean {
+        this.alpha = alpha
+        return true
+    }
+
+    override fun applyColorFilter(colorFilter: ColorFilter?): Boolean {
+        this.colorFilter = colorFilter
+        return true
+    }
+
+    override fun onRemembered() {
+        if (scope != null) return
+        val newScope = CoroutineScope(Dispatchers.Main)
+        scope = newScope
+        playJob = newScope.launch {
+            play()
+        }
+    }
+
+    override fun onAbandoned() = onForgotten()
+
+    override fun onForgotten() {
+        playJob?.cancel()
+        playJob = null
+        scope?.cancel()
+        scope = null
+    }
+
+    private suspend fun play() {
+        val frameCount = animatedImage.frameCount
+        if (frameCount <= 0) return
+
+        var loopIndex = 0
+        while (scope?.isActive == true && shouldContinue(loopIndex)) {
+            for (frameIndex in 0 until frameCount) {
+                if (scope?.isActive != true) return
+                frame = readFrame(frameIndex)
+                delay(animatedImage.frameDurations.getOrNull(frameIndex)?.toLong()?.takeIf { it > 0 } ?: 100L)
+            }
+            loopIndex++
+        }
+    }
+
+    private fun shouldContinue(loopIndex: Int): Boolean {
+        val repeatCount = animatedImage.repeatCount
+        return repeatCount <= 0 || loopIndex <= repeatCount
+    }
+
+    private suspend fun readFrame(frameIndex: Int): ImageBitmap = withContext(Dispatchers.Default) {
+        animatedImage.createFrameBitmap().also {
+            animatedImage.readFrame(it, frameIndex)
+        }.toComposeImageBitmap()
+    }
+}

package/compose/src/iosMain/kotlin/vn/momo/kits/utils/SketchGifBridge.ios.kt

@@ -0,0 +1,23 @@
+package vn.momo.kits.utils
+
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.graphics.ImageBitmap
+import androidx.compose.ui.graphics.asComposeImageBitmap
+import androidx.compose.ui.graphics.painter.Painter
+import com.github.panpf.sketch.AnimatedImage
+import com.github.panpf.sketch.Bitmap
+import com.github.panpf.sketch.Image
+import com.github.panpf.sketch.PlatformContext
+
+@Composable
+internal actual fun rememberSketchPlatformContext(): PlatformContext {
+    return PlatformContext.INSTANCE
+}
+
+internal actual fun Bitmap.toComposeImageBitmap(): ImageBitmap {
+    return asComposeImageBitmap()
+}
+
+internal actual fun Image?.toSketchGifPainter(): Painter? {
+    return if (this is AnimatedImage) SketchAnimatedImagePainter(this) else null
+}

package/gradle/libs.versions.toml

@@ -54,7 +54,7 @@ androidx-appcompat = { module = "androidx.appcompat:appcompat", version.ref = "a
 androidx-activity-compose = { module = "androidx.activity:activity-compose", version.ref = "androidx-activity" }
 material = { module = "com.google.android.material:material", version.ref = "material" }
 
-sketch-compose = { module = "io.github.panpf.sketch4:sketch-compose", version.ref = "sketch" }
+sketch-core = { module = "io.github.panpf.sketch4:sketch-core", version.ref = "sketch" }
 sketch-http-core = { module = "io.github.panpf.sketch4:sketch-http-core", version.ref = "sketch" }
 sketch-animated-gif = { module = "io.github.panpf.sketch4:sketch-animated-gif", version.ref = "sketch" }
 [plugins]

package/gradle.properties

@@ -18,7 +18,7 @@ kotlin.apple.xcodeCompatibility.nowarn=true
 name="ComposeKits"
 group=vn.momo.kits
 artifact.id=kits
-version=0.162.1-gif.10
+version=0.162.1-gif.11
 
 repo=GitLab
 url=https://gitlab.mservice.com.vn/api/v4/projects/5400/packages/maven

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@momo-kits/native-kits",
-  "version": "0.162.1-gif.10-debug",
+  "version": "0.162.1-gif.11-debug",
   "private": false,
   "dependencies": {},
   "devDependencies": {},