openplanning

Hướng dẫn và ví dụ Android TimePicker

Xem thêm các chuyên mục:

Nhóm phát triển của chúng tôi vừa ra mắt website langlearning.net học tiếng Anh, Nga, Đức, Pháp, Việt, Trung, Hàn, Nhật, ... miễn phí cho tất cả mọi người.
Là một website được viết trên công nghệ web Flutter vì vậy hỗ trợ rất tốt cho người học, kể cả những người học khó tính nhất.
Hiện tại website đang tiếp tục được cập nhập nội dung cho phong phú và đầy đủ hơn. Mong các bạn nghé thăm và ủng hộ website mới của chúng tôi.
Hãy theo dõi chúng tôi trên Fanpage để nhận được thông báo mỗi khi có bài viết mới. Facebook

1- Android TimePicker

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:
  1. Clock
  2. 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.

2- Ví dụ TimePicker

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);
            }
        });
    }

}

Xem thêm các chuyên mục: