diff --git a/wear/src/main/java/com/bitchat/watch/ui/ChatScaffold.kt b/wear/src/main/java/com/bitchat/watch/ui/ChatScaffold.kt index 9f7b54f4..7bbbcd77 100644 --- a/wear/src/main/java/com/bitchat/watch/ui/ChatScaffold.kt +++ b/wear/src/main/java/com/bitchat/watch/ui/ChatScaffold.kt @@ -266,11 +266,13 @@ private fun ChatBody( // The padding reserves permanent room for the floating header and action // bar; being constant, it never disturbs an in-flight scroll gesture. verticalArrangement = Arrangement.Bottom, - contentPadding = scaffoldPadding.withMinimumVerticalPadding( - layoutDirection = layoutDirection, - top = 30.dp, - bottom = 64.dp - ) + contentPadding = scaffoldPadding + .withRoundScreenPadding(layoutDirection) + .withMinimumVerticalPadding( + layoutDirection = layoutDirection, + top = 30.dp, + bottom = 64.dp + ) ) { if (messages.isEmpty()) { item { diff --git a/wear/src/main/java/com/bitchat/watch/ui/PeerDebugScreen.kt b/wear/src/main/java/com/bitchat/watch/ui/PeerDebugScreen.kt index c91a220e..bda2c2bd 100644 --- a/wear/src/main/java/com/bitchat/watch/ui/PeerDebugScreen.kt +++ b/wear/src/main/java/com/bitchat/watch/ui/PeerDebugScreen.kt @@ -13,6 +13,7 @@ import androidx.compose.runtime.collectAsState import androidx.compose.runtime.getValue import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier +import androidx.compose.ui.platform.LocalLayoutDirection import androidx.compose.ui.res.painterResource import androidx.compose.ui.text.font.FontWeight import androidx.compose.ui.text.style.TextAlign @@ -46,11 +47,12 @@ fun PeerDebugScreen() { val rssi = mesh?.getPeerRSSI() ?: emptyMap() val identityRevision by WearPeerIdentityState.revision.collectAsState() - ScreenScaffold(scrollState = listState) { contentPadding -> + ScreenScaffold(scrollState = listState) { scaffoldPadding -> + val layoutDirection = LocalLayoutDirection.current ScalingLazyColumn( state = listState, modifier = Modifier.fillMaxSize(), - contentPadding = contentPadding + contentPadding = scaffoldPadding.withRoundScreenPadding(layoutDirection) ) { item { ListHeader { diff --git a/wear/src/main/java/com/bitchat/watch/ui/PeopleScreen.kt b/wear/src/main/java/com/bitchat/watch/ui/PeopleScreen.kt index b3f912f9..d8d7df17 100644 --- a/wear/src/main/java/com/bitchat/watch/ui/PeopleScreen.kt +++ b/wear/src/main/java/com/bitchat/watch/ui/PeopleScreen.kt @@ -17,6 +17,7 @@ import androidx.compose.runtime.mutableStateOf import androidx.compose.runtime.remember import androidx.compose.runtime.setValue import androidx.compose.ui.platform.LocalContext +import androidx.compose.ui.platform.LocalLayoutDirection import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.res.painterResource @@ -67,11 +68,12 @@ fun PeopleScreen(onOpenDm: (String) -> Unit, onEditNickname: () -> Unit) { ) } - ScreenScaffold(scrollState = listState) { contentPadding -> + ScreenScaffold(scrollState = listState) { scaffoldPadding -> + val layoutDirection = LocalLayoutDirection.current ScalingLazyColumn( state = listState, modifier = Modifier.fillMaxSize(), - contentPadding = contentPadding + contentPadding = scaffoldPadding.withRoundScreenPadding(layoutDirection) ) { item { ListHeader { diff --git a/wear/src/main/java/com/bitchat/watch/ui/UserDetailScreen.kt b/wear/src/main/java/com/bitchat/watch/ui/UserDetailScreen.kt index 1c2a5616..1188fed0 100644 --- a/wear/src/main/java/com/bitchat/watch/ui/UserDetailScreen.kt +++ b/wear/src/main/java/com/bitchat/watch/ui/UserDetailScreen.kt @@ -53,11 +53,13 @@ fun UserDetailScreen( ScalingLazyColumn( state = listState, modifier = Modifier.fillMaxSize(), - contentPadding = scaffoldPadding.withAdditionalPadding( - layoutDirection = layoutDirection, - horizontal = 10.dp, - vertical = 8.dp - ) + contentPadding = scaffoldPadding + .withRoundScreenPadding(layoutDirection) + .withAdditionalPadding( + layoutDirection = layoutDirection, + horizontal = 10.dp, + vertical = 8.dp + ) ) { item { ListHeader { diff --git a/wear/src/main/java/com/bitchat/watch/ui/VerificationCodeScreen.kt b/wear/src/main/java/com/bitchat/watch/ui/VerificationCodeScreen.kt index 67517c91..89e83ee3 100644 --- a/wear/src/main/java/com/bitchat/watch/ui/VerificationCodeScreen.kt +++ b/wear/src/main/java/com/bitchat/watch/ui/VerificationCodeScreen.kt @@ -48,11 +48,13 @@ fun VerificationCodeScreen(peerID: String) { ScalingLazyColumn( state = listState, modifier = Modifier.fillMaxSize(), - contentPadding = scaffoldPadding.withAdditionalPadding( - layoutDirection = layoutDirection, - horizontal = 10.dp, - vertical = 8.dp - ) + contentPadding = scaffoldPadding + .withRoundScreenPadding(layoutDirection) + .withAdditionalPadding( + layoutDirection = layoutDirection, + horizontal = 10.dp, + vertical = 8.dp + ) ) { item { ListHeader { diff --git a/wear/src/main/java/com/bitchat/watch/ui/WearContentPadding.kt b/wear/src/main/java/com/bitchat/watch/ui/WearContentPadding.kt index 28425369..0419bdfa 100644 --- a/wear/src/main/java/com/bitchat/watch/ui/WearContentPadding.kt +++ b/wear/src/main/java/com/bitchat/watch/ui/WearContentPadding.kt @@ -1,9 +1,12 @@ package com.bitchat.watch.ui import androidx.compose.foundation.layout.PaddingValues +import androidx.compose.runtime.Composable +import androidx.compose.ui.platform.LocalConfiguration import androidx.compose.ui.unit.Dp import androidx.compose.ui.unit.LayoutDirection import androidx.compose.ui.unit.dp +import kotlin.math.ceil /** * Preserve the responsive, shape-aware padding supplied by Wear Material while allowing a @@ -50,3 +53,25 @@ internal fun PaddingValues.withMinimumVerticalPadding( bottom = maxOf(calculateBottomPadding(), bottom) ) } + +@Composable +internal fun PaddingValues.withRoundScreenPadding( + layoutDirection: LayoutDirection +): PaddingValues = withAdditionalPadding( + layoutDirection = layoutDirection, + horizontal = additionalRoundScreenPadding( + screenWidthDp = LocalConfiguration.current.screenWidthDp, + isScreenRound = LocalConfiguration.current.isScreenRound + ) +) + +internal fun additionalRoundScreenPadding( + screenWidthDp: Int, + isScreenRound: Boolean +): Dp = if (isScreenRound) { + ceil(screenWidthDp * ROUND_SCREEN_ADDITIONAL_PADDING_FRACTION).toInt().dp +} else { + 0.dp +} + +private const val ROUND_SCREEN_ADDITIONAL_PADDING_FRACTION = 0.10f diff --git a/wear/src/test/java/com/bitchat/watch/ui/WearContentPaddingTest.kt b/wear/src/test/java/com/bitchat/watch/ui/WearContentPaddingTest.kt index 2b16c876..3fe5273b 100644 --- a/wear/src/test/java/com/bitchat/watch/ui/WearContentPaddingTest.kt +++ b/wear/src/test/java/com/bitchat/watch/ui/WearContentPaddingTest.kt @@ -37,4 +37,11 @@ class WearContentPaddingTest { assertEquals(30.dp, resolved.calculateTopPadding()) assertEquals(64.dp, resolved.calculateBottomPadding()) } + + @Test + fun `round screens receive an additional ten percent inset`() { + assertEquals(20.dp, additionalRoundScreenPadding(192, isScreenRound = true)) + assertEquals(22.dp, additionalRoundScreenPadding(220, isScreenRound = true)) + assertEquals(0.dp, additionalRoundScreenPadding(192, isScreenRound = false)) + } }