Question

实际上是否可以在VisualState中使用带有Setters Value属性的绑定，因为当我尝试使用x时：绑定页面的初始视图不使用绑定并且绑定页面不会使用它们或者执行我需要做些额外的事情吗？

例如，如果我使用下面的布局并且我启动宽度介于400-800之间的应用程序，则PassInput Passwordbox将没有占位符。当我将窗口调整到800以上，然后返回时，它最终会有占位符。

实施例：

<Page
    x:Class="UWP.Learning.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    x:Name="Page">
    <RelativePanel Background="White">
        <VisualStateManager.VisualStateGroups>
            <VisualStateGroup x:Name="WindowSizeStates">
                <VisualState x:Name="SmallState">
                    <VisualState.StateTriggers>
                        <AdaptiveTrigger MinWindowWidth="400" />
                    </VisualState.StateTriggers>
                    <VisualState.Setters>
                        <Setter Target="PassInput.PlaceholderText" Value="{x:Bind MyPlaceHolder, Mode=OneWay}" />
                    </VisualState.Setters>
                </VisualState>
                <VisualState x:Name="WideState">
                    <VisualState.StateTriggers>
                        <AdaptiveTrigger MinWindowWidth="800" />
                    </VisualState.StateTriggers>
                    <VisualState.Setters>
                        <Setter Target="PassInput.PlaceholderText" Value="{x:Null}" />
                    </VisualState.Setters>
                </VisualState>
            </VisualStateGroup>
        </VisualStateManager.VisualStateGroups>
        <TextBlock
            Name="PassLabel"
             RelativePanel.AlignTopWithPanel="True"
             RelativePanel.AlignLeftWithPanel="True"
             RelativePanel.AlignRightWithPanel="True"
             Text="Pass input label"
             HorizontalAlignment="Center" />
        <PasswordBox
             Name="PassInput"
             RelativePanel.AlignLeftWithPanel="True"
             RelativePanel.AlignRightWithPanel="True"
             RelativePanel.Below="PassLabel"
             VerticalAlignment="Center"
             Margin="20,0" />
    </RelativePanel>
</Page>

代码背后：

namespace UWP.Learning
{
    using Windows.UI.Xaml.Controls;

    public sealed partial class MainPage : Page
    {
        public MainPage() { this.InitializeComponent(); }
        public string MyPlaceHolder => "FOOBAR";
    }
}

Answer 1

对我来说看起来像个错误。一个简单的解决方法是在Loaded事件中进行一次性检查。

Loaded += (s, e) =>
{
    switch (ActualWidth)
    {
        case var w when (w >= 400 && w < 800):
            VisualStateManager.GoToState(this, "SmallState", false);
            break;
        case var w when (w >= 800):
            VisualStateManager.GoToState(this, "WideState", false);
            break;
    }
};

VisualState Setter中的UWP绑定

1 个答案: