主页 / coding / 问题 / 78828376
Accepted
Bob Rasner
Asked: 2024-08-03 17:48:34 +0800 CST

如何使用 Jetpack Compose 中的时间选择器显示上午或下午？

  • 772

我在 jetpack compose 中开发了一个简单的时间选择器应用。它由一个文本可组合项和一个时间选择器组成。文本显示所选时间。但是它不显示是上午还是下午。

以下是该应用程序的细分。它由一个包含文本可组合项和时间选择器的列组成。有三个变量。一个使用内置日历保存当前时间，一个保存时间选择器状态，最后一个从时间选择器格式化时间。

下面是代码：

// App Layout
Column(
    modifier = Modifier.fillMaxSize(),
    horizontalAlignment = Alignment.CenterHorizontally,
    verticalArrangement = Arrangement.Center,
) {
    // Variable That Stores The Current Time
    val currentTime = Calendar.getInstance()

    // Variable That Stores Time Picker State
    val timePickerState =
        rememberTimePickerState(
            initialHour = currentTime[Calendar.HOUR_OF_DAY],
            initialMinute = currentTime[Calendar.MINUTE],
            is24Hour = false,
        )

    // Variable That Stores The Formatted Time
    val formattedTime =
        "%02d:%02d".format(
            timePickerState.hour,
            timePickerState.minute,
        )

    // Text That Displays The Selected Time
    Text(text = formattedTime)

    // Time Picker
    TimePicker(
        state = timePickerState,
    )
}

如上所述，我无法弄清楚如何将 AM 或 PM 添加到文本可组合中，甚至无法保存用户对 AM 或 PM 的偏好。timePickerState 有一个名为 的参数is24Hour，但它是一个布尔值，当添加到字符串时会导致崩溃。

1 个回答

  1. Best Answer

    首先，您仍在使用 10 年前就已过时的 Java 旧日期 API。如果您想坚持使用 Java API 而不是 Kotlin 包装器 ( kotlinx.datetime.*)，请使用位于以下java.time.*包中的 Java 8 中的 Time API：

    // Variable That Stores The Current Time
val currentTime = LocalTime.now()

// Variable That Stores Time Picker State
val timePickerState =
    rememberTimePickerState(
        initialHour = currentTime.hour,
        initialMinute = currentTime.minute,
        is24Hour = false,
    )

    现在，有了这些，TimePicker 就可以使用 在 24 小时选择模式和 AM/PM 选择模式之间切换is24Hour。结果不会受此影响，但这只是为了方便用户。结果timePickerState.hour将始终在 0 到 23 的范围内，因此您可以轻松使用它，例如进行时间算术等。

    如果您想在末尾显示带有 AM/PM 标记的时间，这仅仅是一个格式问题。这个问题可以轻松解决，因为我们现在已经在使用 Java Time API：

    // Variable That Stores The Formatted Time
val localTime = LocalTime.of(timePickerState.hour, timePickerState.minute)
val pattern = if (timePickerState.is24hour) "HH:mm" else "hh:mm a"
val formattedTime = localTime.format(DateTimeFormatter.ofPattern(pattern))

    首先LocalTime根据 TimePicker 的状态创建一个。然后根据 对其进行格式化DateTimeFormatter。pattern现在，这个模式是重要的部分："hh:mm a"将时间格式化为 AM/PM 格式，小时范围为 1-12，末尾带有 AM/PM 标记。"HH:mm"另一方面，将其格式化为简单时间，小时范围为 0-23。

    在上面的代码中，我决定根据 TimePickerState 的初始化方式（timePickerState.is24hour）在这两种模式之间切换。在您的代码中，它始终是false，因此您永远不会看到 0-23 小时范围。但是，如果您不设置固定的或false，并使其依赖于变量，您可以让用户选择他们喜欢哪一个。然后它将影响 TimePicker和格式化的时间。trueis24hour

    • 0

相关问题