X

Friday, March 20, 2020

Cara Membuat Date Picker di Android Studio - Coding Rakitan


Ada kalanya ketika membuat sebuah form diperlukan adanya pemilihan tanggal. Jika pada website kita mengenal tag "<input type='date' name='date' />" untuk menampilkan pemilihan tanggal maka beda halnya di Android. Kita bisa menggunakan kelas Date Picker yang telah disediakan.

Berikut Cara Membuat Date Picker di Android Studio.

1. Buat project baru dengan format seperti berikut
  • Activity : Empty Activity
  • Name : CobaDatePicker
  • Package Name : com.codingrakitan.cobadatepicker
  • Language : Java
  • Minimum API Level : API 17 (Android 4.2 Jelly Bean)


2. Buat Kelas baru dengan nama DatePickerFragment.java lalu isi dengan kode seperti berikut :
 
package com.codingrakitan.cobadatepicker;
import android.app.DatePickerDialog;
import android.app.Dialog;
import android.os.Bundle;
import android.widget.DatePicker;

import androidx.fragment.app.DialogFragment;

import java.util.Calendar;

public class DatePickerFragment extends DialogFragment {
    private onDateClickListener onDateClickListener;
    @Override
    public Dialog onCreateDialog(Bundle savedInstanceState){
        final Calendar calendar = Calendar.getInstance();
        int tahun = calendar.get(Calendar.YEAR);
        int bulan = calendar.get(Calendar.MONTH);
        int hari = calendar.get(Calendar.DAY_OF_MONTH);
        return new DatePickerDialog(getActivity(), new DatePickerDialog.OnDateSetListener() {
            @Override
            public void onDateSet(DatePicker datePicker, int i, int i1, int i2) {
                onDateClickListener.onDateSet(datePicker, i, i1, i2);
            }
        }, tahun, bulan, hari);
    }
    public void setOnDateClickListener(onDateClickListener onDateClickListener){
        if (onDateClickListener != null){
            this.onDateClickListener= onDateClickListener;
        }
    }
    public interface onDateClickListener{
        void onDateSet(DatePicker datePicker, int i, int i1, int i2);
    }

}

 
3. Edit MainActivity.java seperti kode di bawah :
 
package com.codingrakitan.cobadatepicker;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.DatePicker;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity {

    private Button button;
    private TextView textView;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        button = findViewById(R.id.button);
        textView = findViewById(R.id.textView);
        button.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                TampilTanggal();
            }
        });
    }
    public void TampilTanggal(){
        DatePickerFragment datePickerFragment = new DatePickerFragment();
        datePickerFragment.show(getSupportFragmentManager(), "data");
        datePickerFragment.setOnDateClickListener(new DatePickerFragment.onDateClickListener() {
            @Override
            public void onDateSet(DatePicker datePicker, int i, int i1, int i2) {
                String tahun = ""+datePicker.getYear();
                String bulan = ""+(datePicker.getMonth()+1);
                String hari = ""+datePicker.getDayOfMonth();
                String text = "Tanggal yang dipilih : "+hari+" - "+bulan+" - "+tahun;
                textView.setText(text);
            }
        });
    }
}

 
4. Edit layout activity_main.xml.
 

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
    android:gravity="center"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="20dp"
        android:text="" />

    <Button
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Klik untuk menampilkan tanggal" />
</LinearLayout>
 


5. Jalankan menggunakan emulator atau device anda.



Keterangan : Ketika tombol di klik akan muncul tampilan Date Picker di layar, tampilan date picker ini berbeda-beda sesuai versi android anda. Pada tampilan di atas menggunakan android versi 9.

Bagikan artikel ke:

Facebook Google+ Twitter

2 comments:

  1. Bank mau nanya kalo mau buat date picker dengan ketentuan yang bisa di pilih tanggal setelah tanggal ini itu gimana ya ? Ex : ini tanggal 16 Januari 2021. Maka yang dapat dipilih setelah 16 Januari 2021.

    ReplyDelete
  2. nice, thank you bre, udh berhasil, gw bikin referensi di tulisan blog gw :
    https://alexander-zulkarnain.blogspot.com/2021/10/date-picker-android-studio.html

    ReplyDelete