如何将Android标准TimePicker自定义为指定样式？

原生TimePickerDialog的样式受系统主题限制，要改成目标样式，可通过以下两种方案实现：

方式一：使用Material Design的TimePickerDialog（推荐） #

如果项目引入了Material Components库，新版MaterialTimePicker支持灵活的样式定制，能轻松实现常见的滚轮式时间选择器样式：

1. 确保依赖已添加（build.gradle中）：

implementation 'com.google.android.material:material:1.9.0'

2. 替换原有代码：

val timePicker = MaterialTimePicker.Builder()
    .setTimeFormat(TimeFormat.CLOCK_24H) // 对应原代码的24小时制设置
    .setHour(hour)
    .setMinute(minute)
    .setTitleText("选择时间")
    .build()

timePicker.addOnPositiveButtonClickListener {
    selectedTime.text = String.format("%d : %d", timePicker.hour, timePicker.minute)
}

selectedTime.setOnClickListener {
    timePicker.show(supportFragmentManager, "TIME_PICKER")
}

3. 如需进一步匹配目标样式，可在styles.xml中自定义主题：

<style name="CustomMaterialTimePicker" parent="Theme.Material3.Dialog.TimePicker">
    <item name="colorPrimary">@color/your_primary_color</item>
    <item name="colorOnSurface">@color/your_text_color</item>
    <!-- 可根据目标样式调整更多属性，比如圆角、背景色等 -->
</style>

再在Builder中指定主题：

.setTheme(R.style.CustomMaterialTimePicker)

方式二：完全自定义布局的Dialog #

如果目标样式和原生组件差异极大，可以自己编写布局文件，封装成自定义Dialog：

1. 创建布局文件custom_time_picker.xml（可根据目标样式调整布局结构）：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    android:padding="16dp"
    android:background="@drawable/dialog_bg">

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="选择时间"
        android:textSize="18sp"
        android:textStyle="bold"
        android:gravity="center"/>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:orientation="horizontal"
        android:layout_marginTop="12dp">

        <NumberPicker
            android:id="@+id/np_hour"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:minValue="0"
            android:maxValue="23"
            android:textSize="20sp"/>

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text=":"
            android:textSize="24sp"
            android:paddingHorizontal="12dp"/>

        <NumberPicker
            android:id="@+id/np_minute"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:minValue="0"
            android:maxValue="59"
            android:textSize="20sp"/>
    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="20dp"
        android:gravity="end">

        <Button
            android:id="@+id/cancel_btn"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="取消"
            android:background="@drawable/btn_cancel_style"/>

        <Button
            android:id="@+id/confirm_btn"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="确认"
            android:layout_marginLeft="12dp"
            android:background="@drawable/btn_confirm_style"/>
    </LinearLayout>
</LinearLayout>

2. 编写自定义Dialog类：

class CustomTimePickerDialog(
    context: Context,
    private val initialHour: Int,
    private val initialMinute: Int,
    private val onTimeSelected: (hour: Int, minute: Int) -> Unit
) : Dialog(context, R.style.CustomDialogTheme) {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.custom_time_picker)

        val npHour = findViewById<NumberPicker>(R.id.np_hour)
        val npMinute = findViewById<NumberPicker>(R.id.np_minute)
        val cancelBtn = findViewById<Button>(R.id.cancel_btn)
        val confirmBtn = findViewById<Button>(R.id.confirm_btn)

        npHour.value = initialHour
        npMinute.value = initialMinute

        cancelBtn.setOnClickListener { dismiss() }
        confirmBtn.setOnClickListener {
            onTimeSelected(npHour.value, npMinute.value)
            dismiss()
        }
    }
}

3. 在Activity中调用：

selectedTime.setOnClickListener {
    CustomTimePickerDialog(this, hour, minute) { selectedHour, selectedMinute ->
        selectedTime.text = String.format("%d : %d", selectedHour, selectedMinute)
    }.show()
}

这种方式可以完全控制布局、配色和交互逻辑，完美匹配目标样式。

内容的提问来源于stack exchange，提问作者Metropol_Tilkisi