@Composable
fun BottomNavBar(navController: NavController) {
val items = listOf(
Screen.Home,
Screen.Settings,
Screen.Logs
)
val haptic = LocalHapticFeedback.current
Surface {
NavigationBar(
containerColor = MaterialTheme.colorScheme.tertiaryContainer.copy(0.1f),
modifier = Modifier.consumeWindowInsets(WindowInsets(0, 0, 0, 0))
) {
val currentRoute = navController.currentBackStackEntryAsState().value?.destination?.route
items.forEach { screen ->
NavigationBarItem(
selected = currentRoute == screen.route,
onClick = {
if (currentRoute != screen.route) {
// Trigger haptic feedback
haptic.performHapticFeedback(HapticFeedbackType.LongPress)
// Navigate to the selected route
navController.navigate(screen.route) {
popUpTo(navController.graph.startDestinationId) {
saveState = true
}
restoreState = true
launchSingleTop = true
}
}
},
label = {
Text(
screen.route.replaceFirstChar {
if (it.isLowerCase()) it.titlecase(
Locale.ROOT
) else it.toString()
},
fontSize = 10.sp, // Set the font size of the label
maxLines = 1, // Set the maximum number of lines for the label
)
},
icon = {
Crossfade(
targetState = currentRoute == screen.route,
animationSpec = tween(600), label = "" // 600ms animation duration
) { isSelected ->
val icon: Painter = when (screen) {
Screen.Home -> {
if (isSelected) {
painterResource(R.drawable.ic_home_filled_2)
} else {
painterResource(R.drawable.ic_home_empty_2)
}
}
Screen.Settings -> {
if (isSelected) {
painterResource(R.drawable.ic_settings_filled_2)
} else {
painterResource(R.drawable.ic_settings_empty_2)
}
}
Screen.Logs -> {
if (isSelected) {
painterResource(R.drawable.ic_log_filled_2)
} else {
painterResource(R.drawable.ic_log_empty_2)
}
}
}
Icon(
painter = icon,
contentDescription = screen.route,
modifier = Modifier.size(18.dp) // Set the size of the icon
)
}
}
)
}
}
}
}