代码之家 › 专栏 › 技术社区 › Bob Rasner

如何在jetpack compose中使用时间选择器显示AM或PM?

android-timepicker java-time android-jetpack-compose kotlin android

Bob Rasner · 技术社区 · 1 年前

我在jetpack compose中开发了一个简单的时间选择器应用程序。它由一个可组合的文本和一个时间选择器组成。文本显示所选时间。但是,它不会显示是AM还是PM。

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

下面是代码:

// 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的偏好 is24Hour ,但是它是一个布尔值,当添加到字符串中时会导致崩溃。

1 回复 | 直到 1 年前

tyg 1 年前

首先,您仍然在使用10年前过时的Java旧日期api。如果您想坚持使用Java API而不是Kotlin包装器( kotlinx.datetime.* ),使用位于 java.time.* 包装:

// 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))

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

在上面的代码中,我决定根据TimePickerState的初始化方式在这两种模式之间切换( timePickerState.is24hour ). 在你的代码中,总是 false ,所以你永远不会看到0-23小时的范围。但如果你不建一套公寓 错误的 或 true 对于 is24hour 并使其依赖于变量,你可以让用户选择他们喜欢的变量。然后,它将影响TimePicker 和格式化时间。