在 jetpack compose 中选择日期后，如何设置从下拉文本字段中选择日期？

Question

我想在 Jetpack Compose 中设置从下拉对话框中选择日期。但所选日期不会出现在“选择日期”占位符上。我该怎么做？

package com.example.bettehomes.components.composable

import android.os.Build
import androidx.annotation.RequiresApi
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.ArrowDropDown
import androidx.compose.material3.Icon
import androidx.compose.material3.IconButton
import androidx.compose.material3.Text
import androidx.compose.material3.TextField
import androidx.compose.runtime.Composable
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import java.time.LocalDate

@RequiresApi(Build.VERSION_CODES.O)
@Composable
fun DateDropdownTextField(selectedDate: LocalDate?, onDateSelected: (LocalDate?) -> Unit) {
    val showDialog = remember { mutableStateOf(false) }

    val placeholderText = remember(selectedDate) {
        selectedDate?.toString() ?: "Select Date"
    }

    if (showDialog.value) {
        MyCalendarDialog { newDate ->
            onDateSelected(newDate as LocalDate?)
            showDialog.value = false
        }
    }

    TextField(
        value = selectedDate?.toString() ?: "",
        onValueChange = { /* do nothing to make it read-only */ },
        label = { Text("Select Date") },
        trailingIcon = {
            IconButton(
                onClick = { showDialog.value = true },
            ) {
                Icon(Icons.Filled.ArrowDropDown, contentDescription = "Open calendar")
            }
        },
        readOnly = true,
        placeholder = { Text("Select Date") }
    )
}

Answer 1

您创建了占位符文本，但未在文本字段内使用，

像这样修改文本字段

 TextField(
    value = selectedDate?.toString() ?: "",
    onValueChange = { /* do nothing to make it read-only */ },
    label = { Text("Select Date") },
    trailingIcon = {
        IconButton(
            onClick = { showDialog.value = true },
        ) {
            Icon(Icons.Filled.ArrowDropDown, contentDescription = "Open 
  calendar")
        }
    },
    readOnly = true,
   // YOU FORGET TO UPDATE THE UI HERE BEFORE,
    placeholder = { Text(placeholderText) }
   )

从您的上述问题中，这是我发现的，如果不是答案，请在下面评论， 我无法在评论中澄清问题，因为我的声誉低于 50