Mục lục

Android DatePicker
Ví dụ DatePicker

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

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

Các hướng dẫn lập trình Android

Android DatePicker
Ví dụ DatePicker

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 DatePicker

Android DatePicker là một thành phần giao diện cho phép người dùng lựa chọn ngày tháng (date) và đảm bảo rằng dữ liệu người dùng nhập vào là hợp lệ.

DatePicker có 2 chế độ (mode) với giao diện khác nhau.

android:datePickerMode="calendar" (Default)
android:datePickerMode="spinner"

DatePickerDialog cho phép người dùng chọn một ngày tháng (date) hợp lệ và ẩn đi sau khi lựa chọn xong, nó giúp bạn tiết kiệm không gian của ứng dụng hơn so với việc sử dụng DatePicker.

Android DatePickerDialog

Android TimePicker

Android TimePickerDialog

Android Chronometer

Android TextClock

android:datePickerMode="calendar"


<DatePicker
    android:id="@+id/datePicker"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:datePickerMode="calendar"  />

Portrait Screen

Landscape Screen

android:datePickerMode="spinner"

Trong chế độ spinner, DatePicker bao gồm 2 phần, bên trái là một khối gồm 3 Spinner cho phép người dùng lựa chọn tháng, ngày, năm. Và bên phải là một CalendarView đơn giản hơn so với chính nó khi ở trong chế độ calendar.


<DatePicker
    android:id="@+id/datePicker"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginTop="16dp"
    android:datePickerMode="spinner" />

DatePicker [spinner mode] default.

Bạn có thể sử dụng android:calendarViewShown="false" để ẩn thành phần CalendarView bên phải.

[android:calendarViewShown="false"]


<DatePicker
    android:id="@+id/datePicker"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:calendarViewShown="false"
    android:datePickerMode="spinner" />

[android:calendarViewShown="false"]

Hoặc có thể sử dụng android:spinnersShown="false" để ẩn khối (chứa 3 Spinner) bên trái.

[android:spinnersShown="false"]


<DatePicker
    android:id="@+id/datePicker"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginTop="16dp"
    android:datePickerMode="spinner"
    android:spinnersShown="false" />

[android:spinnersShown="false"]

Android DatePicker Javadoc:

https://developer.android.com/reference/android/widget/DatePicker

2- Ví dụ DatePicker

Xem trước ví dụ:

Trên Android Studio tạo mới một project:

File > New > New Project > Empty Activity
- Name: DatePickerExample
- Package name: org.o7planning.datepickerexample
- Language: Java

DatePicker không có sẵn trên Palette của cửa sổ thiết kế, vì vậy bạn cần sử dụng mã XML để thêm nó vào giao diện sau đó có thể điều chỉnh vị trí và các thuộc tính của nó một cách trực quan.

DatePicker (Calendar Mode)


<DatePicker
    android:id="@+id/datePicker"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:datePickerMode="calendar"  />

Điều chỉnh vị trí các thành phần trên giao diện:

Sét đặt ID, Text cho các thành phần:

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">

    <DatePicker
        android:id="@+id/datePicker"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="8dp"
        android:datePickerMode="calendar"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <LinearLayout
        android:id="@+id/linearLayout"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="8dp"
        android:orientation="horizontal"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/datePicker">

        <EditText
            android:id="@+id/editText_date"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:ems="10"
            android:hint="dd-MM-yyyy"
            android:inputType="date" />

        <Button
            android:id="@+id/button_date"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="Get Date" />
    </LinearLayout>

</androidx.constraintlayout.widget.ConstraintLayout>

MainActivity.java


package org.o7planning.datepickerexample;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.widget.Button;
import android.widget.DatePicker;
import android.widget.EditText;
import android.widget.Toast;

import java.util.Calendar;

public class MainActivity extends AppCompatActivity {

    private DatePicker datePicker;
    private EditText editTextDate;
    private Button buttonDate;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        this.editTextDate = (EditText) this.findViewById(R.id.editText_date);
        this.buttonDate = (Button) this.findViewById(R.id.button_date);
        this.datePicker = (DatePicker) this.findViewById(R.id.datePicker);

        Calendar calendar = Calendar.getInstance();
        calendar.setTimeInMillis(System.currentTimeMillis());
        int year = calendar.get(Calendar.YEAR);
        int month  = calendar.get(Calendar.MONTH);
        int day = calendar.get(Calendar.DAY_OF_MONTH);

        this.datePicker.init( year, month , day , new DatePicker.OnDateChangedListener() {
            @Override
            public void onDateChanged(DatePicker datePicker, int year, int month, int dayOfMonth) {
                datePickerChange(  datePicker,   year,   month,   dayOfMonth);
            }
        });

        this.buttonDate.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                showDate();
            }
        });
    }

    private void datePickerChange(DatePicker datePicker, int year, int month, int dayOfMonth) {
        Log.d("Date", "Year=" + year + " Month=" + (month + 1) + " day=" + dayOfMonth);
        this.editTextDate.setText(dayOfMonth +"-" + (month + 1) + "-" + year);
    }

    private void showDate()  {
        int year = this.datePicker.getYear();
        int month = this.datePicker.getMonth(); // 0 - 11
        int day = this.datePicker.getDayOfMonth();

        Toast.makeText(this, "Date: " + day+"-"+ (month + 1) +"-"+ year, Toast.LENGTH_LONG).show();
    }
}

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

Các hướng dẫn lập trình Android