Hướng dẫn sử dụng Android TimePicker
Xem thêm các chuyên mục:
Android TimePicker là một thành phần cho phép người dùng chọn một thời gian (time) bao gồm giờ và phút.
TimePicker có 2 chế độ với giao diện khác nhau:
- Clock
- Spinner
Clock Mode
Chế độ Clock (Clock mode) là mặc định của TimePicker, tại chế độ này người dùng có thể lựa chọn thời gian một cách trực quan giống như họ đang điều chỉnh thời gian cho một chiếc đồng hồ (Clock). Ngoài ra người dùng cũng có một lựa chọn khác đó là sử dụng bàn phím để nhập giá trị cho giờ và phút.
TimePicker (Clock Mode)
<TimePicker
android:id="@+id/timePicker"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:timePickerMode="clock" />
TimePicker timePicker = (TimePicker) this.findViewById(R.id.timePicker); timePicker.setIs24HourView(true); // 24H Mode.
Spinner Mode
Trong chế độ Spinner (Spinner mode), một TimePicker bao gồm 2 hoặc 3 Spinner. Trong đó Spinner đầu tiên cho phép người dùng lựa chọn giờ, Spinner thứ 2 cho phép lựa chọn phút, và Spinner thứ 3 để lựa chọn AM hoặc PM.
TimePicker trong chế độ Spinner & AM_PM bao gồm 3 Spinner, người dùng lựa chọn giờ trong Spinner đầu tiên với các giá trị từ 1 đến 12. Chọn phút trong Spinner thứ hai với các giá trị từ 0 đến 59, và chọn AM/PM tại spinner thứ ba.
TimePicker (Spinner Mode)
<TimePicker
android:id="@+id/timePicker"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:timePickerMode="spinner" />
TimePicker trong chế độ Spinner & 24H bao gồm 2 Spinner, người dùng lựa chọn giờ trong Spinner đầu tiên với các giá trị từ 0 đến 23, và phút trong Spinner thứ hai với giá trị từ 0 đến 59.
TimePicker timePicker = (TimePicker) this.findViewById(R.id.timePicker); timePicker.setIs24HourView(true); // 24H Mode.
Xem trước ví dụ:
Trên Android Studio tạo mới một project:
- File > New > New Project > Empty Activity
- Name: TimePickerExample
- Package name: org.o7planning.timepickerexample
- Language: Java
Giao diện của ứng dụng:
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<TimePicker
android:id="@+id/timePicker"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:timePickerMode="clock"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="@+id/textView_time"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:text="HH:mm"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/timePicker" />
</androidx.constraintlayout.widget.ConstraintLayout>
MainActivity.java
package org.o7planning.timepickerexample;
import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.TextView;
import android.widget.TimePicker;
public class MainActivity extends AppCompatActivity {
private TimePicker timePicker;
private TextView textViewTime;
// Change this value and run the application again.
private boolean is24HView = true;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
this.textViewTime = (TextView) this.findViewById(R.id.textView_time);
this.timePicker = (TimePicker) this.findViewById(R.id.timePicker);
this.timePicker.setIs24HourView(this.is24HView);
this.timePicker.setOnTimeChangedListener(new TimePicker.OnTimeChangedListener() {
@Override
public void onTimeChanged(TimePicker view, int hourOfDay, int minute) {
textViewTime.setText(hourOfDay + ":" + minute);
}
});
}
}
