Udostępnij przez

Selektor czasu systemu Android

Aby zapewnić użytkownikowi możliwość wybrania czasu, możesz użyć platformy TimePicker. Aplikacje dla systemu Android zwykle używają funkcji TimePicker TimePickerDialog do wybierania wartości czasu — pomaga to zapewnić spójny interfejs między urządzeniami i aplikacjami. TimePicker Umożliwia użytkownikom wybranie godziny dnia w trybie 24-godzinnym lub 12-godzinnym AM/PM. TimePickerDialog jest klasą pomocnika, która hermetyzuje element TimePicker w oknie dialogowym.

Przykładowy zrzut ekranu okna dialogowego selektora czasu w akcji

Omówienie

Nowoczesne aplikacje dla systemu Android wyświetlają element TimePickerDialog w oknie dialogowymFragment. Dzięki temu aplikacja może wyświetlać TimePicker okno dialogowe jako okno podręczne lub osadzać je w działaniu. Ponadto program DialogFragment zarządza cyklem życia i wyświetlaniem okna dialogowego, zmniejszając ilość kodu, który należy zaimplementować.

W tym przewodniku pokazano, jak używać elementu TimePickerDialog, opakowanego w obiekcie DialogFragment. Przykładowa aplikacja wyświetla TimePickerDialog jako modalne okno dialogowe, gdy użytkownik kliknie przycisk w działaniu. Gdy czas jest ustawiany przez użytkownika, okno dialogowe kończy działanie, a program obsługi aktualizuje TextView element na ekranie Działania z wybranym czasem.

Wymagania

Przykładowa aplikacja tego przewodnika dotyczy systemu Android 4.1 (poziom 16 interfejsu API) lub nowszego, ale może być używana z systemem Android 3.0 (poziom interfejsu API 11 lub nowszy). Istnieje możliwość obsługi starszych wersji systemu Android z dodatkiem biblioteki obsługi systemu Android w wersji 4 do projektu i niektórych zmian w kodzie.

Korzystanie z platformy TimePicker

Ten przykład rozszerza ; DialogFragmentimplementacja podklasy (wywoływana TimePickerFragment poniżej) hostów DialogFragment i wyświetla TimePickerDialog. Po pierwszym uruchomieniu przykładowej aplikacji zostanie wyświetlony przycisk PICK TIME powyżej TextView elementu , który będzie używany do wyświetlania wybranego czasu:

Ekran początkowej przykładowej aplikacji

Po kliknięciu przycisku PICK TIME przykładowa aplikacja zostanie uruchomiona, jak pokazano na poniższym zrzucie TimePickerDialog ekranu:

Zrzut ekranu przedstawiający domyślne okno dialogowe selektora czasu wyświetlane przez aplikację

W pliku TimePickerDialog, wybranie godziny i kliknięcie przycisku OK powoduje TimePickerDialog wywołanie metody IOnTimeSetListener.OnTimeSet. Ten interfejs jest implementowany przez hosting DialogFragment (TimePickerFragmentopisany poniżej). Kliknięcie przycisku Anuluj powoduje odrzucenie fragmentu i okna dialogowego.

DialogFragment Zwraca wybrany czas do działania hostingu na jeden z trzech sposobów:

  1. Wywoływanie metody lub ustawianie właściwości — działanie może podać właściwość lub metodę specjalnie do ustawiania tej wartości.

  2. Wywoływanie zdarzenia — DialogFragment może zdefiniować zdarzenie, które zostanie zgłoszone po OnTimeSet wywołaniu.

  3. Action Za pomocą elementu — DialogFragment obiekt może wywołać element , Action<DateTime> aby wyświetlić czas w działaniu. Działanie spowoduje udostępnienie Action<DateTime wystąpienia elementu DialogFragment.

W tym przykładzie zostanie użyta trzecia technika, która wymaga, aby działanie dostarczało procedurę Action<DateTime> obsługi do klasy DialogFragment.

Uruchamianie projektu aplikacji

Rozpocznij nowy projekt systemu Android o nazwie TimePickerDemo (jeśli nie znasz tworzenia projektów platformy Xamarin.Android, zobacz Hello, Android , aby dowiedzieć się, jak utworzyć nowy projekt).

Edytuj zasoby/layout/Main.axml i zastąp jego zawartość następującym kodem XML:

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

Jest to podstawowa funkcja LinearLayout z kontrolką TextView , która wyświetla czas i przycisk , który otwiera TimePickerDialogobiekt . Należy pamiętać, że ten układ używa zakodowanych ciągów i wymiarów w celu uproszczenia i łatwiejszego zrozumienia aplikacji — aplikacja produkcyjna zwykle używa zasobów dla tych wartości (jak widać w przykładzie kodu Platformy DatePicker ).

Edytuj MainActivity.cs i zastąp jego zawartość następującym kodem:

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

Podczas kompilowania i uruchamiania tego przykładu powinien zostać wyświetlony ekran początkowy podobny do poniższego zrzutu ekranu:

Ekran początkowej aplikacji

Kliknięcie przycisku PICK TIME nie powoduje niczego, ponieważ DialogFragment element nie został jeszcze zaimplementowany w celu wyświetlenia elementu TimePicker. Następnym krokiem jest utworzenie tego elementu DialogFragment.

Rozszerzanie okna dialogowegoFragment

Aby rozszerzyć DialogFragment elementy do użycia z TimePickerprogramem , należy utworzyć podklasę, która pochodzi z DialogFragment klasy i implementuje TimePickerDialog.IOnTimeSetListenerelement . Dodaj następującą klasę do 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);
    }
}

Ta TimePickerFragment klasa jest podzielona na mniejsze elementy i wyjaśniono w następnej sekcji.

Implementacja okna dialogowego

TimePickerFragment implementuje kilka metod: metodę fabryki, metodę tworzenia wystąpienia okna dialogowego i metodę obsługi wymaganą OnTimeSet przez TimePickerDialog.IOnTimeSetListenerprogram .

  • TimePickerFragmentjest podklasą .DialogFragment Implementuje TimePickerDialog.IOnTimeSetListener również interfejs (czyli dostarcza wymaganą OnTimeSet metodę):

    public class TimePickerFragment : DialogFragment, TimePickerDialog.IOnTimeSetListener

  • TAG jest inicjowany do celów rejestrowania (MyTimePickerFragment można zmienić na dowolny ciąg, którego chcesz użyć). Akcja timeSelectedHandler jest inicjowana do pustego delegata, aby zapobiec wyjątkom odwołania o wartości null:

    public static readonly string TAG = "MyTimePickerFragment";
Action<DateTime> timeSelectedHandler = delegate { };

  • Metoda NewInstance factory jest wywoływana w celu utworzenia wystąpienia nowego TimePickerFragmentelementu . Ta metoda pobiera procedurę obsługi wywoływaną Action<DateTime> , gdy użytkownik kliknie przycisk OK w pliku TimePickerDialog:

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

  • Gdy fragment ma być wyświetlany, system Android wywołuje metodę DialogFragment OnCreateDialog. Ta metoda tworzy nowy TimePickerDialog obiekt i inicjuje go za pomocą działania, obiektu wywołania zwrotnego (który jest bieżącym wystąpieniem TimePickerFragmentobiektu ) i bieżącej godziny:

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

  • Gdy użytkownik zmieni ustawienie czasu w TimePicker oknie dialogowym, OnTimeSet metoda zostanie wywołana. OnTimeSet Tworzy DateTime obiekt przy użyciu bieżącej daty i scala w czasie (godzina i minuta) wybranym przez użytkownika:

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

  • Ten DateTime obiekt jest przekazywany do timeSelectedHandler obiektu zarejestrowanego TimePickerFragment w obiekcie w czasie tworzenia. OnTimeSet wywołuje tę procedurę obsługi, aby zaktualizować czas działania do wybranej godziny (ta procedura obsługi jest implementowana w następnej sekcji):

    timeSelectedHandler (selectedTime);

Wyświetlanie elementu TimePickerFragment

Teraz, gdy DialogFragment element został zaimplementowany, nadszedł czas, aby utworzyć wystąpienie metody NewInstance fabryki DialogFragment i wyświetlić ją, wywołując polecenie DialogFragment.Show:

Dodaj następującą metodę do MainActivity:

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

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

Po TimeSelectOnClick utworzeniu wystąpienia klasy TimePickerFragmenttworzy i przekazuje delegata dla anonimowej metody, która aktualizuje wyświetlanie czasu działania przy użyciu wartości przekazanej w czasie. Na koniec uruchamia fragment okna dialogowego TimePicker (za pośrednictwem DialogFragment.Show) w celu wyświetlenia elementu użytkownikowi TimePicker .

Na końcu OnCreate metody dodaj następujący wiersz, aby dołączyć procedurę obsługi zdarzeń do przycisku PICK TIME , który uruchamia okno dialogowe:

timeSelectButton.Click += TimeSelectOnClick;

Po kliknięciu przycisku WYBIERZ CZAS zostanie wywołany, TimeSelectOnClick aby wyświetlić fragment okna dialogowego TimePicker użytkownikowi.

Wypróbuj!

Skompiluj i uruchom aplikację. Po kliknięciu przycisku TimePickerDialog WYBIERZ GODZINĘ zostanie wyświetlony w domyślnym formacie czasu działania (w tym przypadku w trybie 12-godzinnym AM/PM):

Okno dialogowe czasu jest wyświetlane w trybie AM/PM

Po kliknięciu TimePicker przycisku OK w oknie dialogowym program obsługi aktualizuje działanie TextView o wybrany czas, a następnie kończy działanie:

Godzina A/M jest wyświetlana w działaniu TextView

Następnie dodaj następujący wiersz kodu do OnCreateDialog natychmiast po is24HourFormat zadeklarowaniu i zainicjowaniu:

is24HourFormat = true;

Ta zmiana wymusza przekazanie flagi do konstruktora TimePickerDialog true tak, aby tryb 24-godzinny był używany zamiast formatu czasu działania hostingu. Po ponownym skompilowaniu i uruchomieniu aplikacji kliknij przycisk PICK TIME (TimePickerWYBIERZ CZAS), okno dialogowe będzie teraz wyświetlane w formacie 24 godziny:

Okno dialogowe timePicker w formacie 24-godzinnym

Ponieważ program obsługi wywołuje funkcję DateTime.ToShortTimeString , aby wydrukować czas działania TextView, czas jest nadal drukowany w domyślnym formacie AM/PM 12-godzinnym.

Podsumowanie

W tym artykule wyjaśniono, jak wyświetlić TimePicker widżet jako okno dialogowe modalne wyskakujące z działania systemu Android. Udostępniono przykładową DialogFragment implementację IOnTimeSetListener i omówiono interfejs. W tym przykładzie pokazano również, jak DialogFragment można wchodzić w interakcje z działaniem hosta w celu wyświetlenia wybranego czasu.

  • Last updated on