[template10] 中的新视觉状态答案

【问题标题】：new visualstate in [template10][template10] 中的新视觉状态
【发布时间】：2017-01-31 02:47:27
【问题描述】：

如何修改模板 10 中默认视觉状态的条件？

我希望能够区分手机上的横向模式与 PC 或平板电脑上的窗口模式。

NormalMinWidth 通过将手机置于横向模式来触发。问题是横屏模式下的手机屏幕高度可能远低于平板电脑或个人电脑。

我希望能够在手机上与 PC 或平板电脑上为 NormalMinWidth 设置不同的布局。例如，我想添加另一个视觉状态 NormalMinWidthMinHeight 来寻找最小屏幕高度。

任何建议将不胜感激。

【问题讨论】：

标签： uwp uwp-xaml template10

【解决方案1】：

您需要实现允许动态更改状态的代码。

例如，如果您要根据当前视图的方向更改状态。您需要为OrientationChanged 事件实现事件处理程序，并使用VisualStateManager 类的GoToState 方法。

请参考以下代码示例：

<VisualStateManager.VisualStateGroups>
        <VisualStateGroup x:Name="AdaptiveVisualStateGroup">

            <VisualState x:Name="VisualMinWidthHeight">
                <VisualState.Setters>
                    <Setter Target="stateTextBox.Text" Value="Visual Min Width Height" />
                </VisualState.Setters>
            </VisualState>
        </VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<TextBlock x:Name="stateTextBox" Text="Current Visual State" />

DisplayInformation.GetForCurrentView().OrientationChanged += MainPage_OrientationChanged;

private void MainPage_OrientationChanged(DisplayInformation info, object args)
{
    Debug.WriteLine("orientation: " + info.CurrentOrientation);
    if (info.CurrentOrientation == DisplayOrientations.LandscapeFlipped || info.CurrentOrientation == DisplayOrientations.Landscape)
    {
        VisualStateManager.GoToState(this, "VisualMinWidthHeight", true);
    }
}

【讨论】：

感谢您的回答。我认为 a 没有很好地解释这个问题。在 Template10 框架中，哪里有调用 VisualStateManager.GoToState 的代码？我可以延长这个吗？我不想在每个页面中都放代码来监听视觉状态的变化并调用 GotoState。我虽然这可能在引导程序中，但我没有在那里看到它。
@Sully 没关系。上面的代码只是一个简单的解决方案或建议。仅供您参考。您还可以扩展 StateTriggerBase 以创建您自己的自定义触发器并在 StateTriggers 属性中使用它们。 State triggers sample 告诉您如何制作自定义触发器。详情可以参考。