Android Date Time picker banyak digunakan dalam aplikasi android. Dalam tutorial ini kita akan belajar penggunaan Picker Tanggal dan Timer Picker Dialog dalam aplikasi android. Komponen ini digunakan untuk memilih tanggal dan waktu dalam antarmuka pengguna disesuaikan. Kami akan menggunakan
DatePickerDialog
dan TimePickerDialog
class dengan Calendar
class dalam kode aplikasi android.Android DatePickerDialog dan TimePickerDialog
Meskipun Date Picker dan Time Picker dapat digunakan sebagai widget independen tetapi mereka menempati lebih banyak ruang pada layar. Oleh karena itu menggunakan mereka dalam sebuah Dialog adalah pilihan yang lebih baik. Untungnya android memberikan gunakan dengan DatePickerDialog dan TimePickerDialog class sendiri.
DatePickerDialog dan TimePickerDialog Class memiliki
onDateSetListener()
dan onTimeSetListener()
metode callback masing-masing. Metode callback ini dipanggil ketika pengguna dilakukan dengan mengisi tanggal dan waktu masing-masing.
Kelas DatePickerDialog terdiri dari konstruktor 5 argumen dengan parameter yang tercantum di bawah.
- Konteks: Hal ini membutuhkan konteks aplikasi
- Fungsi callback:
onDateSet()
dipanggil ketika pengguna menetapkan tanggal dengan parameter berikut: - int years: Ini akan menyimpan tahun dipilih dari dialog
- int monthOfYear: Ini akan menyimpan bulan yang dipilih dari dialog
- int dayOfMonth: Ini akan menyimpan hari yang dipilih dari dialog
- int mTahun: Ini menunjukkan tahun berjalan yang terlihat saat dialog muncul
- int mBulan: Ini menunjukkan bulan berjalan yang terlihat saat dialog muncul
- int mHari: Ini menunjukkan hari ini yang terlihat saat dialog muncul
Class TimePickerDialog terdiri dari konstruktor 5 argumen dengan parameter yang tercantum di bawah.
- Konteks: Hal ini membutuhkan konteks aplikasi
- Fungsi callback:
onTimeSet()
dipanggil ketika pengguna mengatur waktu dengan parameter berikut: - int hourOfDay: Ini akan menyimpan jam yang dipilih saat hari dari dialog
- int minute: Ini akan menyimpan menit yang dipilih saat ini dari dialog
- int mJam: Ini menunjukkan Jam saat ini yang terlihat saat dialog muncul
- int mMenit: Ini menunjukkan menit saat itulah terlihat saat dialog muncul
- boolean false: Jika set ke false itu akan menunjukkan waktu dalam format 24 jam lain tidak
Berikut langkah-langkah sederhana, bagaimana untuk membuat aplikasi Android sendiri menggunakan Time Picker.
Membuat Project Android
1. Pada Android Studio, buatlah project baru.
=> Jika Anda tidak memiliki sebuah project, di layar Welcome klik New Project.
=> Jika Anda telah membuka project, dari menu File, pilih New Project.
=> Jika Anda telah membuka project, dari menu File, pilih New Project.
3. Pada Select the form factors your app will run on, centang untuk Phone and Tablet.
4. Pada Add an activity to Mobile, pilih Blank Activity dan klik Next.
Next ->
5. Klik tombol Finish untuk membuat project.
6. Pilih View Anda sebagai Project, Buka file layout untuk kegiatan utama (activity_main.xml) terletak di bawah App ⇒ res ⇒ layout.
activity_main.xml
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout 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:id="@+id/activity_main" android:layout_width="match_parent" android:layout_height="match_parent" android:paddingBottom="@dimen/activity_vertical_margin" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" tools:context="timepicker.megadistudio.com.timepicker.MainActivity"> <TextView android:text="@string/tk" android:textSize="50sp" android:textStyle="bold" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentTop="true" android:layout_centerHorizontal="true" android:id="@+id/textView2" /> <ImageView android:layout_width="150dp" android:layout_height="150dp" app:srcCompat="@drawable/tk" android:layout_below="@+id/textView2" android:layout_centerHorizontal="true" android:layout_marginTop="10dp" android:id="@+id/imageView" /> <TextView android:text="" android:textStyle="bold" android:textSize="20sp" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@+id/imageView" android:layout_alignLeft="@+id/textView2" android:layout_alignStart="@+id/textView2" android:layout_marginLeft="41dp" android:layout_marginStart="41dp" android:layout_marginTop="66dp" android:id="@+id/txtDate" /> <Button android:text="Waktu" android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/buttonTime" android:layout_alignBaseline="@+id/txtTime" android:layout_alignBottom="@+id/txtTime" android:layout_alignLeft="@+id/buttonDate" android:layout_alignStart="@+id/buttonDate" android:textAllCaps="false" /> <TextView android:text="" android:textSize="20sp" android:textStyle="bold" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="21dp" android:id="@+id/txtTime" android:layout_below="@+id/buttonDate" android:layout_alignLeft="@+id/txtDate" android:layout_alignStart="@+id/txtDate" /> <Button android:text="Tanggal" android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/buttonDate" android:layout_alignBaseline="@+id/txtDate" android:layout_alignBottom="@+id/txtDate" android:layout_alignRight="@+id/textView2" android:layout_alignEnd="@+id/textView2" android:layout_marginRight="39dp" android:layout_marginEnd="39dp" android:textAllCaps="false" /> </RelativeLayout>
7. Buka string.xml terletak di app ⇒ res ⇒ value dan copy kode di bawah ini.
string.xml
<resources> <string name="app_name">TimePicker</string> <string name="tk">Tahu Koding</string> </resources>
8. Sekarang Buka MainActivity.java terletak di app ⇒ src ⇒ Java dan copy kode di bawah ini.
MainActivity.java
package timepicker.megadistudio.com.timepicker; import android.app.Activity; import android.app.DatePickerDialog; import android.app.TimePickerDialog; import android.support.v7.app.AppCompatActivity; import android.os.Bundle; import android.view.View; import android.widget.Button; import android.widget.DatePicker; import android.widget.TextView; import android.widget.TimePicker; import java.util.Calendar; public class MainActivity extends AppCompatActivity implements View.OnClickListener { private Button btnDate, btnTime; private TextView txtDate, txtTime; private int mTahun, mBulan, mHari, mJam, mMenit; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); btnDate = (Button) findViewById(R.id.buttonDate); btnTime = (Button) findViewById(R.id.buttonTime); txtDate =(TextView) findViewById(R.id.txtDate); txtTime =(TextView) findViewById(R.id.txtTime); btnDate.setOnClickListener(this); btnTime.setOnClickListener(this); } @Override public void onClick(View v) { if (v == btnDate) { final Calendar c = Calendar.getInstance(); mTahun = c.get(Calendar.YEAR); mBulan = c.get(Calendar.MONTH); mHari = c.get(Calendar.DAY_OF_MONTH); DatePickerDialog datePickerDialog = new DatePickerDialog(this, new DatePickerDialog.OnDateSetListener(){ @Override public void onDateSet(DatePicker view, int year, int month, int dayOfMonth) { txtDate.setText(dayOfMonth + "-" + (month + 1) + "-" + year); } },mTahun,mBulan,mHari); datePickerDialog.show(); } if(v == btnTime){ final Calendar c = Calendar.getInstance(); mJam = c.get(Calendar.HOUR_OF_DAY); mMenit = c.get(Calendar.MINUTE); TimePickerDialog timePickerDialog = new TimePickerDialog(this, new TimePickerDialog.OnTimeSetListener(){ @Override public void onTimeSet(TimePicker view, int hourOfDay, int minute) { txtTime.setText(hourOfDay + ":" + minute); } },mJam,mMenit, false); timePickerDialog.show(); } } }
Untuk menjalankan aplikasi dari Android Studio , klik Run ikon dari toolbar.