Bagikan melalui


Pemilih Waktu Android

Untuk menyediakan cara bagi pengguna untuk memilih waktu, Anda dapat menggunakan TimePicker. Aplikasi Android biasanya digunakan TimePicker dengan TimePickerDialog untuk memilih nilai waktu - ini membantu memastikan antarmuka yang konsisten di seluruh perangkat dan aplikasi. TimePicker memungkinkan pengguna untuk memilih waktu hari dalam mode AM/PM 24 jam atau 12 jam. TimePickerDialog adalah kelas pembantu yang merangkum TimePicker dalam dialog.

Contoh cuplikan layar Dialog Pemilih Waktu dalam tindakan

Gambaran Umum

Aplikasi Android modern menampilkan TimePickerDialog dalam DialogFragment. Ini memungkinkan aplikasi untuk menampilkan TimePicker sebagai dialog popup atau menyematkannya dalam Aktivitas. Selain itu, DialogFragment mengelola siklus hidup dan tampilan dialog, mengurangi jumlah kode yang harus diimplementasikan.

Panduan ini menunjukkan cara menggunakan , yang TimePickerDialogdibungkus dalam DialogFragment. Aplikasi sampel menampilkan TimePickerDialog sebagai dialog modal saat pengguna mengklik tombol pada Aktivitas. Ketika waktu diatur oleh pengguna, dialog keluar dan handler memperbarui TextView pada layar Aktivitas dengan waktu yang dipilih.

Persyaratan

Aplikasi sampel untuk panduan ini menargetkan Android 4.1 (API level 16) atau yang lebih tinggi, tetapi dapat digunakan dengan Android 3.0 (API level 11 atau lebih tinggi). Dimungkinkan untuk mendukung versi Android yang lebih lama dengan penambahan Android Support Library v4 ke proyek dan beberapa perubahan kode.

Menggunakan TimePicker

Contoh ini meluas DialogFragment; implementasi subkelas dari DialogFragment (disebut TimePickerFragment di bawah) host dan menampilkan TimePickerDialog. Saat aplikasi sampel pertama kali diluncurkan, aplikasi tersebut menampilkan tombol PICK TIME di atas TextView yang akan digunakan untuk menampilkan waktu yang dipilih:

Layar aplikasi sampel awal

Saat Anda mengklik tombol PICK TIME , aplikasi contoh meluncurkan seperti yang TimePickerDialog terlihat dalam cuplikan layar ini:

Cuplikan layar dialog Pemilih Waktu default yang ditampilkan oleh aplikasi

TimePickerDialogDi , memilih waktu dan mengklik tombol OK menyebabkan TimePickerDialog memanggil metode IOnTimeSetListener.OnTimeSet. Antarmuka ini diimplementasikan oleh hosting DialogFragment (TimePickerFragment, dijelaskan di bawah). Mengklik tombol Batal menyebabkan fragmen dan dialog dimatikan.

DialogFragment mengembalikan waktu yang dipilih ke Aktivitas hosting dengan salah satu dari tiga cara:

  1. Memanggil metode atau mengatur properti – Aktivitas dapat menyediakan properti atau metode khusus untuk mengatur nilai ini.

  2. Menaikkan peristiwaDialogFragment Dapat menentukan peristiwa yang akan dinaikkan saat OnTimeSet dipanggil.

  3. Action Menggunakan - Dapat DialogFragment memanggil Action<DateTime> untuk menampilkan waktu dalam Aktivitas. Aktivitas akan memberikan Action<DateTime saat membuat instans DialogFragment.

Sampel ini akan menggunakan teknik ketiga, yang mengharuskan Aktivitas memasok Action<DateTime> handler ke DialogFragment.

Memulai Proyek Aplikasi

Mulai proyek Android baru yang disebut TimePickerDemo (jika Anda tidak terbiasa membuat proyek Xamarin.Android, lihat Halo, Android untuk mempelajari cara membuat proyek baru).

Edit Sumber Daya/tata letak/Main.axml dan ganti kontennya dengan XML berikut:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_gravity="center_horizontal"
    android:padding="16dp">
    <Button
        android:id="@+id/select_button"
        android:paddingLeft="24dp"
        android:paddingRight="24dp"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="PICK TIME"
        android:textSize="20dp" />
    <TextView
        android:id="@+id/time_display"
        android:layout_height="wrap_content"
        android:layout_width="match_parent"
        android:paddingTop="22dp"
        android:text="Picked time will be displayed here"
        android:textSize="24dp" />
</LinearLayout>

Ini adalah LinearLayout dasar dengan TextView yang menampilkan waktu dan Tombol yang membuka TimePickerDialog. Perhatikan bahwa tata letak ini menggunakan string dan dimensi yang dikodekan secara permanen untuk membuat aplikasi lebih sederhana dan lebih mudah dipahami - aplikasi produksi biasanya menggunakan sumber daya untuk nilai-nilai ini (seperti yang dapat dilihat dalam contoh kode DatePicker ).

Edit MainActivity.cs dan ganti kontennya dengan kode berikut:

using Android.App;
using Android.Widget;
using Android.OS;
using System;
using Android.Util;
using Android.Text.Format;

namespace TimePickerDemo
{
    [Activity(Label = "TimePickerDemo", MainLauncher = true, Icon = "@drawable/icon")]
    public class MainActivity : Activity
    {
        TextView timeDisplay;
        Button timeSelectButton;

        protected override void OnCreate(Bundle bundle)
        {
            base.OnCreate(bundle);
            SetContentView(Resource.Layout.Main);
            timeDisplay = FindViewById<TextView>(Resource.Id.time_display);
            timeSelectButton = FindViewById<Button>(Resource.Id.select_button);
        }
    }
}

Saat membuat dan menjalankan contoh ini, Anda akan melihat layar awal yang mirip dengan cuplikan layar berikut:

Layar Aplikasi Awal

Mengklik tombol PICK TIME tidak melakukan apa pun karena DialogFragment belum diimplementasikan untuk menampilkan TimePicker. Langkah selanjutnya adalah membuat ini DialogFragment.

Memperluas DialogFragment

Untuk memperpanjang DialogFragment penggunaan dengan TimePicker, perlu untuk membuat subkelas yang berasal dari DialogFragment dan mengimplementasikan TimePickerDialog.IOnTimeSetListener. Tambahkan kelas berikut ke MainActivity.cs:

public class TimePickerFragment : DialogFragment, TimePickerDialog.IOnTimeSetListener
{
    public static readonly string TAG = "MyTimePickerFragment";
    Action<DateTime> timeSelectedHandler = delegate { };

    public static TimePickerFragment NewInstance(Action<DateTime> onTimeSelected)
    {
        TimePickerFragment frag = new TimePickerFragment();
        frag.timeSelectedHandler = onTimeSelected;
        return frag;
    }

    public override Dialog OnCreateDialog (Bundle savedInstanceState)
    {
        DateTime currentTime = DateTime.Now;
        bool is24HourFormat = DateFormat.Is24HourFormat(Activity);
        TimePickerDialog dialog = new TimePickerDialog
            (Activity, this, currentTime.Hour, currentTime.Minute, is24HourFormat);
        return dialog;
    }

    public void OnTimeSet(TimePicker view, int hourOfDay, int minute)
    {
        DateTime currentTime = DateTime.Now;
        DateTime selectedTime = new DateTime(currentTime.Year, currentTime.Month, currentTime.Day, hourOfDay, minute, 0);
        Log.Debug(TAG, selectedTime.ToLongTimeString());
        timeSelectedHandler (selectedTime);
    }
}

Kelas ini TimePickerFragment dipecah menjadi potongan-potongan yang lebih kecil dan dijelaskan di bagian berikutnya.

Implementasi DialogFragment

TimePickerFragment menerapkan beberapa metode: metode pabrik, metode instansiasi Dialog, dan metode handler yang OnTimeSet diperlukan oleh TimePickerDialog.IOnTimeSetListener.

  • TimePickerFragment adalah subkelas DialogFragment. Ini juga mengimplementasikan TimePickerDialog.IOnTimeSetListener antarmuka (yaitu, menyediakan metode yang diperlukan OnTimeSet ):

    public class TimePickerFragment : DialogFragment, TimePickerDialog.IOnTimeSetListener
    
  • TAG diinisialisasi untuk tujuan pengelogan (MyTimePickerFragment dapat diubah ke string apa pun yang ingin Anda gunakan). timeSelectedHandler Tindakan diinisialisasi ke delegasi kosong untuk mencegah pengecualian referensi null:

    public static readonly string TAG = "MyTimePickerFragment";
    Action<DateTime> timeSelectedHandler = delegate { };
    
  • Metode NewInstance pabrik dipanggil untuk membuat instans baru TimePickerFragment. Metode ini mengambil Action<DateTime> handler yang dipanggil ketika pengguna mengklik tombol OK di TimePickerDialog:

    public static TimePickerFragment NewInstance(Action<DateTime> onTimeSelected)
    {
        TimePickerFragment frag = new TimePickerFragment();
        frag.timeSelectedHandler = onTimeSelected;
        return frag;
    }
    
  • Ketika fragmen akan ditampilkan, Android memanggil DialogFragment metode OnCreateDialog. Metode ini membuat objek baru TimePickerDialog dan menginisialisasinya dengan Aktivitas, objek panggilan balik (yang merupakan instans saat ini dari TimePickerFragment), dan waktu saat ini:

    public override Dialog OnCreateDialog (Bundle savedInstanceState)
    {
        DateTime currentTime = DateTime.Now;
        bool is24HourFormat = DateFormat.Is24HourFormat(Activity);
        TimePickerDialog dialog = new TimePickerDialog
            (Activity, this, currentTime.Hour, currentTime.Minute, is24HourFormat);
        return dialog;
    }
    
  • Ketika pengguna mengubah pengaturan waktu dalam TimePicker dialog, OnTimeSet metode dipanggil. OnTimeSetDateTime membuat objek menggunakan tanggal saat ini dan menggabungkan dalam waktu (jam dan menit) yang dipilih oleh pengguna:

    public void OnTimeSet(TimePicker view, int hourOfDay, int minute)
    {
        DateTime currentTime = DateTime.Now;
        DateTime selectedTime = new DateTime(currentTime.Year, currentTime.Month, currentTime.Day, hourOfDay, minute, 0);
    
  • Objek ini DateTime diteruskan ke timeSelectedHandler yang terdaftar dengan objek pada TimePickerFragment waktu pembuatan. OnTimeSet memanggil handler ini untuk memperbarui tampilan waktu Aktivitas ke waktu yang dipilih (handler ini diterapkan di bagian berikutnya):

    timeSelectedHandler (selectedTime);
    

Menampilkan TimePickerFragment

Sekarang setelah DialogFragment diimplementasikan, saatnya untuk membuat instans DialogFragment menggunakan NewInstance metode pabrik dan menampilkannya dengan memanggil DialogFragment.Show:

Tambahkan metode berikut ke MainActivity:

void TimeSelectOnClick (object sender, EventArgs eventArgs)
{
    TimePickerFragment frag = TimePickerFragment.NewInstance (
        delegate (DateTime time)
        {
            timeDisplay.Text = time.ToShortTimeString();
        });

    frag.Show(FragmentManager, TimePickerFragment.TAG);
}

Setelah TimeSelectOnClick membuat instans TimePickerFragment, ia membuat dan meneruskan delegasi untuk metode anonim yang memperbarui tampilan waktu Aktivitas dengan nilai waktu yang diteruskan. Terakhir, ini meluncurkan TimePicker fragmen dialog (melalui DialogFragment.Show) untuk menampilkan TimePicker kepada pengguna.

Di akhir OnCreate metode, tambahkan baris berikut untuk melampirkan penanganan aktivitas ke tombol PICK TIME yang meluncurkan dialog:

timeSelectButton.Click += TimeSelectOnClick;

Saat tombol PICK TIME diklik, TimeSelectOnClick akan dipanggil untuk menampilkan TimePicker fragmen dialog kepada pengguna.

Cobalah!

Buat dan jalankan aplikasi. Saat Anda mengklik tombol PICK TIME , TimePickerDialog ditampilkan dalam format waktu default untuk Aktivitas (dalam hal ini, mode AM/PM 12 jam):

Dialog Waktu ditampilkan dalam mode AM/PM

Saat Anda mengklik OK dalam TimePicker dialog, handler memperbarui Aktivitas TextView dengan waktu yang dipilih lalu keluar:

Waktu A/M ditampilkan di Tampilan Teks Aktivitas

Selanjutnya, tambahkan baris kode berikut ke OnCreateDialog segera setelah is24HourFormat dinyatakan dan diinisialisasi:

is24HourFormat = true;

Perubahan ini memaksa bendera yang diteruskan ke TimePickerDialog konstruktor true agar mode 24 jam digunakan alih-alih format waktu Aktivitas hosting. Saat Anda membuat dan menjalankan aplikasi lagi, klik tombol PICK TIME , TimePicker dialog sekarang ditampilkan dalam format 24 jam:

Dialog TimePicker dalam format 24 Jam

Karena handler memanggil DateTime.ToShortTimeString untuk mencetak waktu ke Aktivitas TextView, waktu masih dicetak dalam format AM/PM 12 jam default.

Ringkasan

Artikel ini menjelaskan cara menampilkan TimePicker widget sebagai dialog modal popup dari Aktivitas Android. Ini menyediakan implementasi sampel DialogFragment dan mendiskusikan IOnTimeSetListener antarmuka. Sampel ini juga menunjukkan bagaimana DialogFragment dapat berinteraksi dengan Aktivitas host untuk menampilkan waktu yang dipilih.