调整应用程序大小时显示消息答案

【问题标题】：display a message when the application is resized调整应用程序大小时显示消息
【发布时间】：2016-04-01 21:25:32
【问题描述】：

我是 C# 通用应用程序世界的新手，我试图让我的界面响应并在屏幕小于 600 时收到此消息：

可以用触发器做到这一点吗？感谢帮助

【问题讨论】：

标签： xaml c#-4.0 win-universal-app windows-10-universal

【解决方案1】：

您可以直接在 Windows 10 中使用 XAML。只需在您的设计中指定 gridInstruction 并将其可见性设置为 collapsed。现在使用基于屏幕宽度的自适应触发器将其可见性设置为可见或折叠。

<VisualStateManager.VisualStateGroups>
            <VisualStateGroup x:Name="WindowStates">
                <VisualState x:Name="WideState">
                    <VisualState.StateTriggers>
                        <AdaptiveTrigger MinWindowWidth="600" />
                    </VisualState.StateTriggers>
                    <VisualState.Setters>
                        <Setter Target="gridInstruction.Visibility" Value="Collapsed" />                        
                    </VisualState.Setters>
                </VisualState>
                <VisualState x:Name="NarrowState">
                    <VisualState.StateTriggers>
                        <AdaptiveTrigger MinWindowWidth="0" />
                    </VisualState.StateTriggers>
                    <VisualState.Setters>
                        <Setter Target="gridInstruction.Visibility" Value="Visible" />                        
                    </VisualState.Setters>
                </VisualState>
            </VisualStateGroup>
        </VisualStateManager.VisualStateGroups>

【讨论】：

【解决方案2】：

您可以为此创建自定义 StateTrigger：

public enum LayoutStateType
{
    TooSmall, BigEnough
}

public class LayoutTrigger : StateTriggerBase
{
    public static readonly DependencyProperty MinimalStateWidthProperty = DependencyProperty.Register("MinimalStateWidth", typeof(double), typeof(LayoutTrigger), new PropertyMetadata(600.0, OnTriggerPropertyChanged));

    public static readonly DependencyProperty LayoutStateProperty = DependencyProperty.Register("LayoutState", typeof(LayoutStateType), typeof(LayoutTrigger), new PropertyMetadata(LayoutStateType.Landscape, OnTriggerPropertyChanged));

    public LayoutTrigger()
    {
        Window.Current.SizeChanged += Window_SizeChanged;
        UpdateTrigger();
    }

    public double MinimalStateWidth
    {
        get
        {
            return (double)GetValue(MinimalStateWidthProperty);
        }

        set
        {
            SetValue(MinimalStateWidthProperty, value);
        }
    }

    public LayoutStateType LayoutState
    {
        get
        {
            return (LayoutStateType)GetValue(LayoutStateProperty);
        }

        set
        {
            SetValue(LayoutStateProperty, value);
        }
    }

    private static void OnTriggerPropertyChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
    {
        var trigger = d as LayoutTrigger;
        trigger.UpdateTrigger();
    }

    private void Window_SizeChanged(object sender, WindowSizeChangedEventArgs e)
    {
        UpdateTrigger();
    }

    private void UpdateTrigger()
    {
        switch (LayoutState)
        {
            case LayoutStateType.TooSmall:
                if (Window.Current.Bounds.Width <= MinimalStateWidth)
                {
                    SetActive(true);
                }
                else
                {
                    SetActive(false);
                }

                break;
            case LayoutStateType.BigEnough:
            default:
                if (Window.Current.Bounds.Width > MinimalStateWidth)
                {
                    SetActive(false);
                }
                else
                {
                    SetActive(true);
                }

                break;
        }
    }
}

您可以使用此状态触发器来设置视觉状态。

XAML 用法：

<Grid>
    <VisualStateManager.VisualStateGroups>
        <!--  Visual states reflect the application's view state  -->
        <VisualStateGroup x:Name="ApplicationViewStates">
            <VisualState x:Name="DefaultLayout">
                <VisualState.StateTriggers>
                    <triggers:LayoutTrigger LayoutState="TooSmall" />
                </VisualState.StateTriggers>
            </VisualState>
            <VisualState x:Name="PortraitLayout">
                <VisualState.StateTriggers>
                    <triggers:LayoutTrigger LayoutState="BigEnough" />
                </VisualState.StateTriggers>
            </VisualState>
        </VisualStateGroup>
    </VisualStateManager.VisualStateGroups>
</Grid Style="{StaticResource LayoutRootStyle}">

在“太小”的视觉状态下，隐藏你想要隐藏的任何内容并显示你的信息

【讨论】：