Xamarin.Forms Wechseln

Beispiel herunterladen Das Beispiel herunterladen

Das Xamarin.FormsSwitch Steuerelement ist eine horizontale Umschaltfläche, die vom Benutzer so bearbeitet werden kann, dass sie zwischen ein- und aus-Zustand umschalten kann, die durch einen boolean Wert dargestellt werden. Die Klasse Switch erbt von View.

Die folgenden Screenshots zeigen ein Switch Steuerelement in seinen Ein - und Aus-Umschaltstatus unter iOS und Android:

Screenshot: Ein- und Ausschalter unter iOS- und

Das Switch -Steuerelement definiert die folgenden Eigenschaften:

  • IsToggledist ein boolean Wert, der angibt, ob aktiviert Switchist.
  • OnColor ist ein Color , der sich darauf auswirkt, wie die Switch im umgeschalteten zustand oder ein gerendert wird.
  • ThumbColor ist der Color des Schalterfingers.

Diese Eigenschaften werden von einem BindableProperty -Objekt unterstützt. Dies bedeutet, dass das Switch -Objekt formatiert werden kann und das Ziel von Datenbindungen sein kann.

Das Switch -Steuerelement definiert ein Toggled Ereignis, das ausgelöst wird, wenn sich die IsToggled Eigenschaft ändert, entweder durch Benutzerbearbeitung oder wenn eine Anwendung die IsToggled Eigenschaft festlegt. Das ToggledEventArgs Objekt, das das Toggled Ereignis begleitet, verfügt über eine einzelne Eigenschaft mit dem Namen Value, vom Typ bool. Wenn das Ereignis ausgelöst wird, spiegelt der Wert der Value -Eigenschaft den neuen Wert der IsToggled -Eigenschaft wider.

Erstellen eines Switch

Ein Switch kann in XAML instanziiert werden. Die - IsToggled Eigenschaft kann so festgelegt werden, dass die umschaltet Switch. Standardmäßig ist falsedie IsToggled -Eigenschaft . Das folgende Beispiel zeigt, wie sie in Switch XAML instanziieren, indem die optionale IsToggled Eigenschaft festgelegt ist:

<Switch IsToggled="true"/>

Ein Switch kann auch im Code erstellt werden:

Switch switchControl = new Switch { IsToggled = true };

Switch-Darstellung

Zusätzlich zu den Eigenschaften, die Switch von der View -Klasse erben, Switch definiert OnColor auch und ThumbColor Eigenschaften. Die OnColor -Eigenschaft kann so festgelegt werden, dass die Switch Farbe definiert wird, wenn sie auf ihren On-Zustand umgeschaltet wird, und die ThumbColor -Eigenschaft kann festgelegt werden, um den Color des Schalterfingers zu definieren. Das folgende Beispiel zeigt, wie sie in Switch XAML instanziieren, wobei diese Eigenschaften festgelegt sind:

<Switch OnColor="Orange"
        ThumbColor="Green" />

Die Eigenschaften können auch beim Erstellen von Switch im Code festgelegt werden:

Switch switch = new Switch { OnColor = Color.Orange, ThumbColor = Color.Green };

Der folgende Screenshot zeigt den Switchin seinen Ein - und Aus-Umschaltstatus , wobei die OnColor Eigenschaften und ThumbColor festgelegt sind:

Screenshot: Ein- und Ausschaltstatus unter iOS und Android mit geänderten Farben

Reagieren auf eine Änderung des Switch-Zustands

Wenn sich die IsToggled Eigenschaft ändert, entweder durch Benutzerbearbeitung oder wenn eine Anwendung die IsToggled -Eigenschaft festlegt, wird das Toggled -Ereignis ausgelöst. Ein Ereignishandler für dieses Ereignis kann registriert werden, um auf die Änderung zu reagieren:

<Switch Toggled="OnToggled" />

Die CodeBehind-Datei enthält den Handler für das Toggled Ereignis:

void OnToggled(object sender, ToggledEventArgs e)
{
    // Perform an action after examining e.Value
}

Das sender Argument im Ereignishandler ist für das Switch Auslösen dieses Ereignisses verantwortlich. Sie können die sender -Eigenschaft verwenden, um auf das Switch -Objekt zuzugreifen oder zwischen mehreren Switch Objekten zu unterscheiden, die denselben Toggled Ereignishandler verwenden.

Der Toggled Ereignishandler kann auch im Code zugewiesen werden:

Switch switchControl = new Switch {...};
switchControl.Toggled += (sender, e) =>
{
    // Perform an action after examining e.Value
}

Datenbindung an einen Switch

Der Toggled Ereignishandler kann entfernt werden, indem Datenbindung und Trigger verwendet werden, um auf einen Switch sich ändernden Umschaltzustand zu reagieren.

<Switch x:Name="styleSwitch" />
<Label Text="Lorem ipsum dolor sit amet, elit rutrum, enim hendrerit augue vitae praesent sed non, lorem aenean quis praesent pede.">
    <Label.Triggers>
        <DataTrigger TargetType="Label"
                     Binding="{Binding Source={x:Reference styleSwitch}, Path=IsToggled}"
                     Value="true">
            <Setter Property="FontAttributes"
                    Value="Italic, Bold" />
            <Setter Property="FontSize"
                    Value="Large" />
        </DataTrigger>
    </Label.Triggers>
</Label>

In diesem Beispiel verwendet einen Label Bindungsausdruck in einem DataTrigger , um die IsToggled -Eigenschaft des Switch namens styleSwitchzu überwachen. Wenn diese Eigenschaft zu wird true, werden die FontAttributes Eigenschaften und FontSize von Label geändert. Wenn die IsToggled -Eigenschaft zu falsezurückkehrt, werden die FontAttributes Eigenschaften und FontSize der Label -Eigenschaft auf ihren Ursprünglichen Zustand zurückgesetzt.

Informationen zu Triggern finden Sie unter Xamarin.Forms Trigger.

Wechseln von visuellen Zuständen

Switch verfügt über On visuelle Zustände und Off , die verwendet werden können, um eine visuelle Änderung zu initiieren, wenn sich die IsToggled Eigenschaft ändert.

Im folgenden XAML-Beispiel wird gezeigt, wie visuelle Zustände für die On Zustände und Off definiert werden:

<Switch IsToggled="True">
    <VisualStateManager.VisualStateGroups>
        <VisualStateGroup x:Name="CommonStates">
            <VisualState x:Name="On">
                <VisualState.Setters>
                    <Setter Property="ThumbColor"
                            Value="MediumSpringGreen" />
                </VisualState.Setters>
            </VisualState>
            <VisualState x:Name="Off">
                <VisualState.Setters>
                    <Setter Property="ThumbColor"
                            Value="Red" />
                </VisualState.Setters>
            </VisualState>
        </VisualStateGroup>
    </VisualStateManager.VisualStateGroups>
</Switch>

In diesem Beispiel gibt an OnVisualState , dass, wenn die IsToggled -Eigenschaft ist true, die ThumbColor -Eigenschaft auf "mittleres Frühlingsgrün" festgelegt wird. Gibt OffVisualState an, dass, wenn die IsToggled -Eigenschaft ist false, die ThumbColor -Eigenschaft auf rot festgelegt wird. Daher besteht der Gesamteffekt darin, dass, wenn sich der Switch Daumen in einer off-Position befindet, rot und sein Daumen mittelfrieren grün ist, wenn sich der Switch in einer position befindet:

Screenshot: Switch on VisualState, on iOS and AndroidScreenshot von Switch off VisualState, on iOS and Android

Weitere Informationen zu visuellen Zuständen finden Sie unter Xamarin.Forms: Visual State-Manager.

Deaktivieren eines Schalters

Eine Anwendung kann in einen Zustand eintreten, in dem das Switch Umschalten kein gültiger Vorgang ist. In solchen Fällen kann das Switch deaktiviert werden, indem die zugehörige IsEnabled-Eigenschaft auf false festgelegt wird. Dadurch wird verhindert, dass Benutzer die Switchbearbeiten können.