1
1
package screens
2
2
3
- import androidx.compose.foundation.layout.RowScope
3
+ import androidx.compose.foundation.layout.Spacer
4
4
import androidx.compose.foundation.layout.fillMaxHeight
5
+ import androidx.compose.foundation.layout.height
5
6
import androidx.compose.foundation.layout.padding
7
+ import androidx.compose.material.icons.Icons
8
+ import androidx.compose.material.icons.outlined.Menu
9
+ import androidx.compose.material3.DrawerValue
6
10
import androidx.compose.material3.ExperimentalMaterial3Api
7
11
import androidx.compose.material3.Icon
8
- import androidx.compose.material3.MaterialTheme
9
- import androidx.compose.material3.NavigationBar
10
- import androidx.compose.material3.NavigationBarItem
11
- import androidx.compose.material3.NavigationBarItemDefaults
12
+ import androidx.compose.material3.IconButton
13
+ import androidx.compose.material3.ModalDrawerSheet
14
+ import androidx.compose.material3.ModalNavigationDrawer
15
+ import androidx.compose.material3.NavigationDrawerItem
12
16
import androidx.compose.material3.Scaffold
13
17
import androidx.compose.material3.Text
14
18
import androidx.compose.material3.TopAppBar
19
+ import androidx.compose.material3.rememberDrawerState
15
20
import androidx.compose.runtime.Composable
16
21
import androidx.compose.runtime.getValue
17
22
import androidx.compose.runtime.mutableStateOf
18
23
import androidx.compose.runtime.remember
24
+ import androidx.compose.runtime.rememberCoroutineScope
19
25
import androidx.compose.runtime.setValue
20
26
import androidx.compose.ui.Modifier
21
- import androidx.compose.ui.graphics.Color
22
- import androidx.compose.ui.graphics.toArgb
23
- import androidx.navigation.NavDestination
27
+ import androidx.compose.ui.unit.dp
24
28
import androidx.navigation.NavDestination.Companion.hierarchy
25
29
import androidx.navigation.NavHostController
26
30
import androidx.navigation.compose.NavHost
27
31
import androidx.navigation.compose.composable
28
32
import androidx.navigation.compose.currentBackStackEntryAsState
29
33
import androidx.navigation.compose.rememberNavController
34
+ import kotlinx.coroutines.launch
30
35
import org.jetbrains.compose.resources.DrawableResource
31
36
import org.jetbrains.compose.resources.painterResource
32
37
import unodocs.composeapp.generated.resources.Res.drawable
@@ -38,84 +43,52 @@ import unodocs.composeapp.generated.resources.ic_house_rules
38
43
import unodocs.composeapp.generated.resources.ic_unique
39
44
import unodocs.composeapp.generated.resources.ic_wild
40
45
41
- sealed class BottomBarScreen (
46
+ sealed class NavigationScreen (
42
47
val title : String ,
43
48
val route : String ,
44
- val icon : DrawableResource
49
+ val icon : DrawableResource ,
45
50
) {
46
- data object Home : BottomBarScreen (" reglas comunes" , " home" , drawable.ic_common)
51
+ data object Home : NavigationScreen (" reglas comunes" , " home" , drawable.ic_common)
47
52
48
- data object Colorblind : BottomBarScreen (" guia para daltonicos" , " colorblind" , drawable.ic_colorblind)
53
+ data object Colorblind :
54
+ NavigationScreen (" guia para daltonicos" , " colorblind" , drawable.ic_colorblind)
49
55
50
- data object ActionCards : BottomBarScreen (" cartas de acciòn" , " action_cards" , drawable.ic_action_cards)
56
+ data object ActionCards :
57
+ NavigationScreen (" cartas de acciòn" , " action_cards" , drawable.ic_action_cards)
51
58
52
- data object WildCards : BottomBarScreen (" comodines" , " wild_cards" , drawable.ic_wild)
59
+ data object WildCards : NavigationScreen (" comodines" , " wild_cards" , drawable.ic_wild)
53
60
54
- data object StyleWildCards : BottomBarScreen (" comodines de estilo" , " style_wild_cards" , drawable.ic_unique)
61
+ data object StyleWildCards :
62
+ NavigationScreen (" comodines de estilo" , " style_wild_cards" , drawable.ic_unique)
55
63
56
- data object HouseRules : BottomBarScreen (" reglas de la casa" , " house_rules" , drawable.ic_house_rules)
64
+ data object HouseRules :
65
+ NavigationScreen (" reglas de la casa" , " house_rules" , drawable.ic_house_rules)
57
66
}
58
67
59
68
@Composable
60
- fun BottomNavGraph (navController : NavHostController , modifier : Modifier ) {
69
+ fun NavGraph (navController : NavHostController , modifier : Modifier ) {
61
70
NavHost (
62
- navController, BottomBarScreen .Home .route,
71
+ navController, NavigationScreen .Home .route,
63
72
modifier = modifier
64
73
) {
65
- composable(BottomBarScreen .Home .route) { CommonRulesScreen () }
66
- composable(BottomBarScreen .Colorblind .route) { ColorblindScreen () }
67
- composable(BottomBarScreen .ActionCards .route) { ActionCardsScreen () }
68
- composable(BottomBarScreen .WildCards .route) { WildCardsScreen () }
69
- composable(BottomBarScreen .StyleWildCards .route) { WildStyleCardsScreen () }
70
- composable(BottomBarScreen .HouseRules .route) { HouseRulesScreen () }
74
+ composable(NavigationScreen .Home .route) { CommonRulesScreen () }
75
+ composable(NavigationScreen .Colorblind .route) { ColorblindScreen () }
76
+ composable(NavigationScreen .ActionCards .route) { ActionCardsScreen () }
77
+ composable(NavigationScreen .WildCards .route) { WildCardsScreen () }
78
+ composable(NavigationScreen .StyleWildCards .route) { WildStyleCardsScreen () }
79
+ composable(NavigationScreen .HouseRules .route) { HouseRulesScreen () }
71
80
}
72
81
}
73
82
74
83
val screens = listOf (
75
- BottomBarScreen .Home ,
76
- BottomBarScreen .Colorblind ,
77
- BottomBarScreen .ActionCards ,
78
- BottomBarScreen .WildCards ,
79
- BottomBarScreen .StyleWildCards ,
80
- BottomBarScreen .HouseRules ,
84
+ NavigationScreen .Home ,
85
+ NavigationScreen .Colorblind ,
86
+ NavigationScreen .ActionCards ,
87
+ NavigationScreen .WildCards ,
88
+ NavigationScreen .StyleWildCards ,
89
+ NavigationScreen .HouseRules ,
81
90
)
82
91
83
- @Composable
84
- fun BottomBar (navController : NavHostController ) {
85
- val navBackStackEntry by navController.currentBackStackEntryAsState()
86
-
87
- val currentDestination = navBackStackEntry?.destination
88
-
89
- NavigationBar {
90
- screens.forEach { screen ->
91
- AddItem (screen, currentDestination, navController)
92
- }
93
- }
94
- }
95
-
96
- @Composable
97
- fun RowScope.AddItem (
98
- screen : BottomBarScreen ,
99
- currentDestination : NavDestination ? ,
100
- navController : NavHostController
101
- ) {
102
- val colors = NavigationBarItemDefaults .colors(
103
- unselectedIconColor = Color (MaterialTheme .colorScheme.onBackground.toArgb()),
104
- selectedIconColor = Color (MaterialTheme .colorScheme.secondary.toArgb())
105
- )
106
-
107
- NavigationBarItem (
108
- icon = { Icon (painterResource(screen.icon), " navigation icon" ) },
109
- selected = currentDestination?.hierarchy?.any { it.route == screen.route } == true ,
110
- colors = colors,
111
- onClick = {
112
- navController.navigate(screen.route) {
113
- launchSingleTop = true
114
- }
115
- }
116
- )
117
- }
118
-
119
92
@OptIn(ExperimentalMaterial3Api ::class )
120
93
@Composable
121
94
fun MainScreen () {
@@ -125,20 +98,58 @@ fun MainScreen() {
125
98
val navBackStackEntry by navController.currentBackStackEntryAsState()
126
99
val currentDestination = navBackStackEntry?.destination
127
100
128
- screens.forEach {screen ->
101
+ screens.forEach { screen ->
129
102
val route = currentDestination?.route
130
- if (route == screen.route) screenTitle = screen.title
103
+ if (route == screen.route) screenTitle = screen.title
131
104
}
132
105
133
- Scaffold (
134
- modifier = Modifier .fillMaxHeight(),
135
- topBar = { TopAppBar (
136
- title = { Text (screenTitle) }
137
- ) },
138
- bottomBar = { BottomBar (navController) }
139
- ) { innerPadding ->
140
- val navStyles = Modifier .padding(innerPadding)
106
+ val drawerState = rememberDrawerState(initialValue = DrawerValue .Closed )
107
+ val scope = rememberCoroutineScope()
108
+
109
+ ModalNavigationDrawer (
110
+ drawerState = drawerState,
111
+ drawerContent = {
112
+ ModalDrawerSheet {
113
+ Spacer (modifier = Modifier .height(16 .dp))
114
+ screens.forEach { screen ->
115
+ NavigationDrawerItem (
116
+ label = { Text (screen.title) },
117
+ selected = currentDestination?.hierarchy?.any { it.route == screen.route } == true ,
118
+ icon = { Icon (painterResource(screen.icon),null ) },
119
+ onClick = {
120
+ navController.navigate(screen.route) {
121
+ launchSingleTop = true
122
+ }
123
+ scope.launch {
124
+ drawerState.close()
125
+ }
126
+ }
127
+ )
128
+ }
129
+ }
130
+ },
131
+ gesturesEnabled = true
132
+ ) {
141
133
142
- BottomNavGraph (navController, navStyles)
134
+ Scaffold (
135
+ modifier = Modifier .fillMaxHeight(),
136
+ topBar = {
137
+ TopAppBar (
138
+ title = { Text (screenTitle) },
139
+ navigationIcon = {
140
+ IconButton (onClick = {
141
+ scope.launch {
142
+ drawerState.apply { if (isClosed) open() else close() }
143
+ }
144
+ }) { Icon (Icons .Outlined .Menu , null ) }
145
+ }
146
+ )
147
+ },
148
+
149
+ ) { innerPadding ->
150
+ val navStyles = Modifier .padding(innerPadding)
151
+
152
+ NavGraph (navController, navStyles)
153
+ }
143
154
}
144
155
}
0 commit comments