UWP 状态触发器绑定答案

【问题标题】：UWP StateTrigger BindingUWP 状态触发器绑定
【发布时间】：2016-09-12 16:00:54
【问题描述】：

我正在编写一个使用 Visual States 的 UWP 应用，但在将 IsActive 绑定到 StateTrigger 时遇到问题。

我们正在使用 MVVM，我需要能够更改 VisualState 的状态。

我现在的例子：

XAML

<Page
   ...
   >

    <Page.Resources>
        <local:InvBoolConverter x:Key="InvBoolConverter" />
    </Page.Resources>

    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}" x:Name="MainGrid">
        <VisualStateManager.VisualStateGroups>
            <VisualStateGroup x:Name="textSwitcher">
                <VisualState>
                    <VisualState.StateTriggers>
                        <StateTrigger IsActive="{Binding IsRedTrigger, Converter={StaticResource InvBoolConverter}}" />
                    </VisualState.StateTriggers>
                    <VisualState.Setters>
                        <Setter Target="txtBlock.Foreground" Value="Blue" />
                    </VisualState.Setters>
                </VisualState>
                <VisualState>
                    <VisualState.StateTriggers>
                        <StateTrigger IsActive="{Binding IsRedTrigger}" />
                    </VisualState.StateTriggers>
                    <VisualState.Setters>
                        <Setter Target="txtBlock.Foreground" Value="Red" />
                    </VisualState.Setters>
                </VisualState>
            </VisualStateGroup>
        </VisualStateManager.VisualStateGroups>


        <StackPanel Orientation="Vertical">
            <Button Content="Switch" Command="SwitchClickCommand" />
        </StackPanel>

        <TextBlock x:Name="txtBlock" Margin="100" Foreground="Blue">My Text</TextBlock>
    </Grid>
</Page>

查看模型

namespace ...
{
    public class MainPageViewModel : BindableBase
    {

        public MainPageViewModel()
        {
            SwitchClickCommand = new DelegateCommand(_SwitchButtonClicked);
        }

        public readonly ICommand SwitchClickCommand;

        bool _IsRedTrigger;

        public bool IsRedTrigger
        {
            get { return _IsRedTrigger; }
            set
            {
                _IsRedTrigger = value;
                OnPropertyChanged();
            }
        }

        void SwitchButtonClicked()
        {
            IsRedTrigger = !IsRedTrigger;
        }
    }
}

除了 VisualState 实际上没有改变之外，一切似乎都正常工作。

我是否正确使用StateTrigger？

谢谢！

【问题讨论】：

你能把你的BindableBase的代码贴出来吗？由IsRedTrigger触发，你在这个BindableBase中完成了INotiftpropertyChanged的工作了吗？
我正在使用 Prism 的BindableBase，发现：https://github.com/PrismLibrary/Prism/blob/master/Source/Prism/Mvvm/BindableBase.cs。所以是的，它使用INotifyPropertyChanged 正确完成，并且被正确触发。

标签： c# xaml win-universal-app

【解决方案1】：

好的，您没有提到您使用 Prism 进行开发，现在我可以理解您的问题了。

Command="SwitchClickCommand" 无法使用，因为：

无法将文本值SwitchClickCommand 分配给Icommand 类型的属性Command。

我可以理解这可能是错字，因为您想清除帖子中的代码。我想问题实际上是您没有正确设置页面的DataContext。完成此操作后，您的代码在我身边完美运行：

<Page.Resources>
    <local:InvBoolConverter x:Key="InvBoolConverter" />
</Page.Resources>
<Page.DataContext>
    <local:MainPageViewModel x:Name="vm" />
</Page.DataContext>

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}" x:Name="MainGrid">
    <VisualStateManager.VisualStateGroups>
        <VisualStateGroup x:Name="textSwitcher">
            <VisualState>
                <VisualState.StateTriggers>
                    <StateTrigger IsActive="{Binding IsRedTrigger, Converter={StaticResource InvBoolConverter}}" />
                </VisualState.StateTriggers>
                <VisualState.Setters>
                    <Setter Target="txtBlock.Foreground" Value="Blue" />
                </VisualState.Setters>
            </VisualState>
            <VisualState>
                <VisualState.StateTriggers>
                    <StateTrigger IsActive="{Binding IsRedTrigger}" />
                </VisualState.StateTriggers>
                <VisualState.Setters>
                    <Setter Target="txtBlock.Foreground" Value="Red" />
                </VisualState.Setters>
            </VisualState>
        </VisualStateGroup>
    </VisualStateManager.VisualStateGroups>

    <StackPanel Orientation="Vertical">
        <Button Content="Switch" Command="{x:Bind vm.SwitchClickCommand}" />
    </StackPanel>

    <TextBlock x:Name="txtBlock" Margin="100" Foreground="Blue">My Text</TextBlock>
</Grid>

我把你的代码SwitchClickCommand = new DelegateCommand(_SwitchButtonClicked);改成了SwitchClickCommand = new DelegateCommand(SwitchButtonClicked);，这也是错字吗？

顺便说一下，我用的是Prism 6.0，我的操作系统版本是10586。

【讨论】：