From b41be5c649c8db42ce08324ba6ad7b0d4e39e489 Mon Sep 17 00:00:00 2001 From: MohamedRejeb Date: Tue, 20 Aug 2024 15:24:04 +0100 Subject: [PATCH] Apply AdaptiveBottomSheet containerColor to UIKit Sheet --- .../calf/ui/sheet/AdaptiveBottomSheet.ios.kt | 36 +++++++++++++++---- .../calf/ui/sheet/BottomSheetManager.kt | 28 ++++++++++----- 2 files changed, 48 insertions(+), 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 index d26eccd..d9d9945 100644 --- 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 index c431ec4..ebd6da4 100644 --- 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,