Merge pull request #155 from MohamedRejeb/0.5.x

Apply AdaptiveBottomSheet containerColor to UIKit Sheet
MohamedRejeb · Aug 20, 2024 · 08cba0e · 08cba0e
2 parents 7286941 + b41be5c
commit 08cba0e
Show file tree

Hide file tree

Showing 2 changed files with 48 additions and 16 deletions.
diff --git a/calf-ui/src/iosMain/kotlin/com/mohamedrejeb/calf/ui/sheet/AdaptiveBottomSheet.ios.kt b/calf-ui/src/iosMain/kotlin/com/mohamedrejeb/calf/ui/sheet/AdaptiveBottomSheet.ios.kt
@@ -4,12 +4,13 @@ import androidx.compose.foundation.isSystemInDarkTheme
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.ColumnScope
 import androidx.compose.foundation.layout.WindowInsets
+import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.SheetValue
+import androidx.compose.material3.Surface
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.CompositionLocalProvider
 import androidx.compose.runtime.DisposableEffect
-import androidx.compose.runtime.InternalComposeApi
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.currentCompositionLocalContext
 import androidx.compose.runtime.getValue
@@ -42,12 +43,21 @@ actual fun AdaptiveBottomSheet(
     val compositionLocalContext = rememberUpdatedState(currentCompositionLocalContext)
     val currentUIViewController = LocalUIViewController.current
 
+    val skipPartiallyExpandedState = rememberUpdatedState(adaptiveSheetState.skipPartiallyExpanded)
+    val modifierState = rememberUpdatedState(modifier)
+    val shapeState = rememberUpdatedState(shape)
+    val containerColorState = rememberUpdatedState(containerColor)
+    val contentColorState = rememberUpdatedState(contentColor)
+    val tonalElevationState = rememberUpdatedState(tonalElevation)
+    val contentState = rememberUpdatedState(content)
+
     val isDark = isSystemInDarkTheme()
 
     val sheetManager = remember(currentUIViewController) {
         BottomSheetManager(
             parentUIViewController = currentUIViewController,
-            dark = isDark,
+            isDark = isDark,
+            containerColor = containerColor,
             onDismiss = {
                 onDismissRequest()
             },
@@ -57,7 +67,7 @@ actual fun AdaptiveBottomSheet(
                 CompositionLocalProvider(compositionLocalContext.value) {
                     CompositionLocalProvider(sheetCompositionLocalContext) {
                         // TODO: To remove on 1.7.0
-                        if (!adaptiveSheetState.skipPartiallyExpanded) {
+                        if (!skipPartiallyExpandedState.value) {
                             var update by remember { mutableIntStateOf(0) }
 
                             LaunchedEffect(Unit) {
@@ -72,10 +82,18 @@ actual fun AdaptiveBottomSheet(
                             update
                         }
 
-                        Column(
-                            modifier = modifier,
-                            content = content,
-                        )
+                        Surface(
+                            shape = shapeState.value,
+                            color = containerColorState.value,
+                            contentColor = contentColorState.value,
+                            tonalElevation = tonalElevationState.value,
+                            modifier = modifierState.value.fillMaxWidth()
+                        ) {
+                            Column(
+                                modifier = Modifier.fillMaxWidth(),
+                                content = contentState.value,
+                            )
+                        }
                     }
                 }
             }
@@ -90,6 +108,10 @@ actual fun AdaptiveBottomSheet(
         sheetManager.applyTheme(isDark)
     }
 
+    LaunchedEffect(containerColor) {
+        sheetManager.applyContainerColor(containerColor)
+    }
+
     LaunchedEffect(adaptiveSheetState.sheetValue) {
         if (adaptiveSheetState.sheetValue == SheetValue.Hidden) {
             sheetManager.hide(

diff --git a/calf-ui/src/iosMain/kotlin/com/mohamedrejeb/calf/ui/sheet/BottomSheetManager.kt b/calf-ui/src/iosMain/kotlin/com/mohamedrejeb/calf/ui/sheet/BottomSheetManager.kt
@@ -1,10 +1,11 @@
 package com.mohamedrejeb.calf.ui.sheet
 
 import androidx.compose.runtime.Composable
+import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.window.ComposeUIViewController
 import com.mohamedrejeb.calf.ui.utils.applyTheme
+import com.mohamedrejeb.calf.ui.utils.toUIColor
 import platform.UIKit.UIAdaptivePresentationControllerDelegateProtocol
-import platform.UIKit.UIApplication
 import platform.UIKit.UIModalPresentationPageSheet
 import platform.UIKit.UIModalTransitionStyleCoverVertical
 import platform.UIKit.UIPresentationController
@@ -22,10 +23,13 @@ import platform.darwin.NSObject
  */
 internal class BottomSheetManager(
     private val parentUIViewController: UIViewController,
-    dark: Boolean,
-    private val onDismiss: () -> Unit,
+    private var isDark: Boolean,
+    private var containerColor: Color,
+    private var onDismiss: () -> Unit,
     private val content: @Composable () -> Unit
 ) {
+    private var isInitialized = false
+
     /**
      * Indicates whether the bottom sheet is currently presented.
      */
@@ -36,8 +40,6 @@ internal class BottomSheetManager(
      */
     private var isAnimating = false
 
-    private var isDark = dark
-
     /**
      * The presentation controller delegate that is used to detect when the bottom sheet is dismissed.
      */
@@ -58,25 +60,30 @@ internal class BottomSheetManager(
             modalPresentationStyle = UIModalPresentationPageSheet
             modalTransitionStyle = UIModalTransitionStyleCoverVertical
             presentationController?.delegate = presentationControllerDelegate
-            applyTheme(isDark)
+            isInitialized = true
         }
     }
 
     fun applyTheme(dark: Boolean) {
         isDark = dark
 
-        if (isPresented)
+        if (isInitialized)
             bottomSheetUIViewController.applyTheme(dark)
     }
 
+    fun applyContainerColor(color: Color) {
+        containerColor = color
+
+        if (isInitialized)
+            bottomSheetUIViewController.view.backgroundColor = color.toUIColor()
+    }
+
     /**
      * Shows the bottom sheet.
      */
     fun show(
         skipPartiallyExpanded: Boolean,
     ) {
-        applyTheme(isDark)
-
         if (isPresented || isAnimating) return
         isAnimating = true
 
@@ -93,6 +100,9 @@ internal class BottomSheetManager(
         )
         bottomSheetUIViewController.sheetPresentationController?.prefersGrabberVisible = true
 
+        applyTheme(isDark)
+        applyContainerColor(containerColor)
+
         parentUIViewController.presentViewController(
             viewControllerToPresent = bottomSheetUIViewController,
             animated = true,