@momo-kits/native-kits 0.162.2-test.21-debug → 0.162.2-test.22-debug

package/compose/build.gradle.kts

@@ -40,7 +40,7 @@ kotlin {
     }
 
     cocoapods {
-        version = "0.162.2-test.21-debug"
+        version = "0.162.2-test.22-debug"
         summary = "IOS Shared module"
         homepage = "https://momo.vn"
         ios.deploymentTarget = "15.0"

package/compose/compose.podspec

@@ -1,6 +1,6 @@
 Pod::Spec.new do |spec|
     spec.name                     = 'compose'
-    spec.version                  = '0.162.2-beta.20'
+    spec.version                  = '0.162.2-lottie.2'
     spec.homepage                 = 'https://momo.vn'
     spec.source                   = { :http=> ''}
     spec.authors                  = ''

package/compose/src/androidMain/kotlin/vn/momo/kits/platform/Platform.android.kt

@@ -8,7 +8,10 @@ import android.graphics.PorterDuffColorFilter
 import android.os.Build
 import androidx.compose.foundation.layout.Box
 import androidx.compose.runtime.Composable
+import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.getValue
+import androidx.compose.runtime.rememberUpdatedState
+import androidx.compose.runtime.snapshotFlow
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.NativePaint
@@ -21,7 +24,7 @@ import androidx.compose.ui.unit.dp
 import com.airbnb.lottie.LottieProperty
 import com.airbnb.lottie.compose.LottieAnimation
 import com.airbnb.lottie.compose.LottieCompositionSpec
-import com.airbnb.lottie.compose.LottieConstants
+import com.airbnb.lottie.compose.animateLottieCompositionAsState
 import com.airbnb.lottie.compose.rememberLottieComposition
 import com.airbnb.lottie.compose.rememberLottieDynamicProperties
 import com.airbnb.lottie.compose.rememberLottieDynamicProperty
@@ -78,11 +81,14 @@ actual fun LottieAnimation(
     tintColor: Color?,
     bgColor: Color?,
     placedAsOverlay: Boolean,
+    iterations: Int,
+    isPlaying: Boolean,
+    onEvent: ((String) -> Unit)?,
     modifier: Modifier,
     useCompose: Boolean
 ) {
     if (useCompose) {
-        ComposeLottieAnimation(path, tintColor, bgColor, modifier)
+        ComposeLottieAnimation(path, tintColor, bgColor, iterations, isPlaying, onEvent, modifier)
         return
     }
 
@@ -110,9 +116,32 @@ actual fun LottieAnimation(
         )
     )
 
+    val lottieState = animateLottieCompositionAsState(
+        composition = composition,
+        iterations = iterations,
+        isPlaying = isPlaying,
+        restartOnPlay = false,
+    )
+
+    val currentOnEvent by rememberUpdatedState(onEvent)
+
+    LaunchedEffect(isPlaying) {
+        currentOnEvent?.invoke(if (isPlaying) LottieEvent.Start else LottieEvent.Pause)
+    }
+
+    // Only fire finish once the animation has actually advanced (armed by a not-at-end frame) then
+    // reaches the end, so a transient isAtEnd at init can't produce a spurious callback.
+    LaunchedEffect(lottieState) {
+        var armed = false
+        snapshotFlow { lottieState.isAtEnd }.collect { atEnd ->
+            if (!atEnd) armed = true
+            else if (armed) { armed = false; currentOnEvent?.invoke(LottieEvent.Finish) }
+        }
+    }
+
     LottieAnimation(
         composition = composition,
-        iterations = LottieConstants.IterateForever,
+        progress = { lottieState.progress },
         dynamicProperties = if (tintColor != null) dynamicProperties else null,
         modifier = modifier
     )

package/compose/src/commonMain/kotlin/vn/momo/kits/navigation/Navigation.kt

@@ -33,6 +33,7 @@ class Navigation(
         tintColor: Color? = null,
         footerComponent: (@Composable () -> Unit)? = null,
         floatingButtonProps: FloatingButtonProps? = null,
+        applyContentBottomPadding: Boolean? = null,
         keyboardOptions: KeyboardOptions? = null
     ) {
         updateOptions(
@@ -49,6 +50,7 @@ class Navigation(
                 tintColor = tintColor ?: options.tintColor,
                 footerComponent = footerComponent ?: options.footerComponent,
                 floatingButtonProps = floatingButtonProps ?: options.floatingButtonProps,
+                applyContentBottomPadding = applyContentBottomPadding ?: options.applyContentBottomPadding,
                 keyboardOptions = keyboardOptions ?: options.keyboardOptions,
             )
         )
@@ -84,6 +86,9 @@ data class NavigationOptions(
     val tintColor: Color? = null,
     val footerComponent: @Composable (() -> Unit)? = null,
     val floatingButtonProps: FloatingButtonProps? = null,
+    // Reserve the bottom safe-area (navigation bar) padding on the content when there is no footer.
+    // Set false for screens that draw edge-to-edge or handle their own bottom inset.
+    val applyContentBottomPadding: Boolean = true,
     val keyboardOptions: KeyboardOptions = KeyboardOptions()
 ) {
     internal fun hasFooter() : Boolean = footerComponent != null

package/compose/src/commonMain/kotlin/vn/momo/kits/navigation/StackScreen.kt

@@ -208,7 +208,7 @@ internal fun StackScreen(
             }
 
             Box(Modifier.zIndex(6f)) {
-                FloatingContent()
+                FloatingContent(isBottomTabChild = isBottomTabChild)
             }
 
             OverplayView(isBottomTabChild = isBottomTabChild, id = id)
@@ -218,15 +218,13 @@ internal fun StackScreen(
 
 @Suppress("FrequentlyChangingValue")
 @Composable
-internal fun FloatingContent() {
+internal fun FloatingContent(isBottomTabChild: Boolean) {
     val options = LocalOptions.current
     val density = LocalDensity.current
     val footerHeightPx = LocalFooterHeightPx.current
     val scrollState = LocalScrollState.current
     val navigationBar = AppNavigationBar.current
 
-    val isBottomTabChild = LocalNavigation.current.bottomTabIndex != -1
-
     val fabProps = options.floatingButtonProps ?: return
     val bottomPadding = fabProps.bottom
         ?: (Spacing.M + when {
@@ -281,8 +279,7 @@ internal fun ColumnScope.MainContent(content: @Composable () -> Unit, isBottomTa
             .padding(
                 bottom = when {
                     options.hasFooter() || isBottomTabRoot -> 0.dp
-                    // navigationBar must collapse with the IME too, else it leaves a gap
-                    // between the content and the keyboard (imePadding already lifted it).
+                    !options.applyContentBottomPadding -> 0.dp
                     isBottomTabChild -> bottomTabBarInset() + (navigationBar - keyboardSizeState().value).coerceAtLeast(0.dp)
                     else -> navigationBar
                 }
@@ -318,7 +315,7 @@ internal fun FooterContent() {
     val options = LocalOptions.current
     if (options.hasFooter()) {
         val keyboardSize = keyboardSizeState()
-        val bottomPadding = (AppNavigationBar.current + bottomTabBarInset() - keyboardSize.value).coerceAtLeast(0.dp)
+        val bottomPadding = (AppNavigationBar.current - keyboardSize.value).coerceAtLeast(0.dp)
         Footer(footerComponent = options.footerComponent, bottomPadding = bottomPadding)
     }
 }

package/compose/src/commonMain/kotlin/vn/momo/kits/platform/ComposeLottieAnimation.kt

@@ -5,10 +5,12 @@ import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.runtime.Composable
+import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.getValue
+import androidx.compose.runtime.rememberUpdatedState
+import androidx.compose.runtime.snapshotFlow
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
-import io.github.alexzhirkevich.compottie.Compottie
 import io.github.alexzhirkevich.compottie.ExperimentalCompottieApi
 import io.github.alexzhirkevich.compottie.LottieCompositionSpec
 import io.github.alexzhirkevich.compottie.animateLottieCompositionAsState
@@ -23,6 +25,9 @@ internal fun ComposeLottieAnimation(
     path: String,
     tintColor: Color?,
     bgColor: Color?,
+    iterations: Int,
+    isPlaying: Boolean,
+    onEvent: ((String) -> Unit)?,
     modifier: Modifier,
 ) {
     val json = readJson(path)
@@ -49,9 +54,25 @@ internal fun ComposeLottieAnimation(
 
     val lottieState = animateLottieCompositionAsState(
         composition = composition,
-        iterations = Compottie.IterateForever,
+        iterations = iterations,
+        isPlaying = isPlaying,
+        restartOnPlay = false,
     )
 
+    val currentOnEvent by rememberUpdatedState(onEvent)
+
+    LaunchedEffect(isPlaying) {
+        currentOnEvent?.invoke(if (isPlaying) LottieEvent.Start else LottieEvent.Pause)
+    }
+
+    LaunchedEffect(lottieState) {
+        var armed = false
+        snapshotFlow { lottieState.isAtEnd }.collect { atEnd ->
+            if (!atEnd) armed = true
+            else if (armed) { armed = false; currentOnEvent?.invoke(LottieEvent.Finish) }
+        }
+    }
+
     Box(modifier.background(bgColor ?: Color.Transparent)) {
         Image(
             painter = rememberLottiePainter(

package/compose/src/commonMain/kotlin/vn/momo/kits/platform/Platform.kt

@@ -43,12 +43,26 @@ fun supportsImePadding(): Boolean = when (val v = getOSVersion()) {
     is OSVersion.Android -> v.sdk > 29
     is OSVersion.IOS -> true
 }
+/** Sentinel for [LottieAnimation.iterations] meaning "loop forever" (kept as the default). */
+const val LottieIterateForever: Int = Int.MAX_VALUE
+
+/** Event names emitted by [LottieAnimation.onEvent]. */
+object LottieEvent {
+    const val Start = "start"    // playback (re)started — isPlaying became true
+    const val Pause = "pause"    // playback paused — isPlaying became false
+    const val Finish = "finish"  // completed all iterations; never for LottieIterateForever
+}
+
 @Composable
 expect fun LottieAnimation(
     path: String,
     tintColor: Color? = null,
     bgColor: Color? = null,
     placedAsOverlay: Boolean = false,
+    iterations: Int = LottieIterateForever,
+    isPlaying: Boolean = true,
+    // Single listener for playback events; receives a LottieEvent.* string.
+    onEvent: ((String) -> Unit)? = null,
     modifier: Modifier = Modifier,
     useCompose: Boolean = false
 )

package/compose/src/iosMain/kotlin/vn/momo/kits/platform/Platform.ios.kt

@@ -11,6 +11,7 @@ import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
+import androidx.compose.runtime.rememberUpdatedState
 import androidx.compose.runtime.setValue
 import androidx.compose.ui.ExperimentalComposeUiApi
 import androidx.compose.ui.InternalComposeUiApi
@@ -96,20 +97,41 @@ actual fun LottieAnimation(
     tintColor: Color?,
     bgColor: Color?,
     placedAsOverlay: Boolean,
+    iterations: Int,
+    isPlaying: Boolean,
+    onEvent: ((String) -> Unit)?,
     modifier: Modifier,
     useCompose: Boolean
 ) {
     if (useCompose) {
-        ComposeLottieAnimation(path, tintColor, bgColor, modifier)
+        ComposeLottieAnimation(path, tintColor, bgColor, iterations, isPlaying, onEvent, modifier)
         return
     }
 
+    val loopCount = if (iterations == LottieIterateForever) -1.0 else iterations.toDouble()
+
     var animation by remember { mutableStateOf<CompatibleAnimation?>(null) }
+    val animationView = remember { mutableStateOf<CompatibleAnimationView?>(null) }
 
     LaunchedEffect(Unit) {
         animation = CompatibleAnimation(name = "compose-resources/composeResources/vn.momo.compose.resources/".plus(path), subdirectory = null, NSBundle.mainBundle)
     }
 
+    val currentOnEvent by rememberUpdatedState(onEvent)
+
+    LaunchedEffect(isPlaying) {
+        currentOnEvent?.invoke(if (isPlaying) LottieEvent.Start else LottieEvent.Pause)
+    }
+
+    LaunchedEffect(animationView.value, isPlaying) {
+        val view = animationView.value ?: return@LaunchedEffect
+        if (isPlaying) {
+            view.playWithCompletion(completion = { finished -> if (finished) currentOnEvent?.invoke(LottieEvent.Finish) })
+        } else {
+            view.pause()
+        }
+    }
+
     when (val value = animation) {
         null -> {
             Box(modifier)
@@ -126,7 +148,7 @@ actual fun LottieAnimation(
 
                             setBackgroundColor(bgColor?.toUIColor() ?: UIColor.clearColor)
 
-                            setLoopAnimationCount(-1.0)
+                            setLoopAnimationCount(loopCount)
                             setAnimationSpeed(1.0)
 
                             if (tintColor != null) {
@@ -140,12 +162,13 @@ actual fun LottieAnimation(
                                 setColorValue(uiColor, CompatibleAnimationKeypath("**.Stroke.Color"))
                             }
 
-                            play()
+                            animationView.value = this
                         }
                     },
 
                     update = { view ->
                         view.setBackgroundColor(bgColor?.toUIColor() ?: UIColor.clearColor)
+                        view.setLoopAnimationCount(loopCount)
 
                         if (tintColor != null) {
                             val uiColor = tintColor.toUIColor()

package/gradle.properties

@@ -18,7 +18,7 @@ kotlin.apple.xcodeCompatibility.nowarn=true
 name="ComposeKits"
 group=vn.momo.kits
 artifact.id=kits
-version=0.162.2-test.21
+version=0.162.2-test.22
 
 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.2-test.21-debug",
+  "version": "0.162.2-test.22-debug",
   "private": false,
   "dependencies": {},
   "devDependencies": {},