Tidsväljare

Tidsväljaren ger dig ett standardiserat sätt att låta användarna välja ett tidsvärde med hjälp av pek-, mus- eller tangentbordsinmatning.

Är det här rätt kontroll?

Använd en tidsväljare för att låta en användare välja ett engångsvärde.

Mer information om hur du väljer rätt kontroll finns i artikeln Datum- och tidskontroller .

Examples

Startpunkten visar den valda tiden, och när användaren väljer startpunkten expanderar en väljarens yta lodrätt från mitten så att användaren kan göra ett val. Tidsväljaren överlagrar andra användargränssnitt; den tränger inte undan andra gränssnitt.

Skapa en tidsväljare

WinUI 3-galleriappen innehåller interaktiva exempel på WinUI-kontroller och funktioner. Hämta appen från Microsoft Store eller bläddra i källkoden på GitHub.

Det här exemplet visar hur du skapar en enkel tidsväljare med en rubrik.

<TimePicker x:Name="arrivalTimePicker" Header="Arrival time"/>

TimePicker arrivalTimePicker = new TimePicker();
arrivalTimePicker.Header = "Arrival time";

Den resulterande tidsväljaren ser ut så här:

Formatera tidsväljaren

Som standard visar tidsväljaren en 12-timmarsklocka med en AM/PM-väljare. Du kan ange egenskapen ClockIdentifier till "24HourClock" för att visa en 24-timmarsklocka i stället.

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

Du kan ange egenskapen MinuteIncrement för att ange de tidssteg som visas i minutväljaren. Till exempel anger 15 att kontrollen TimePicker minut endast visar alternativen 00, 15, 30, 45.

<TimePicker MinuteIncrement="15"/>

Tidsvärden

Tidsväljaren har både Time/TimeChanged och SelectedTime/SelectedTimeChanged API:er. Skillnaden mellan dessa är att Time inte är null, medan SelectedTime kan vara null.

Värdet för SelectedTime används för att fylla i tidsväljaren och är null som standard. Om SelectedTime är nullanges egenskapen Time till en TimeSpan- på 0. Annars synkroniseras värdet Time med värdet SelectedTime. När SelectedTime är nullär väljaren "unset" och visar fältnamnen i stället för en tid.

Initiera ett tidsvärde

I kod kan du initiera tidsegenskaperna till ett värde av typen TimeSpan:

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

Du kan ange tidsvärdet som ett attribut i XAML. Det här är förmodligen enklast om du redan deklarerar det TimePicker objektet i XAML och inte använder bindningar för tidsvärdet. Använd en sträng i formuläret Hh:Mm där Hh är timmar och kan vara mellan 0 och 23 och Mm är minuter och kan vara mellan 0 och 59.

<TimePicker SelectedTime="14:15"/>

Använda tidsvärdena

Om du vill använda tidsvärdet i din app använder du vanligtvis en databindning till egenskapen SelectedTime eller Time, använder tidsegenskaperna direkt i koden eller hanterar SelectedTimeChanged- eller TimeChanged- händelse.

Ett exempel på hur du använder DatePicker och TimePicker tillsammans för att uppdatera ett enda DateTime värde finns i Kontroller för kalender, datum och tid – Använd en datumväljare och tidsväljare tillsammans.

Här används egenskapen SelectedTime för att jämföra den valda tiden med den aktuella tiden.

Observera att eftersom egenskapen SelectedTime är null måste du uttryckligen omvandla den till DateTime, så här: DateTime myTime = (DateTime)(DateTime.Today + checkTimePicker.SelectedTime);. Egenskapen Time kan dock användas utan gjutning, så här: DateTime myTime = DateTime.Today + checkTimePicker.Time;.

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

Relaterade ämnen

• Datum- och tidskontroller
• Kalenderdatumväljare
• Kalendervy
• Datumväljare