Made DatePickerDialog functional.

app/src/main/java/com/sockenklaus/batterytracker/ui/fragments/add_charge/AddChargeFragment.kt

@@ -6,7 +6,6 @@ import androidx.fragment.app.Fragment
 import android.view.LayoutInflater
 import android.view.View
 import android.view.ViewGroup
-import android.widget.ArrayAdapter
 import androidx.compose.foundation.layout.*
 import androidx.compose.foundation.text.KeyboardOptions
 import androidx.compose.material.*
@@ -19,33 +18,30 @@ 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.res.stringResource
 import androidx.compose.ui.text.TextRange
 import androidx.compose.ui.text.input.KeyboardType
 import androidx.compose.ui.text.input.TextFieldValue
 import androidx.compose.ui.unit.dp
-import androidx.constraintlayout.compose.ConstraintLayout
-import androidx.constraintlayout.compose.Dimension
 import com.google.android.material.datepicker.MaterialDatePicker
 import com.sockenklaus.batterytracker.R
 import com.sockenklaus.batterytracker.databinding.FragmentAddChargeBinding
 import com.sockenklaus.batterytracker.ui.theme.BatteryTrackerTheme
 import com.sockenklaus.batterytracker.util.validateDecimal
+import java.time.Instant
 import java.time.LocalDate
+import java.time.ZoneId
+import java.time.ZonedDateTime
 import java.time.format.DateTimeFormatter
 import java.time.format.FormatStyle
 import java.util.*
 
 class AddChargeFragment : Fragment() {
 
-    companion object {
-        fun newInstance() = AddChargeFragment()
-    }
     private var _binding: FragmentAddChargeBinding? = null
-
     private lateinit var viewModel: AddChargeViewModel
-
     private val binding get() = _binding!!
 
     @OptIn(ExperimentalMaterialApi::class)
@@ -64,26 +60,28 @@ class AddChargeFragment : Fragment() {
 
         binding.root.setContent{
             BatteryTrackerTheme {
-                ConstraintLayout {
+                val outerPadding = 24.dp
-                    val (textBatteryId, ddTextField, dd, btnDate, textCharge, fab) = createRefs()
+                val innerPadding = 16.dp
-                    val outerMargin = 24.dp
-                    val innerMargin = 16.dp
 
-                    var selectedBatteryId by remember { mutableStateOf(TextFieldValue(""))}
+                var selectedBatteryId by remember { mutableStateOf(TextFieldValue(""))}
-                    var date by remember { mutableStateOf(LocalDate.now())}
+                var date by remember { mutableStateOf(ZonedDateTime.now())}
-                    var charge by remember { mutableStateOf("") }
+                var charge by remember { mutableStateOf("") }
-                    var bIdExpanded by remember { mutableStateOf(false)}
+                var bIdExpanded by remember { mutableStateOf(false)}
 
+                val datePicker = MaterialDatePicker.Builder.datePicker()
+                    .setTitleText("Select date")
+                    .setSelection( date.toInstant().toEpochMilli())
+                    .build()
+                datePicker.addOnPositiveButtonClickListener {
+                    date = ZonedDateTime.ofInstant(Instant.ofEpochMilli(it), ZoneId.systemDefault())
+                }
+
+                Column(
+                    Modifier.padding(outerPadding)
+                ) {
                     ExposedDropdownMenuBox(
                         expanded = bIdExpanded,
-                        onExpandedChange = { bIdExpanded = !bIdExpanded},
+                        onExpandedChange = { bIdExpanded = !bIdExpanded}
-                        modifier = Modifier
-                            .constrainAs(textBatteryId) {
-                                top.linkTo(parent.top, margin = outerMargin)
-                                start.linkTo(parent.start, margin = outerMargin)
-                                end.linkTo(parent.end, margin = outerMargin)
-                                width = Dimension.fillToConstraints
-                            }
                     ) {
                         OutlinedTextField(
                             value = selectedBatteryId,
@@ -94,21 +92,14 @@ class AddChargeFragment : Fragment() {
                                 ExposedDropdownMenuDefaults.TrailingIcon(expanded = bIdExpanded)
                             },
                             colors = ExposedDropdownMenuDefaults.outlinedTextFieldColors(),
-                            modifier = Modifier
+                            modifier = Modifier.fillMaxWidth()
-                                .fillMaxWidth()
-                                .constrainAs(ddTextField){
-                                    top.linkTo(parent.top)
-                                }
                         )
                         val filteringOptions = items.filter { it.contains(selectedBatteryId.text, ignoreCase = true)}
-                        if(filteringOptions.size > 1 && !selectedBatteryId.text.isNullOrBlank()) bIdExpanded = true
+                        if(filteringOptions.size > 1 && selectedBatteryId.text.isNotBlank()) bIdExpanded = true
                         if(filteringOptions.isNotEmpty()) {
                             ExposedDropdownMenu(
                                 expanded = bIdExpanded,
-                                onDismissRequest = { bIdExpanded = false },
+                                onDismissRequest = { bIdExpanded = false }
-                                modifier = Modifier.constrainAs(dd){
-                                    top.linkTo(ddTextField.bottom)
-                                }
                             ) {
                                 for (filteringOption in filteringOptions) {
                                     DropdownMenuItem(
@@ -126,16 +117,25 @@ class AddChargeFragment : Fragment() {
                             }
                         }
                     }
-                    TextButton(
-                        onClick = { openDatePicker() },
-                        modifier = Modifier
-                            .constrainAs(btnDate){
-                                top.linkTo(textCharge.bottom, innerMargin)
-                                start.linkTo(parent.start, outerMargin)
-                                end.linkTo(parent.end, outerMargin)
-                                width = Dimension.fillToConstraints
-                            }
 
+                    Spacer(Modifier.size(innerPadding))
+
+                    OutlinedTextField(
+                        value = charge,
+                        onValueChange = { charge = validateDecimal(it, charge) },
+                        leadingIcon = { Icon(Icons.Default.BatteryChargingFull, "Icon Battery Charging Full") },
+                        keyboardOptions = KeyboardOptions(keyboardType = KeyboardType.Decimal),
+                        label = { Text(stringResource(R.string.hint_charge)) },
+                        modifier = Modifier.fillMaxWidth()
+                    )
+
+                    Spacer(Modifier.size(innerPadding))
+
+                    TextButton(
+                        onClick = {
+                            datePicker.show(parentFragmentManager, "tag")
+                        },
+                        modifier = Modifier.fillMaxWidth()
                     ){
                         Icon(
                             Icons.Default.EditCalendar,
@@ -146,29 +146,14 @@ class AddChargeFragment : Fragment() {
                         Text("Date: ${date.format(dateFormat)}")
                     }
 
-                    OutlinedTextField(
+                    Spacer(Modifier.size(outerPadding))
-                        value = charge,
-                        onValueChange = { charge = validateDecimal(it, charge) },
-                        leadingIcon = { Icon(Icons.Default.BatteryChargingFull, "Icon Battery Charging Full") },
-                        keyboardOptions = KeyboardOptions(keyboardType = KeyboardType.Decimal),
-                        label = { Text(stringResource(R.string.hint_charge)) },
-                        modifier = Modifier
-                            .constrainAs(textCharge){
-                                top.linkTo(textBatteryId.bottom, innerMargin)
-                                start.linkTo(parent.start, outerMargin)
-                                end.linkTo(parent.end, outerMargin)
-                                width = Dimension.fillToConstraints
-                            }
-                    )
 
                     ExtendedFloatingActionButton(
                         text = { Text(stringResource(R.string.button_save_charge)) },
                         onClick = { /*TODO*/ },
                         icon = { Icon(Icons.Default.Save, "Icon Save") },
-                        modifier = Modifier.constrainAs(fab){
+                        modifier = Modifier.align(Alignment.End)
-                            top.linkTo(btnDate.bottom, 24.dp)
+
-                            end.linkTo(parent.end, outerMargin)
-                        }
                     )
                 }
             }
@@ -190,6 +175,7 @@ class AddChargeFragment : Fragment() {
             .build()
 
         datePicker.show(parentFragmentManager, "test")
+
     }
 
 }

app/src/main/res/values/strings.xml

@@ -20,7 +20,7 @@
     <string name="button_save_charge">Save Charge</string>
     <string name="date">Date</string>
     <string name="charge">Charge</string>
-    <string name="hint_charge">Enter Charge, decimal</string>
+    <string name="hint_charge">Enter Charge in Ah</string>
     <string name="select_battery_id">Select Battery ID</string>
     <string name="hint_enter_battery_id">Enter Battery ID</string>
     <string name="hint_enter_declared_capacity">Enter declared capacity</string>