Atte149/book-story
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

🛠️ Apply cutout padding for Tablet UI

Browse source 
* Applied cutout padding (if there is) to side padding while in Tablet UI mode
This commit is contained in:
Acclorite 2024-08-31 19:05:50 +03:00
parent b432b7a3e5
commit 84d78caef5
2 changed files with 16 additions and 26 deletions
Download patch file Download diff file Expand all files Collapse all files

12
app/src/main/java/ua/acclorite/book_story/presentation/components/custom_navigation_rail/CustomNavigationRail.kt
View file

@ -2,11 +2,11 @@ package ua.acclorite.book_story.presentation.components.custom_navigation_rail
import androidx.compose.foundation.background import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.BoxScope
import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.WindowInsets import androidx.compose.foundation.layout.WindowInsets
import androidx.compose.foundation.layout.asPaddingValues import androidx.compose.foundation.layout.asPaddingValues
import androidx.compose.foundation.layout.calculateStartPadding import androidx.compose.foundation.layout.calculateStartPadding
import androidx.compose.foundation.layout.displayCutout
import androidx.compose.foundation.layout.fillMaxHeight import androidx.compose.foundation.layout.fillMaxHeight
import androidx.compose.foundation.layout.navigationBars import androidx.compose.foundation.layout.navigationBars
import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.padding
@ -31,7 +31,7 @@ import ua.acclorite.book_story.presentation.data.LocalNavigator
* Custom Navigation Rail. It is used to be shown on Tablets. * Custom Navigation Rail. It is used to be shown on Tablets.
*/ */
@Composable @Composable
fun BoxScope.CustomNavigationRail() { fun CustomNavigationRail() {
var currentScreen: Route? by remember { mutableStateOf(null) } var currentScreen: Route? by remember { mutableStateOf(null) }
val navigator = LocalNavigator.current val navigator = LocalNavigator.current
val layoutDirection = LocalLayoutDirection.current val layoutDirection = LocalLayoutDirection.current
@ -50,14 +50,14 @@ fun BoxScope.CustomNavigationRail() {
NavigationRail( NavigationRail(
modifier = Modifier modifier = Modifier
.align(
Alignment.CenterStart
)
.background(MaterialTheme.colorScheme.surfaceContainer) .background(MaterialTheme.colorScheme.surfaceContainer)
.padding( .padding(
start = WindowInsets.navigationBars start = WindowInsets.navigationBars
.asPaddingValues() .asPaddingValues()
.calculateStartPadding(layoutDirection) .calculateStartPadding(layoutDirection) +
WindowInsets.displayCutout
.asPaddingValues()
.calculateStartPadding(layoutDirection)
) )
.width(80.dp) .width(80.dp)
.padding(horizontal = 12.dp), .padding(horizontal = 12.dp),

30
app/src/main/java/ua/acclorite/book_story/presentation/data/Navigation.kt
View file

@ -10,7 +10,7 @@ import androidx.compose.animation.EnterTransition
import androidx.compose.animation.ExitTransition import androidx.compose.animation.ExitTransition
import androidx.compose.foundation.background import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.BoxScope import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.calculateEndPadding import androidx.compose.foundation.layout.calculateEndPadding
import androidx.compose.foundation.layout.calculateStartPadding import androidx.compose.foundation.layout.calculateStartPadding
import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.foundation.layout.fillMaxSize
@ -32,7 +32,6 @@ import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color import androidx.compose.ui.graphics.Color
import androidx.compose.ui.platform.LocalContext import androidx.compose.ui.platform.LocalContext
import androidx.compose.ui.platform.LocalLayoutDirection import androidx.compose.ui.platform.LocalLayoutDirection
import androidx.compose.ui.unit.dp
import androidx.lifecycle.SavedStateHandle import androidx.lifecycle.SavedStateHandle
import androidx.lifecycle.ViewModel import androidx.lifecycle.ViewModel
import androidx.lifecycle.viewModelScope import androidx.lifecycle.viewModelScope
@ -332,7 +331,7 @@ class Navigator @AssistedInject constructor(
exitBarAnim: ExitTransition = Transitions.SlidingTransitionOut, exitBarAnim: ExitTransition = Transitions.SlidingTransitionOut,
backExitBarAnim: ExitTransition = Transitions.BackSlidingTransitionOut, backExitBarAnim: ExitTransition = Transitions.BackSlidingTransitionOut,
bottomBar: @Composable () -> Unit, bottomBar: @Composable () -> Unit,
navigationRail: @Composable BoxScope.() -> Unit, navigationRail: @Composable () -> Unit,
content: @Composable () -> Unit content: @Composable () -> Unit
) { ) {
val activity = LocalContext.current as ComponentActivity val activity = LocalContext.current as ComponentActivity
@ -365,35 +364,26 @@ class Navigator @AssistedInject constructor(
}, },
containerColor = MaterialTheme.colorScheme.surface containerColor = MaterialTheme.colorScheme.surface
) { ) {
Box( Row(
modifier = Modifier modifier = Modifier
.fillMaxSize() .fillMaxSize()
) { ) {
if (tabletUI) {
navigationRail()
}
Box( Box(
modifier = Modifier modifier = Modifier
.weight(1f)
.fillMaxSize() .fillMaxSize()
.padding( .padding(
end = it.calculateEndPadding( end = it.calculateEndPadding(layoutDirection),
layoutDirection
),
bottom = it.calculateBottomPadding(), bottom = it.calculateBottomPadding(),
start = if (tabletUI) { start = it.calculateStartPadding(layoutDirection)
80.dp + it.calculateStartPadding(
layoutDirection
)
} else {
it.calculateStartPadding(
layoutDirection
)
},
) )
) { ) {
content() content()
} }
if (tabletUI) {
navigationRail()
}
} }
} }
} }