Xamarin.Forms-Trigger für Dual-Screen-Geräte

  • Artikel

Der Xamarin.Forms.DualScreen-Namespace enthält zwei Zustandstrigger:

  • SpanModeStateTrigger löst eine VisualState-Änderung aus, wenn sich der Ansichtsmodus des angefügten Layouts ändert.
  • WindowSpanModeStateTrigger löst eine VisualState-Änderung aus, wenn sich der Ansichtsmodus des Fensters ändert.

Weitere Informationen zu Zustandstriggern finden Sie unter Zustandstrigger.

Span-Modus-Zustandstrigger

Ein SpanModeStateTrigger löst eine VisualState-Änderung aus, wenn sich der Span-Modus des angefügten Layouts ändert. Dieser Trigger hat eine einzelne bindbare Eigenschaft:

Hinweis

SpanModeStateTrigger ist von der Klasse StateTriggerBase abgeleitet und kann daher einen Ereignishandler an das Ereignis IsActiveChanged anfügen.

Im folgenden XAML-Beispiel wird ein Grid mit SpanModeStateTrigger-Objekten veranschaulicht:

<Grid>
    <VisualStateManager.VisualStateGroups>
        <VisualStateGroup>
            <VisualState x:Name="GridSingle">
                <VisualState.StateTriggers>
                    <dualScreen:SpanModeStateTrigger SpanMode="SinglePane"/>
                </VisualState.StateTriggers>
                <VisualState.Setters>
                    <Setter Property="BackgroundColor" Value="Green" />
                </VisualState.Setters>
            </VisualState>
            <VisualState x:Name="GridWide">
                <VisualState.StateTriggers>
                    <dualScreen:SpanModeStateTrigger SpanMode="Wide" />
                </VisualState.StateTriggers>
                <VisualState.Setters>
                    <Setter Property="BackgroundColor" Value="Red" />
                </VisualState.Setters>
            </VisualState>
            <VisualState x:Name="GridTall">
                <VisualState.StateTriggers>
                    <dualScreen:SpanModeStateTrigger SpanMode="Tall" />
                </VisualState.StateTriggers>
                <VisualState.Setters>
                    <Setter Property="BackgroundColor" Value="Purple" />
                </VisualState.Setters>
            </VisualState>
        </VisualStateGroup>
    </VisualStateManager.VisualStateGroups>
    ...
</Grid>

In diesem Beispiel werden visuelle Zustände für ein Grid-Objekt festgelegt. Die Hintergrundfarbe für das Grid ist grün, wenn nur ein Bereich angezeigt wird. Sie ist rot, wenn Bereiche nebeneinander angezeigt werden, und sie ist lila, wenn Bereiche übereinander angezeigt werden.

Zustandstrigger für Span-Modus des Fensters

Ein WindowSpanModeStateTrigger löst eine VisualState-Änderung aus, wenn sich der Span-Modus des Fensters ändert. Dieser Trigger hat eine einzelne bindbare Eigenschaft:

Hinweis

WindowSpanModeStateTrigger ist von der Klasse StateTriggerBase abgeleitet und kann daher einen Ereignishandler an das Ereignis IsActiveChanged anfügen.

Im folgenden XAML-Beispiel wird ein Grid mit WindowSpanModeStateTrigger-Objekten veranschaulicht:

<Grid>
    <VisualStateManager.VisualStateGroups>
        <VisualStateGroup>
            <VisualState x:Name="NotSpanned">
                <VisualState.StateTriggers>
                    <dualScreen:WindowSpanModeStateTrigger SpanMode="SinglePane"/>
                </VisualState.StateTriggers>
                <VisualState.Setters>
                    <Setter Property="BackgroundColor" Value="Red" />
                </VisualState.Setters>
            </VisualState>
            <VisualState x:Name="Spanned">
                <VisualState.StateTriggers>
                    <dualScreen:WindowSpanModeStateTrigger SpanMode="Wide" />
                </VisualState.StateTriggers>
                <VisualState.Setters>
                    <Setter Property="BackgroundColor" Value="Green" />
                </VisualState.Setters>
            </VisualState>
                <VisualState x:Name="Tall">
                    <VisualState.StateTriggers>
                        <dualScreen:WindowSpanModeStateTrigger SpanMode="Tall" />
                    </VisualState.StateTriggers>
                    <VisualState.Setters>
                        <Setter Property="BackgroundColor" Value="Yellow" />
                    </VisualState.Setters>
                </VisualState>
        </VisualStateGroup>
    </VisualStateManager.VisualStateGroups>
    ...
</Grid>

In diesem Beispiel werden visuelle Zustände für ein Grid-Objekt festgelegt. Die Hintergrundfarbe für das Grid ist rot, wenn nur ein Bereich angezeigt wird. Sie ist grün, wenn Bereiche nebeneinander angezeigt werden, und sie ist gelb, wenn Bereiche übereinander angezeigt werden.