Поделиться через

Триггеры двухэкранного режима в Xamarin.Forms

  • Статья

Пространство имен Xamarin.Forms.DualScreen содержит два триггера состояния:

  • SpanModeStateTrigger активирует изменение VisualState при изменении режима просмотра присоединенного макета.
  • WindowSpanModeStateTrigger активирует изменение VisualState при изменении режима просмотра окна.

Дополнительные сведения о триггерах состояния см. в разделе Триггеры состояния.

Триггер состояния режима интервала

SpanModeStateTrigger активирует изменение VisualState при изменении режима интервала присоединенного макета. У этого триггера одно привязываемое свойство:

Примечание.

SpanModeStateTrigger является производным от класса StateTriggerBase и может присоединить обработчик событий к событию IsActiveChanged.

В следующем примере XAML показан элемент Grid, предусматривающий объекты SpanModeStateTrigger:

<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>

В этом примере визуальные состояния задаются в объекте Grid. Цвет фона Grid является зеленым, когда отображается только одна панель, красным, когда панели отображаются рядом друг с другом, и сиреневым, когда панели отображаются сверху вниз.

Триггер состояния режима интервала окна

WindowSpanModeStateTrigger активирует изменение VisualState при изменении режима интервала окна. У этого триггера одно привязываемое свойство:

Примечание.

WindowSpanModeStateTrigger является производным от класса StateTriggerBase и может присоединить обработчик событий к событию IsActiveChanged.

В следующем примере XAML показан элемент Grid, предусматривающий объекты WindowSpanModeStateTrigger:

<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>

В этом примере визуальные состояния задаются в объекте Grid. Цвет фона Grid является красным, когда отображается только одна панель, зеленым, когда панели отображаются рядом друг с другом, и желтым, когда панели отображаются сверху вниз.