From ec6a6e341b56914e4992614cb7ec89b4023b311d Mon Sep 17 00:00:00 2001 From: Xaver Date: Tue, 14 Jan 2025 11:25:11 +0100 Subject: [PATCH 1/2] navigate to add --- .../main/java/at/xaxa/ledger/ui/LedgerApp.kt | 21 ++++++++---- .../main/java/at/xaxa/ledger/ui/LedgerUI.kt | 3 -- .../main/java/at/xaxa/ledger/ui/add/AddUI.kt | 32 +++++++++++++++++++ .../java/at/xaxa/ledger/ui/home/HomeUI.kt | 4 +-- 4 files changed, 48 insertions(+), 12 deletions(-) diff --git a/Ledger/app/src/main/java/at/xaxa/ledger/ui/LedgerApp.kt b/Ledger/app/src/main/java/at/xaxa/ledger/ui/LedgerApp.kt index 5f6964f..db13678 100644 --- a/Ledger/app/src/main/java/at/xaxa/ledger/ui/LedgerApp.kt +++ b/Ledger/app/src/main/java/at/xaxa/ledger/ui/LedgerApp.kt @@ -9,6 +9,7 @@ import androidx.navigation.compose.NavHost import androidx.navigation.compose.composable import androidx.navigation.compose.currentBackStackEntryAsState import androidx.navigation.compose.rememberNavController +import at.xaxa.ledger.ui.add.Add import at.xaxa.ledger.ui.home.Home enum class AppRoutes(val route: String) { @@ -30,16 +31,22 @@ fun LedgerApp(modifier: Modifier = Modifier){ contentAlignment = Alignment.Center ) { composable(AppRoutes.Home.route){ - Home(onCardClick = { - navController.navigate("home") + Home( + onCardClick = { + navController.navigate("edit/$id") + }, + onButtonClick = { + navController.navigate("add") + } + ) + } + + composable(AppRoutes.Add.route) { + Add(onCardClick = { + navController.navigate("add") }) } /* - composable(AppRoutes.Add.route) { - SearchList(onCardClick = { - navController.navigate("add/$it") - }) - } composable( route = AppRoutes.Edit.route, arguments = listOf(navArgument("gameId") { diff --git a/Ledger/app/src/main/java/at/xaxa/ledger/ui/LedgerUI.kt b/Ledger/app/src/main/java/at/xaxa/ledger/ui/LedgerUI.kt index 168e440..a28847a 100644 --- a/Ledger/app/src/main/java/at/xaxa/ledger/ui/LedgerUI.kt +++ b/Ledger/app/src/main/java/at/xaxa/ledger/ui/LedgerUI.kt @@ -1,8 +1,6 @@ package at.xaxa.ledger.ui import androidx.compose.foundation.BorderStroke -import androidx.compose.foundation.background -import androidx.compose.foundation.border import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.Column @@ -13,7 +11,6 @@ import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.requiredHeight -import androidx.compose.foundation.layout.requiredWidth import androidx.compose.foundation.layout.wrapContentHeight import androidx.compose.foundation.layout.wrapContentSize import androidx.compose.foundation.layout.wrapContentWidth diff --git a/Ledger/app/src/main/java/at/xaxa/ledger/ui/add/AddUI.kt b/Ledger/app/src/main/java/at/xaxa/ledger/ui/add/AddUI.kt index bea04de..f10c35e 100644 --- a/Ledger/app/src/main/java/at/xaxa/ledger/ui/add/AddUI.kt +++ b/Ledger/app/src/main/java/at/xaxa/ledger/ui/add/AddUI.kt @@ -1,2 +1,34 @@ package at.xaxa.ledger.ui.add +import androidx.compose.foundation.layout.Column +import androidx.compose.foundation.layout.fillMaxSize +import androidx.compose.foundation.layout.fillMaxWidth +import androidx.compose.foundation.layout.padding +import androidx.compose.material3.OutlinedTextField +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.setValue +import androidx.compose.ui.Modifier +import androidx.compose.ui.unit.dp +import androidx.lifecycle.viewmodel.compose.viewModel +import at.xaxa.ledger.ui.AppViewModelProvider +import at.xaxa.ledger.ui.home.HomeViewModel + +@Composable +fun Add(modifier: Modifier = Modifier, onCardClick: (Int) -> Unit, HomeViewModel : HomeViewModel = viewModel(factory = AppViewModelProvider.Factory)) { + var spending by remember { mutableStateOf("") } + + Column( + modifier = modifier.fillMaxSize() + ) { + OutlinedTextField( + value = spending, + onValueChange = { spending = it }, + label = { Text("Spending") }, + modifier = Modifier.fillMaxWidth().padding(16.dp) + ) + } +} diff --git a/Ledger/app/src/main/java/at/xaxa/ledger/ui/home/HomeUI.kt b/Ledger/app/src/main/java/at/xaxa/ledger/ui/home/HomeUI.kt index fc88644..442832c 100644 --- a/Ledger/app/src/main/java/at/xaxa/ledger/ui/home/HomeUI.kt +++ b/Ledger/app/src/main/java/at/xaxa/ledger/ui/home/HomeUI.kt @@ -22,7 +22,7 @@ import at.xaxa.ledger.ui.HorizontalCard @OptIn(ExperimentalFoundationApi::class) @Composable -fun Home(modifier: Modifier = Modifier, onCardClick: (Int) -> Unit, HomeViewModel : HomeViewModel = viewModel(factory = AppViewModelProvider.Factory)) { +fun Home(modifier: Modifier = Modifier, onCardClick: (Int) -> Unit, onButtonClick: () -> Unit, HomeViewModel : HomeViewModel = viewModel(factory = AppViewModelProvider.Factory)) { val state by HomeViewModel.entryUIState.entry.collectAsState(initial = emptyList()) Column( @@ -58,7 +58,7 @@ fun Home(modifier: Modifier = Modifier, onCardClick: (Int) -> Unit, HomeViewMode .fillMaxWidth(), contentAlignment = Alignment.Center ) { - ButtonSuccess(modifier = Modifier, "Add Transaction", onClick = { println("success") }) + ButtonSuccess(modifier = Modifier, "Add Transaction", onClick = { onButtonClick() }) } } } From 0ac75cb6d24cd1b8b0e274e6f66ecff1af37dd30 Mon Sep 17 00:00:00 2001 From: Xaver Date: Tue, 14 Jan 2025 13:40:38 +0100 Subject: [PATCH 2/2] add ui --- .../main/java/at/xaxa/ledger/ui/LedgerUI.kt | 83 +++++++++++++++++++ .../main/java/at/xaxa/ledger/ui/add/AddUI.kt | 60 +++++++++++++- 2 files changed, 142 insertions(+), 1 deletion(-) diff --git a/Ledger/app/src/main/java/at/xaxa/ledger/ui/LedgerUI.kt b/Ledger/app/src/main/java/at/xaxa/ledger/ui/LedgerUI.kt index a28847a..4a519f0 100644 --- a/Ledger/app/src/main/java/at/xaxa/ledger/ui/LedgerUI.kt +++ b/Ledger/app/src/main/java/at/xaxa/ledger/ui/LedgerUI.kt @@ -1,38 +1,63 @@ package at.xaxa.ledger.ui +import android.icu.text.SimpleDateFormat import androidx.compose.foundation.BorderStroke +import androidx.compose.foundation.gestures.awaitEachGesture +import androidx.compose.foundation.gestures.awaitFirstDown +import androidx.compose.foundation.gestures.waitForUpOrCancellation import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.PaddingValues import androidx.compose.foundation.layout.Row +import androidx.compose.foundation.layout.Spacer import androidx.compose.foundation.layout.fillMaxHeight import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.requiredHeight +import androidx.compose.foundation.layout.width import androidx.compose.foundation.layout.wrapContentHeight import androidx.compose.foundation.layout.wrapContentSize import androidx.compose.foundation.layout.wrapContentWidth import androidx.compose.foundation.shape.RoundedCornerShape +import androidx.compose.material.icons.Icons +import androidx.compose.material.icons.filled.DateRange import androidx.compose.material3.Button import androidx.compose.material3.ButtonDefaults +import androidx.compose.material3.DatePicker +import androidx.compose.material3.DatePickerDialog +import androidx.compose.material3.ExperimentalMaterial3Api +import androidx.compose.material3.Icon import androidx.compose.material3.MaterialTheme +import androidx.compose.material3.OutlinedTextField import androidx.compose.material3.Surface import androidx.compose.material3.Text +import androidx.compose.material3.TextButton +import androidx.compose.material3.TextField +import androidx.compose.material3.rememberDatePickerState import androidx.compose.runtime.Composable +import androidx.compose.runtime.getValue +import androidx.compose.runtime.mutableStateOf +import androidx.compose.runtime.remember +import androidx.compose.runtime.setValue import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.draw.clip import androidx.compose.ui.draw.shadow import androidx.compose.ui.graphics.Color +import androidx.compose.ui.input.pointer.PointerEventPass +import androidx.compose.ui.input.pointer.pointerInput import androidx.compose.ui.text.TextStyle import androidx.compose.ui.text.font.FontWeight +import androidx.compose.ui.text.intl.Locale import androidx.compose.ui.text.style.TextAlign import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.em import androidx.compose.ui.unit.sp +import java.time.LocalDate +import java.util.Date // region Header Card @Composable @@ -246,4 +271,62 @@ private fun CustomButton(modifier: Modifier = Modifier, text: String, onClick: ( } } } +} + + + + + + +@Composable +fun DatePicker( + onDateSelected: (LocalDate) -> Unit, + onDismiss: () -> Unit +) { + var selectedDate by remember { mutableStateOf(LocalDate.now()) } + + Column( + modifier = Modifier + .fillMaxWidth() + ) { + DatePickerDialog( + onDateSelected = { date -> + selectedDate = date + }, + onDismiss = onDismiss + ) + Row( + modifier = Modifier + .fillMaxWidth() + .padding(top = 16.dp), + horizontalArrangement = Arrangement.End + ) { + TextButton(onClick = onDismiss) { + Text("Cancel") + } + Spacer(modifier = Modifier.width(8.dp)) + TextButton(onClick = { onDateSelected(selectedDate) }) { + Text("OK") + } + } + } +} + +@Composable +fun DatePickerDialog( + onDateSelected: (LocalDate) -> Unit, + onDismiss: () -> Unit +) { + // Implement your date picker logic here + // For simplicity, we'll just use a simple date picker + var selectedDate by remember { mutableStateOf(LocalDate.now()) } + + // You can use a library like `androidx.compose.material3.DatePicker` or a custom implementation + // For now, we'll just use a simple text input for demonstration purposes + OutlinedTextField( + value = selectedDate.toString(), + onValueChange = { }, + label = { Text("Date") }, + modifier = Modifier.fillMaxWidth() + ) } \ No newline at end of file diff --git a/Ledger/app/src/main/java/at/xaxa/ledger/ui/add/AddUI.kt b/Ledger/app/src/main/java/at/xaxa/ledger/ui/add/AddUI.kt index f10c35e..7cca35f 100644 --- a/Ledger/app/src/main/java/at/xaxa/ledger/ui/add/AddUI.kt +++ b/Ledger/app/src/main/java/at/xaxa/ledger/ui/add/AddUI.kt @@ -4,8 +4,13 @@ import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.padding +import androidx.compose.material3.DropdownMenuItem +import androidx.compose.material3.ExperimentalMaterial3Api +import androidx.compose.material3.ExposedDropdownMenuBox +import androidx.compose.material3.ExposedDropdownMenuDefaults import androidx.compose.material3.OutlinedTextField import androidx.compose.material3.Text +import androidx.compose.material3.TextField import androidx.compose.runtime.Composable import androidx.compose.runtime.getValue import androidx.compose.runtime.mutableStateOf @@ -15,20 +20,73 @@ import androidx.compose.ui.Modifier import androidx.compose.ui.unit.dp import androidx.lifecycle.viewmodel.compose.viewModel import at.xaxa.ledger.ui.AppViewModelProvider +import at.xaxa.ledger.ui.DatePicker import at.xaxa.ledger.ui.home.HomeViewModel +@OptIn(ExperimentalMaterial3Api::class) @Composable fun Add(modifier: Modifier = Modifier, onCardClick: (Int) -> Unit, HomeViewModel : HomeViewModel = viewModel(factory = AppViewModelProvider.Factory)) { var spending by remember { mutableStateOf("") } + var expanded by remember { mutableStateOf(false) } + var selectedItem by remember { mutableStateOf("") } + val categories = listOf("Option 1", "Option 2", "Option 3") + + Column( modifier = modifier.fillMaxSize() + .padding(16.dp) ) { OutlinedTextField( value = spending, onValueChange = { spending = it }, label = { Text("Spending") }, - modifier = Modifier.fillMaxWidth().padding(16.dp) + modifier = Modifier + .fillMaxWidth() ) + OutlinedTextField( + value = spending, + onValueChange = { spending = it }, + label = { Text("Spending") }, + modifier = Modifier + .fillMaxWidth() + ) + + ExposedDropdownMenuBox( + expanded = expanded, + onExpandedChange = { expanded = it } + ) { + // TextField to display the selected item and trigger the dropdown + OutlinedTextField( + value = selectedItem, + onValueChange = {}, + label = { Text("Category") }, + readOnly = true, + trailingIcon = { + ExposedDropdownMenuDefaults.TrailingIcon(expanded = expanded) + }, + modifier = Modifier + .menuAnchor() + .fillMaxWidth() + ) + + // Dropdown menu + ExposedDropdownMenu( + expanded = expanded, + onDismissRequest = { expanded = false } + ) { + categories.forEach { item -> + DropdownMenuItem( + text = { Text(text = item) }, + onClick = { + selectedItem = item + expanded = false + } + ) + } + } + } + + DatePicker(onDateSelected = { date -> println("Selected date in milliseconds: $date") }, onDismiss = { println("Dismissed") }) } }