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") }) } }