UI angepasst

Sevynidd · Sep 14, 2023 · d590660 · d590660
1 parent 4c76175
commit d590660
Show file tree

Hide file tree

Showing 8 changed files with 62 additions and 16 deletions.
diff --git a/.gitignore b/.gitignore
@@ -1,6 +1,7 @@
 *.iml
 .gradle
 /local.properties
+/.idea
 /.idea/caches
 /.idea/libraries
 /.idea/modules.xml

diff --git a/app/build.gradle.kts b/app/build.gradle.kts
@@ -41,7 +41,7 @@ android {
         compose = true
     }
     composeOptions {
-        kotlinCompilerExtensionVersion = "1.4.3"
+        kotlinCompilerExtensionVersion = "1.5.3"
     }
     packaging {
         resources {

diff --git a/app/src/main/java/agb/loehne/blutspende_app/ui/MainActivity.kt b/app/src/main/java/agb/loehne/blutspende_app/ui/MainActivity.kt
@@ -11,7 +11,7 @@ import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.WindowInsets
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.padding
-import androidx.compose.foundation.layout.safeDrawingPadding
+import androidx.compose.foundation.layout.safeContentPadding
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.ArrowBack
 import androidx.compose.material3.ExperimentalMaterial3Api
@@ -69,7 +69,7 @@ fun NavigationBar() {
     )
 
     Scaffold(
-        modifier = Modifier.safeDrawingPadding(),
+        modifier = Modifier.safeContentPadding(),
         contentWindowInsets = WindowInsets(30.dp, 20.dp, 30.dp, 0.dp),
         topBar = {
             TopBar(navController)
@@ -93,6 +93,7 @@ fun NavigationBar() {
 @Composable
 fun TopBar(navController: NavHostController) {
     val currentRoute = currentRoute(navController = navController)
+
     TopAppBar(
         title = {},
         navigationIcon = {
@@ -118,7 +119,7 @@ fun TopBar(navController: NavHostController) {
             }) {
                 Icon(
                     painter = painterResource(id = R.drawable.settings),
-                    "Einstellungen"
+                    contentDescription = "Einstellungen"
                 )
             }
         }
@@ -130,7 +131,6 @@ fun BottomBar(
     navController: NavHostController,
     items: List<ScreenDefinition>
 ) {
-
     BubbleNavigationBar {
         val currentRoute = currentRoute(navController = navController)
         items.forEach { navigationItem ->
@@ -148,7 +148,6 @@ fun BottomBar(
             )
         }
     }
-
 }
 
 @Composable

diff --git a/app/src/main/java/agb/loehne/blutspende_app/ui/screens/Blutwerte.kt b/app/src/main/java/agb/loehne/blutspende_app/ui/screens/Blutwerte.kt
@@ -1,14 +1,32 @@
 package agb.loehne.blutspende_app.ui.screens
 
 import agb.loehne.blutspende_app.ui.theme.Blutspende_AppTheme
+import androidx.compose.animation.Crossfade
+import androidx.compose.animation.core.updateTransition
 import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.shape.CornerSize
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.filled.Close
+import androidx.compose.material.icons.filled.Menu
+import androidx.compose.material3.FloatingActionButton
+import androidx.compose.material3.Icon
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Surface
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.rememberUpdatedState
+import androidx.compose.runtime.setValue
+import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.vector.ImageVector
+import androidx.compose.ui.unit.dp
 
 @Composable
 fun Blutwerte() {
@@ -20,6 +38,34 @@ fun Blutwerte() {
                     .background(MaterialTheme.colorScheme.background)
             ) {
                 Text("Blutwerte")
+
+                var menuOpen by remember {
+                    mutableStateOf(false)
+                }
+                val currentMenuIcon: ImageVector by rememberUpdatedState(
+                    if (menuOpen) Icons.Filled.Close else Icons.Filled.Menu
+                )
+
+                Box(Modifier.fillMaxSize()) {
+                    FloatingActionButton(
+                        shape = MaterialTheme.shapes.medium.copy(CornerSize(percent = 50)),
+                        modifier = Modifier
+                            .padding(bottom = 30.dp)
+                            .align(alignment = Alignment.BottomEnd),
+                        onClick = { menuOpen = !menuOpen }
+                    ) {
+                        Crossfade(
+                            targetState = currentMenuIcon,
+                            label = "CrossfadeMenuIcon"
+                        ) { icon ->
+                            Icon(
+                                icon,
+                                contentDescription = null
+                            )
+                        }
+                    }
+                }
+
             }
         }
     }

diff --git a/app/src/main/java/agb/loehne/blutspende_app/ui/screens/Settings.kt b/app/src/main/java/agb/loehne/blutspende_app/ui/screens/Settings.kt
@@ -14,7 +14,7 @@ import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
-import androidx.compose.foundation.layout.safeDrawingPadding
+import androidx.compose.foundation.layout.safeContentPadding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.selection.selectable
 import androidx.compose.material.icons.Icons
@@ -56,7 +56,7 @@ fun Settings(navController: NavHostController) {
             Column(
                 modifier = Modifier
                     .fillMaxSize()
-                    .safeDrawingPadding()
+                    .safeContentPadding()
             ) {
                 Column(
                     modifier = Modifier.fillMaxSize()
@@ -67,7 +67,7 @@ fun Settings(navController: NavHostController) {
 
                     Spacer(modifier = Modifier.size(20.dp))
 
-                    DialogBlutgruppe(navController)
+                    ButtonBlutgruppe(navController)
                 }
             }
         }
@@ -100,7 +100,7 @@ fun DialogDarstellung(
                 painter = painterResource(id = R.drawable.paint_brush),
                 "DarstellungIcon",
                 modifier = Modifier
-                    .size(54.dp)
+                    .size(50.dp)
                     .padding(end = 20.dp)
             )
         }
@@ -183,7 +183,7 @@ fun DialogDarstellung(
 
 @OptIn(ExperimentalMaterial3Api::class)
 @Composable
-fun DialogBlutgruppe(navController: NavHostController) {
+fun ButtonBlutgruppe(navController: NavHostController) {
 
     var showDialogBlutgruppe by remember { mutableStateOf(false) }
     val viewModel: DatastoreViewModel = viewModel()
@@ -201,7 +201,7 @@ fun DialogBlutgruppe(navController: NavHostController) {
                 painter = painterResource(id = R.drawable.blood_drop),
                 "BlutgruppeIcon",
                 modifier = Modifier
-                    .size(54.dp)
+                    .size(56.dp)
                     .padding(end = 20.dp)
             )
         }

diff --git a/app/src/main/java/agb/loehne/blutspende_app/ui/screens/SettingsBlutgruppe.kt b/app/src/main/java/agb/loehne/blutspende_app/ui/screens/SettingsBlutgruppe.kt
@@ -1,13 +1,16 @@
 package agb.loehne.blutspende_app.ui.screens
 
 import agb.loehne.blutspende_app.ui.theme.Blutspende_AppTheme
+import androidx.activity.compose.BackHandler
+import androidx.activity.compose.LocalOnBackPressedDispatcherOwner
 import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Surface
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
+import androidx.compose.runtime.rememberUpdatedState
 import androidx.compose.ui.Modifier
 
 @Composable

diff --git a/app/src/main/java/agb/loehne/blutspende_app/viewmodel/settings/BlutgruppeViewModel.kt b/app/src/main/java/agb/loehne/blutspende_app/viewmodel/settings/BlutgruppeViewModel.kt
@@ -13,9 +13,6 @@ class BlutgruppeViewModel : ViewModel() {
 
     // Getter
     val getShowDialog: Boolean get() = _showDialog.value
-    val getRadioOptions: List<String> get() = _radioOptions
-    val getImageIds: List<Int> get() = _imageIds
-
     // Setter
     fun setShowDialog(value: Boolean) {
         _showDialog.value = value

diff --git a/build.gradle.kts b/build.gradle.kts
@@ -1,5 +1,5 @@
 // Top-level build file where you can add configuration options common to all sub-projects/modules.
 plugins {
     id("com.android.application") version "8.1.1" apply false
-    id("org.jetbrains.kotlin.android") version "1.8.10" apply false
+    id("org.jetbrains.kotlin.android") version "1.9.10" apply false
 }