diff --git a/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/App.kt b/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/App.kt index 9b6b05296c..cba4075d15 100644 --- a/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/App.kt +++ b/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/App.kt @@ -11,12 +11,11 @@ import androidx.compose.runtime.* import androidx.compose.runtime.saveable.rememberSaveable import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier -import androidx.compose.ui.draw.clipToBounds -import androidx.compose.ui.draw.drawBehind +import androidx.compose.ui.draw.* import androidx.compose.ui.geometry.Offset import androidx.compose.ui.geometry.Size -import androidx.compose.ui.graphics.Color -import androidx.compose.ui.graphics.graphicsLayer +import androidx.compose.ui.graphics.* +import androidx.compose.ui.graphics.drawscope.clipRect import androidx.compose.ui.platform.LocalDensity import androidx.compose.ui.platform.LocalLayoutDirection import androidx.compose.ui.unit.dp @@ -43,6 +42,7 @@ import dev.icerock.moko.resources.compose.painterResource import dev.icerock.moko.resources.compose.stringResource import kotlinx.coroutines.* import kotlinx.coroutines.flow.* +import kotlin.math.absoluteValue @Composable fun AppScreen() { @@ -75,15 +75,13 @@ fun AppScreen() { MainScreen() } } - Box(Modifier.width(paddingStart + cutoutMax) - .fillMaxHeight() - .graphicsLayer { alpha = if (fullscreenGallery.value) 0f else 1f } - .background(MaterialTheme.colors.background)) - Box(Modifier.align(Alignment.CenterEnd) - .width(paddingEnd + cutoutMax) - .fillMaxHeight() - .graphicsLayer { alpha = if (fullscreenGallery.value) 0f else 1f } - .background(MaterialTheme.colors.background)) +// Box(Modifier.width(paddingStart + cutoutMax) +// .fillMaxHeight() +// .drawBehind { drawRect(if (fullscreenGallery.value) Color.Black else CurrentColors.value.colors.background) }) +// Box(Modifier.align(Alignment.CenterEnd) +// .width(paddingEnd + cutoutMax) +// .fillMaxHeight() +// .drawBehind { drawRect(if (fullscreenGallery.value) Color.Black else CurrentColors.value.colors.background) }) } } } @@ -297,8 +295,14 @@ fun AndroidScreen(userPickerState: MutableStateFlow) { BoxWithConstraints { val currentChatId = remember { mutableStateOf(chatModel.chatId.value) } val offset = remember { Animatable(if (chatModel.chatId.value == null) 0f else maxWidth.value) } + val cutout = WindowInsets.displayCutout.only(WindowInsetsSides.Horizontal).asPaddingValues() + val direction = LocalLayoutDirection.current + val hasCutout = cutout.calculateStartPadding(direction) + cutout.calculateEndPadding(direction) > 0.dp Box( Modifier + // clipping only for devices with cutout currently visible on sides. It prevents showing chat list with open chat view + // In order cases it's not needed to use clip + .then(if (hasCutout) Modifier.clip(RectangleShape) else Modifier) .graphicsLayer { // minOf thing is needed for devices with holes in screen while the user on ChatView rotates his phone from portrait to landscape // because in this case (at least in emulator) maxWidth changes in two steps: big first, smaller on next frame. @@ -332,6 +336,7 @@ fun AndroidScreen(userPickerState: MutableStateFlow) { } } Box(Modifier + .then(if (hasCutout) Modifier.clip(RectangleShape) else Modifier) .graphicsLayer { translationX = maxWidth.toPx() - minOf(offset.value.dp, maxWidth).toPx() } ) Box2@{ currentChatId.value?.let { diff --git a/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/helpers/ModalView.kt b/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/helpers/ModalView.kt index abe2e29341..cc2d222a55 100644 --- a/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/helpers/ModalView.kt +++ b/apps/multiplatform/common/src/commonMain/kotlin/chat/simplex/common/views/helpers/ModalView.kt @@ -7,7 +7,9 @@ import androidx.compose.foundation.layout.* import androidx.compose.material.* import androidx.compose.runtime.* import androidx.compose.ui.Modifier +import androidx.compose.ui.draw.clip import androidx.compose.ui.graphics.Color +import androidx.compose.ui.graphics.RectangleShape import chat.simplex.common.model.ChatController.appPrefs import chat.simplex.common.model.ChatModel import chat.simplex.common.platform.*