Sdílet prostřednictvím


Výběr času

Výběr času vám poskytne standardizovaný způsob, jak uživatelům umožnit vybrat časovou hodnotu pomocí dotykového ovládání, myši nebo vstupu klávesnice.

Příklad výběru času

Je to správná kontrola?

Pomocí nástroje pro výběr času umožníte uživateli vybrat jednu časovou hodnotu.

Další informace o výběru správného ovládacího prvku najdete v článku Ovládací prvky data a času .

Examples

Vstupní bod zobrazuje zvolený čas a když uživatel vybere vstupní bod, z prostřední části se vertikálně rozbalí rozbalovací nabídka, aby uživatel mohl provést výběr. Výběr času překrývá jiné uživatelské rozhraní; nevytlačuje jiné uživatelské rozhraní z cesty.

Příklad rozbalení výběru času

Vytvořit časový výběr

Ikona galerie WinUI 3 Aplikace Galerie WinUI 3 obsahuje interaktivní příklady ovládacích prvků a funkcí WinUI. Získejte aplikaci z Microsoft Store nebo vyhledejte zdrojový kód na GitHub.

Tento příklad ukazuje, jak vytvořit jednoduchý výběr času se záhlavím.

<TimePicker x:Name="arrivalTimePicker" Header="Arrival time"/>
TimePicker arrivalTimePicker = new TimePicker();
arrivalTimePicker.Header = "Arrival time";

Výsledný výběr času vypadá takto:

Příklad výběru času

Formátování časového vybírače

Ve výchozím nastavení se ve výběru času zobrazuje 12hodinový formát s AM/PM. Vlastnost ClockIdentifier můžete nastavit na "24hodinový formát", aby se zobrazoval 24hodinový formát hodin.

<TimePicker Header="24HourClock" SelectedTime="18:21" ClockIdentifier="24HourClock"/>

nástroj pro výběr času ve formátu 24 hodin.

Můžete nastavit vlastnost MinuteIncrement pro určení časových přírůstků zobrazených v nástroji pro výběr minut. Například 15 určuje, že ovládací prvek TimePicker minut zobrazuje pouze volby 00, 15, 30, 45.

<TimePicker MinuteIncrement="15"/>

výběr času po 15minutových krocích.

Časové hodnoty

Ovládací prvek pro výběr času má time/TimeChanged i SelectedTime/SelectedTimeChanged API. Rozdíl mezi těmito spočívá v tom, že Time není nullovatelné, zatímco SelectedTime je nullovatelné.

Hodnota SelectedTime se používá pro nastavení výběru času a je standardně null. Pokud je SelectedTimenull, vlastnost Time je nastavena na TimeSpan 0; jinak se hodnota Time synchronizuje s hodnotou SelectedTime. Když je SelectedTimenull, je výběrové pole "nenastavené" a místo času zobrazí názvy polí.

výběr času bez vybraného času.

Inicializace časové hodnoty

V kódu můžete inicializovat vlastnosti času na hodnotu typu TimeSpan:

TimePicker timePicker = new TimePicker
{
    SelectedTime = new TimeSpan(14, 15, 00) // Seconds are ignored.
};

Časovou hodnotu můžete nastavit jako atribut v jazyce XAML. To je pravděpodobně nejjednodušší, pokud už deklarujete objekt TimePicker v jazyce XAML a nepoužíváte vazby pro časovou hodnotu. Použijte řetězec ve formuláři Hh:Mm, kde Hh hodin a může být mezi 0 a 23 a Mm minut a může být v rozmezí od 0 do 59.

<TimePicker SelectedTime="14:15"/>

Poznámka:

Důležité informace o hodnotách data a času naleznete v článku ovládací prvky datum a čas, konkrétně v části o DateTime a Calendar hodnotách.

Použití časových hodnot

Pokud chcete použít časovou hodnotu v aplikaci, obvykle použijete datovou vazbu na vlastnost SelectedTime nebo Time, použijete vlastnosti času přímo v kódu nebo handlujete událost SelectedTimeChanged nebo TimeChanged.

Příklad použití DatePicker a TimePicker k aktualizaci jedné DateTime hodnoty najdete v tématu Ovládací prvky Kalendář, datum a čas – Použití nástroje pro výběr data a výběru času společně.

Zde se vlastnost SelectedTime používá k porovnání vybraného času s aktuálním časem.

Všimněte si, že protože vlastnost SelectedTime má hodnotu null, musíte ji explicitně přetypovat na DateTime, například: DateTime myTime = (DateTime)(DateTime.Today + checkTimePicker.SelectedTime);. Vlastnost Time však lze použít bez přetypování, například: DateTime myTime = DateTime.Today + checkTimePicker.Time;.

výběr času, tlačítko a textový popisek.

<StackPanel>
    <TimePicker x:Name="checkTimePicker"/>
    <Button Content="Check time" Click="{x:Bind CheckTime}"/>
    <TextBlock x:Name="resultText"/>
</StackPanel>
private void CheckTime()
{
    // Using the Time property.
    // DateTime myTime = DateTime.Today + checkTimePicker.Time;
    // Using the SelectedTime property (nullable requires cast to DateTime).
    DateTime myTime = (DateTime)(DateTime.Today + checkTimePicker.SelectedTime);
    if (DateTime.Now >= myTime)
    {
        resultText.Text = "Your selected time has already past.";
    }
    else
    {
        string hrs = (myTime - DateTime.Now).Hours.ToString();
        string mins = (myTime - DateTime.Now).Minutes.ToString();
        resultText.Text = string.Format("Your selected time is {0} hours, {1} minutes from now.", hrs, mins);
    }
}