C# ListView.ItemTemplate中的UWP-状态触发器

在我的ListView

ItemTemplate

中将

ColorAnimation

添加到

VisualStateManager

时遇到问题。VisualStateManager似乎没有更改其视觉状态

我在这里试图做的是启动一个

情节提要

，它将开始平滑地更改

矩形。只要其基础viewmodel的IsReady属性值更改，就在
列表ViewItem
上填充
颜色

我做错了什么？如何正确地做到这一点（最好没有无意义的用户控制）

这是XAML:

<Page
    x:Class="App1.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:App1"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <ListView ItemsSource="{x:Bind MyList}">
            <ListView.ItemTemplate>
                <DataTemplate x:DataType="local:B">
                    <UserControl>
                        <Grid>
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="group">
                                    <VisualState x:Name="state1">
                                        <VisualState.StateTriggers>
                                            <StateTrigger IsActive="{x:Bind IsReady, Mode=OneWay}"/>
                                        </VisualState.StateTriggers>
                                        <Storyboard>
                                            <ColorAnimation Duration="0:0:1.8" To="Red" Storyboard.TargetProperty="(Rectangle.Fill).(SolidColorBrush.Color)" Storyboard.TargetName="rect" />
                                        </Storyboard>
                                    </VisualState>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <Rectangle x:Name="rect" Fill="Blue" Width="20" Height="20" />
                        </Grid>
                    </UserControl>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
        <Button Click="Button_Click">Test</Button>
    </Grid>
</Page>

using System.Collections.ObjectModel;
using System.ComponentModel;
using System.Runtime.CompilerServices;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;

namespace App1
{
    public abstract class NotifyPropertyChangedBase : INotifyPropertyChanged
    {
        protected NotifyPropertyChangedBase()
        {
        }

        public event PropertyChangedEventHandler PropertyChanged;

        protected virtual void RaisePropertyChanged([CallerMemberName]string propertyName = null)
        {
            this.PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
        }
    }

    public class B : NotifyPropertyChangedBase
    {
        private bool isReady;
        public bool IsReady
        {
            get { return isReady; }
            set { if (isReady != value) { isReady = value; RaisePropertyChanged(); } }
        }
    }

    public sealed partial class MainPage : Page
    {
        public ObservableCollection<B> MyList { get; private set; } = new ObservableCollection<B>();

        public MainPage()
        {
            this.InitializeComponent();

            for (int i = 0; i < 10; i++)
            {
                MyList.Add(new B());
            }
        }

        private void Button_Click(object sender, RoutedEventArgs e)
        {
            MyList[2].IsReady = !MyList[2].IsReady;
        }
    }
}


试验

下面是隐藏的代码：

<Page
    x:Class="App1.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:App1"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <ListView ItemsSource="{x:Bind MyList}">
            <ListView.ItemTemplate>
                <DataTemplate x:DataType="local:B">
                    <UserControl>
                        <Grid>
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="group">
                                    <VisualState x:Name="state1">
                                        <VisualState.StateTriggers>
                                            <StateTrigger IsActive="{x:Bind IsReady, Mode=OneWay}"/>
                                        </VisualState.StateTriggers>
                                        <Storyboard>
                                            <ColorAnimation Duration="0:0:1.8" To="Red" Storyboard.TargetProperty="(Rectangle.Fill).(SolidColorBrush.Color)" Storyboard.TargetName="rect" />
                                        </Storyboard>
                                    </VisualState>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <Rectangle x:Name="rect" Fill="Blue" Width="20" Height="20" />
                        </Grid>
                    </UserControl>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
        <Button Click="Button_Click">Test</Button>
    </Grid>
</Page>

using System.Collections.ObjectModel;
using System.ComponentModel;
using System.Runtime.CompilerServices;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;

namespace App1
{
    public abstract class NotifyPropertyChangedBase : INotifyPropertyChanged
    {
        protected NotifyPropertyChangedBase()
        {
        }

        public event PropertyChangedEventHandler PropertyChanged;

        protected virtual void RaisePropertyChanged([CallerMemberName]string propertyName = null)
        {
            this.PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
        }
    }

    public class B : NotifyPropertyChangedBase
    {
        private bool isReady;
        public bool IsReady
        {
            get { return isReady; }
            set { if (isReady != value) { isReady = value; RaisePropertyChanged(); } }
        }
    }

    public sealed partial class MainPage : Page
    {
        public ObservableCollection<B> MyList { get; private set; } = new ObservableCollection<B>();

        public MainPage()
        {
            this.InitializeComponent();

            for (int i = 0; i < 10; i++)
            {
                MyList.Add(new B());
            }
        }

        private void Button_Click(object sender, RoutedEventArgs e)
        {
            MyList[2].IsReady = !MyList[2].IsReady;
        }
    }
}

使用System.Collections.ObjectModel；
使用系统组件模型；
使用System.Runtime.CompilerServices；
使用Windows.UI.Xaml；
使用Windows.UI.Xaml.Controls；
名称空间App1
{
公共抽象类NotifyPropertyChangedBase:INotifyPropertyChanged
{
受保护的NotifyPropertyChangedBase（）
{
}
公共事件属性更改事件处理程序属性更改；
受保护的虚拟void RaisePropertyChanged（[CallerMemberName]字符串propertyName=null）
{
this.PropertyChanged？.Invoke（this，newpropertychangedeventargs（propertyName））；
}
}
公共类B：NotifyPropertyChangedBase
{
私人住宅已准备就绪；
公共图书馆已经准备好了
{
获取{return isReady；}
设置{if（isReady！=value）{isReady=value；RaisePropertyChanged（）；}}
}
}
公共密封部分类主页面：第页
{
public ObservableCollection MyList{get；private set；}=new ObservableCollection（）；
公共主页（）
{
this.InitializeComponent（）；
对于（int i=0；i<10；i++）
{
添加（新的B（））；
}
}
私有无效按钮\u单击（对象发送者，路由目标e）
{
MyList[2]。IsReady=！MyList[2]。IsReady；
}
}
}
这里需要一个
用户控件。如你所见，如果没有它，我们可能会出错。为了管理可视状态，我们需要一个子类，然而，它不是一个子类，而是继承自

视觉状态有时对于您想要更改UI中某个区域的状态（该区域不是立即的子类）的场景非常有用。不能直接执行此操作，因为该方法的控制参数需要一个子类，该子类引用VisualStateManager作用的对象

我们建议您将自定义定义为要应用状态的其他内容（例如）的根目录或容器。然后，您可以调用并应用状态，而不管其余内容是否为

有关更多信息，请参见的下的非控件元素的视觉状态。
您的问题是什么？我用你的代码进行了测试，它在我这边运行得很好。@JayZuo MSFT，没有使用
UserControl
，我在MainPage.g.cs中的Set\u Windows\u UI\u Xaml\u StateTrigger\u IsActive中得到了
NullReferenceException