Add round-screen responsive Wear insets

This commit is contained in:
callebtc 2026-08-24 19:54:20 +02:00
parent 5852fca9b5
commit 2e41dabd07
7 changed files with 61 additions and 19 deletions

View File

@ -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 {

View File

@ -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 {

View File

@ -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 {

View File

@ -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 {

View File

@ -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 {

View File

@ -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

View File

@ -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))
}
}