Implement first GUI draft

app/src/main/java/eu/pozimski/alarmclockconfigurator/MainActivity.kt

@@ -1,34 +1,78 @@
 package eu.pozimski.alarmclockconfigurator
 
+import android.app.TimePickerDialog
 import android.os.Bundle
 import androidx.activity.ComponentActivity
 import androidx.activity.compose.setContent
-import androidx.compose.foundation.layout.fillMaxSize
-import androidx.compose.material.MaterialTheme
-import androidx.compose.material.Surface
-import androidx.compose.material.Text
-import androidx.compose.runtime.Composable
+import androidx.compose.foundation.clickable
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Row
+import androidx.compose.material.*
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.filled.DateRange
+import androidx.compose.material.icons.filled.Menu
+import androidx.compose.material.icons.filled.Notifications
+import androidx.compose.material.icons.filled.Settings
+import androidx.compose.runtime.*
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.tooling.preview.Preview
+import androidx.navigation.NavController
+import androidx.navigation.compose.NavHost
+import androidx.navigation.compose.composable
+import androidx.navigation.compose.rememberNavController
 import eu.pozimski.alarmclockconfigurator.ui.theme.AlarmClockConfiguratorTheme
+import io.github.boguszpawlowski.composecalendar.SelectableCalendar
 
 class MainActivity : ComponentActivity() {
     override fun onCreate(savedInstanceState: Bundle?) {
         super.onCreate(savedInstanceState)
         setContent {
             AlarmClockConfiguratorTheme {
-                // A surface container using the 'background' color from the theme
                 Surface(
-                    modifier = Modifier.fillMaxSize(),
                     color = MaterialTheme.colors.background
                 ) {
-                    Greeting("Android")
+                    val navController = rememberNavController()
+                    Column {
+                        Row {
+                            NavigationBar(navController = navController)
+                        }
+                        Row {
+
+                            NavHost(navController = navController, startDestination = "calendar") {
+                                composable("calendar") { SelectableCalendar() }
+                                composable("weekdays") {
+                                    Column {
+                                        WeekDayElement("Monday")
+                                        WeekDayElement("Tuesday")
+                                        WeekDayElement("Wednesday")
+                                        WeekDayElement("Thursday")
+                                        WeekDayElement("Friday")
+                                        WeekDayElement("Saturday")
+                                        WeekDayElement("Sunday")
+                                    }
+                                }
+                                composable("settings") { Settings() }
+                            }
+                        }
+                    }
+
                 }
             }
         }
     }
 }
 
+@Composable
+fun Settings() {
+    Column() {
+        Row() {
+            Text(text = "URL: ")
+            TextField(value = "", onValueChange = {})
+        }
+    }
+}
+
 @Composable
 fun Greeting(name: String) {
     Text(text = "Hello $name!")
@@ -38,6 +82,79 @@ fun Greeting(name: String) {
 @Composable
 fun DefaultPreview() {
     AlarmClockConfiguratorTheme {
-        Greeting("Android")
+        Greeting("Helmut")
+    }
+}
+
+@Composable
+fun WeekDayElement(weekDay: String) {
+    Column {
+        Row {
+            val time = remember { mutableStateOf("00:00") }
+            val context = LocalContext.current
+
+            val timePickerDialog = TimePickerDialog(
+                context,
+                { _, mHour: Int, mMinute: Int ->
+                    time.value = "$mHour:$mMinute"
+                }, 0, 0, true
+            )
+            Text(text = weekDay)
+            Text(text = time.value, modifier = Modifier.clickable { timePickerDialog.show() })
+        }
+    }
+}
+
+@Composable
+fun NavigationBar(navController: NavController) {
+    var expanded by remember {
+        mutableStateOf(false)
+    }
+    TopAppBar(title = { Text(text = "Hello") }, navigationIcon = {
+        IconButton(onClick = {
+            expanded = true
+        }) {
+            Icon(
+                imageVector = Icons.Filled.Menu,
+                contentDescription = "Navigation icon"
+            )
+        }
+    })
+    DropdownMenu(
+        expanded = expanded,
+        onDismissRequest = {
+            expanded = false
+        }
+    ) {
+        DropdownMenuItem(
+            onClick = {
+                expanded = false
+                navController.navigate("calendar")
+            },
+            enabled = true
+        ) {
+            Icon(imageVector = Icons.Filled.DateRange, contentDescription = "Calendar")
+            Text(text = "Calendar")
+        }
+        DropdownMenuItem(
+            onClick = {
+                expanded = false
+                navController.navigate("weekdays")
+            },
+            enabled = true
+        ) {
+            Icon(imageVector = Icons.Filled.Notifications, contentDescription = "Weekdays")
+            Text(text = "Weekdays")
+        }
+        DropdownMenuItem(
+            onClick = {
+                expanded = false
+                navController.navigate("settings")
+            },
+            enabled = true
+        ) {
+            Icon(imageVector = Icons.Filled.Settings, contentDescription = "Settings")
+            Text(text = "Settings")
+        }
     }
 }