I want to display bottom bar with my menu icons and bottom sheet which to start from the end of the bottom bar.
I am also using accompanist navigation library
@Composable
fun AppRouter() {
val navController = rememberNavController()
val bottomSheetNavigator = rememberFullScreenBottomSheetNavigator()
navController.navigatorProvider += bottomSheetNavigator
TriumfTaxiTheme {
ModalBottomSheetLayout(
bottomSheetNavigator = bottomSheetNavigator
) {
Scaffold(
content = {
Box(modifier = Modifier.padding(it)) {
NavHost(
navController = navController,
startDestination = BottomNavScreenDestinations.BottomNavMap.route
) {
composable(route = BottomNavScreenDestinations.BottomNavMap.route) {
Home()
}
}
}
},
bottomBar = {
BuildBottomBar(navController)
}
)
}
}
}
If i add bottomsheet(route="something") it displays bottom sheet but above my bottom bar icons
This is my bottom sheet navigator
@ExperimentalMaterialNavigationApi
@ExperimentalMaterialApi
@Composable
fun rememberFullScreenBottomSheetNavigator(
animationSpec: AnimationSpec<Float> = SwipeableDefaults.AnimationSpec,
skipHalfExpanded: Boolean = true,
): BottomSheetNavigator {
val sheetState = rememberModalBottomSheetState(
ModalBottomSheetValue.Hidden,
animationSpec
)
if (skipHalfExpanded) {
LaunchedEffect(sheetState) {
snapshotFlow { sheetState.isAnimationRunning }
.collect {
with(sheetState) {
val isOpening =
currentValue == ModalBottomSheetValue.Hidden && targetValue == ModalBottomSheetValue.HalfExpanded
val isClosing =
currentValue == ModalBottomSheetValue.Expanded && targetValue == ModalBottomSheetValue.HalfExpanded
when {
isOpening -> animateTo(ModalBottomSheetValue.Expanded)
isClosing -> animateTo(ModalBottomSheetValue.Hidden)
}
}
}
}
}
return remember(sheetState) {
BottomSheetNavigator(sheetState = sheetState)
}
}
I want to know how can I put bottom sheet above my bottom bar and also to customize its peekheight()