Xamarin.Forms Timepicker
Eine Xamarin.Forms Ansicht, die es dem Benutzer ermöglicht, eine Uhrzeit auszuwählen.
Xamarin.FormsTimePicker
Ruft das Zeitauswahl-Steuerelement der Plattform auf und ermöglicht es dem Benutzer, eine Uhrzeit auszuwählen. TimePicker
definiert die folgenden Eigenschaften:
Time
vom TypTimeSpan
, die ausgewählte Zeit, die standardmäßig aufTimeSpan
0 festgelegt ist. DerTimeSpan
Typ gibt eine Dauer seit Mitternacht an.Format
vom Typstring
, eine standardmäßige oder benutzerdefinierte .NET-Formatierungszeichenfolge, die standardmäßig "t" ist, das kurze Zeitmuster.TextColor
vom TypColor
, die Farbe, die verwendet wird, um die ausgewählte Zeit anzuzeigen, die standardmäßig auf festgelegt istColor.Default
.FontAttributes
vom TypFontAttributes
, der standardmäßig auf festgelegt istFontAtributes.None
.FontFamily
vom Typstring
, der standardmäßig auf festgelegt istnull
.FontSize
vom Typdouble
, der standardmäßig auf -1.0 festgelegt ist.CharacterSpacing
vom Typdouble
: Abstand zwischen den Zeichen desTimePicker
-Texts.
Alle diese Eigenschaften werden von BindableProperty
-Objekten unterstützt, was bedeutet, dass sie formatiert werden können, und die Eigenschaften können Ziele von Datenbindungen sein. Die Time
-Eigenschaft verfügt über einen Standardbindungsmodus von BindingMode.TwoWay
, was bedeutet, dass sie ein Ziel einer Datenbindung in einer Anwendung sein kann, die die MVVM-Architektur (Model-View-ViewModel) verwendet.
Enthält TimePicker
kein Ereignis, das einen neuen ausgewählten Time
Wert angibt. Wenn Sie darüber benachrichtigt werden müssen, können Sie einen Handler für das PropertyChanged
Ereignis hinzufügen.
Initialisieren der Time-Eigenschaft
Im Code können Sie die Time
Eigenschaft mit einem Wert vom Typ TimeSpan
initialisieren:
TimePicker timePicker = new TimePicker
{
Time = new TimeSpan(4, 15, 26) // Time set to "04:15:26"
};
Wenn die Time
-Eigenschaft in XAML angegeben wird, wird der Wert in eine TimeSpan
konvertiert und überprüft, um sicherzustellen, dass die Anzahl der Millisekunden größer oder gleich 0 ist und dass die Anzahl der Stunden kleiner als 24 ist. Die Zeitkomponenten sollten durch Doppelpunkte getrennt werden:
<TimePicker Time="4:15:26" />
Wenn die BindingContext
-Eigenschaft von TimePicker
auf eine instance eines ViewModel-Objekts festgelegt ist, das z. B. eine Eigenschaft vom Typ TimeSpan
namens SelectedTime
enthält, können Sie die TimePicker
wie folgt instanziieren:
<TimePicker Time="{Binding SelectedTime}" />
In diesem Beispiel wird die Time
-Eigenschaft mit der SelectedTime
-Eigenschaft in ViewModel initialisiert. Da die Time
-Eigenschaft über den Bindungsmodus verfügt TwoWay
, wird jedes neue Mal, das der Benutzer auswählt, automatisch an viewModel weitergegeben.
Wenn die TimePicker
-Eigenschaft keine Bindung Time
enthält, sollte eine Anwendung einen Handler an das PropertyChanged
Ereignis anfügen, um informiert zu werden, wenn der Benutzer einen neuen Zeitpunkt auswählt.
Informationen zum Festlegen von Schriftarteigenschaften finden Sie unter Schriftarten.
TimePicker und Layout
Es ist möglich, eine uneingeschränkte horizontale Layoutoption wie Center
, Start
oder End
mit TimePicker
zu verwenden:
<TimePicker ···
HorizontalOptions="Center"
··· />
Dies ist wird jedoch nicht empfohlen. Abhängig von der Einstellung der Format
Eigenschaft erfordern ausgewählte Zeiten möglicherweise unterschiedliche Anzeigebreiten. Beispielsweise bewirkt die Formatzeichenfolge "T", dass die TimePicker
Ansicht Die Zeiten in einem langen Format anzeigt, und "4:15:26 AM" erfordert eine größere Anzeigebreite als das kurze Zeitformat ("t") von "4:15 AM". Je nach Plattform kann dieser Unterschied dazu führen, dass die TimePicker
Ansicht die Breite im Layout ändert oder dass die Anzeige abgeschnitten wird.
Tipp
Es empfiehlt sich, die Standardeinstellung HorizontalOptions
von Fill
mit TimePicker
zu verwenden und beim Einfügen TimePicker
in eine Grid
Zelle nicht die Breite von Auto
zu verwenden.
TimePicker in einer Anwendung
Das SetTimer-Beispiel enthält TimePicker
die Ansichten , Entry
und Switch
auf der Seite. Kann TimePicker
verwendet werden, um eine Uhrzeit auszuwählen, und wenn diese Zeit eintritt, wird ein Warnungsdialogfeld angezeigt, das den Benutzer an den Text in Entry
der erinnert, sofern aktiviert Switch
ist. Dies ist die XAML-Datei:
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:local="clr-namespace:SetTimer"
x:Class="SetTimer.MainPage">
<StackLayout>
...
<Entry x:Name="_entry"
Placeholder="Enter event to be reminded of" />
<Label Text="Select the time below to be reminded at." />
<TimePicker x:Name="_timePicker"
Time="11:00:00"
Format="T"
PropertyChanged="OnTimePickerPropertyChanged" />
<StackLayout Orientation="Horizontal">
<Label Text="Enable timer:" />
<Switch x:Name="_switch"
HorizontalOptions="EndAndExpand"
Toggled="OnSwitchToggled" />
</StackLayout>
</StackLayout>
</ContentPage>
Mit Entry
können Sie Erinnerungstext eingeben, der angezeigt wird, wenn der ausgewählte Zeitpunkt eintritt. Dem TimePicker
wird die Format
Eigenschaft "T" für ein langes Zeitformat zugewiesen. An das Ereignis ist ein Ereignishandler angefügt, und an das PropertyChanged
Switch
-Ereignis ist ein Handler angefügt Toggled
. Diese Ereignishandler befinden sich in der CodeBehind-Datei und rufen die SetTriggerTime
-Methode auf:
public partial class MainPage : ContentPage
{
DateTime _triggerTime;
public MainPage()
{
InitializeComponent();
Device.StartTimer(TimeSpan.FromSeconds(1), OnTimerTick);
}
bool OnTimerTick()
{
if (_switch.IsToggled && DateTime.Now >= _triggerTime)
{
_switch.IsToggled = false;
DisplayAlert("Timer Alert", "The '" + _entry.Text + "' timer has elapsed", "OK");
}
return true;
}
void OnTimePickerPropertyChanged(object sender, PropertyChangedEventArgs args)
{
if (args.PropertyName == "Time")
{
SetTriggerTime();
}
}
void OnSwitchToggled(object sender, ToggledEventArgs args)
{
SetTriggerTime();
}
void SetTriggerTime()
{
if (_switch.IsToggled)
{
_triggerTime = DateTime.Today + _timePicker.Time;
if (_triggerTime < DateTime.Now)
{
_triggerTime += TimeSpan.FromDays(1);
}
}
}
}
Die SetTriggerTime
-Methode berechnet eine Timerzeit basierend auf dem DateTime.Today
-Eigenschaftswert und dem wert, der TimeSpan
TimePicker
von zurückgegeben wird. Dies ist erforderlich, da die DateTime.Today
-Eigenschaft ein DateTime
zurückgibt, das das aktuelle Datum angibt, aber mit einer Uhrzeit von Mitternacht. Wenn die Timerzeit bereits heute vergangen ist, wird angenommen, dass es morgen ist.
Der Timer tickt jede Sekunde und führt die Methode aus, die OnTimerTick
überprüft, ob aktiviert Switch
ist und ob die aktuelle Zeit größer oder gleich der Timerzeit ist. Wenn die Timerzeit eintritt, zeigt die DisplayAlert
-Methode dem Benutzer ein Warnungsdialogfeld als Erinnerung an.
Wenn das Beispiel zum ersten Mal ausgeführt wird, wird die TimePicker
Ansicht auf 11:00 Uhr initialisiert. Durch Tippen auf TimePicker
wird die Plattformzeitauswahl aufgerufen. Die Plattformen implementieren die Zeitauswahl auf sehr unterschiedliche Weise, aber jeder Ansatz ist den Benutzern dieser Plattform vertraut:
Tipp
Unter Android kann das TimePicker
Dialogfeld angepasst werden, indem die CreateTimePickerDialog
-Methode in einem benutzerdefinierten Renderer überschrieben wird. Dadurch können dem Dialogfeld beispielsweise zusätzliche Schaltflächen hinzugefügt werden.
Nachdem Sie eine Zeit ausgewählt haben, wird die ausgewählte Zeit in der TimePicker
angezeigt:
Vorausgesetzt, dass auf Switch
die Position on umgeschaltet wird, zeigt die Anwendung ein Warnungsdialogfeld an, das den Benutzer an den Text in der Entry
erinnert, wenn der ausgewählte Zeitpunkt eintritt:
Sobald das Warnungsdialogfeld angezeigt wird, wird auf Switch
die Off-Position umgeschaltet.