Xaml WPF样式的UWP等效触发器

我创建了一个在WPF中工作的控件，现在尝试移植到UWP

该控件公开一个布尔属性，当设置为true时，我通过故事板更改路径（笔划）的背景颜色，重复行为为“永远”

在阅读了大量文章后，我了解到UWP使用了可视状态、交互性等。。。但是没有触发器。我尝试过重新编写代码，但没有改变背景/设置动画

WPF中ControlTemplate的一部分

 <Path Fill="Transparent"
      Stroke="{TemplateBinding Outline}"
      StrokeThickness="{TemplateBinding Thickness}"
      StrokeDashCap="Flat"
      x:Name="OuterRing">
    <Path.Data>
        <PathGeometry>
            <PathGeometry.Figures>
                <PathFigureCollection>
                    <PathFigure x:Name="OutlineFigurePart">
                        <PathFigure.Segments>
                            <PathSegmentCollection>
                                <ArcSegment x:Name="OutlineArcPart" IsLargeArc="True" SweepDirection="Clockwise"/>
                            </PathSegmentCollection>
                        </PathFigure.Segments>
                    </PathFigure>
                </PathFigureCollection>
            </PathGeometry.Figures>
        </PathGeometry>
    </Path.Data>

    <Path.Style>
        <Style TargetType="Path">
            <Style.Triggers>
                <DataTrigger Binding="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=controls:MyControl}, Path=IsValueOutOfRange}" Value="True">
                    <DataTrigger.EnterActions>
                        <BeginStoryboard>
                            <Storyboard>
                                <ColorAnimation To="Red" 
                                                AutoReverse="True"
                                                Duration="0:0:0.8" 
                                                RepeatBehavior="Forever"
                                                Storyboard.TargetProperty="(Path.Stroke).(SolidColorBrush.Color)"
                                                Storyboard.TargetName="OuterRing"/>
                            </Storyboard>
                        </BeginStoryboard>
                    </DataTrigger.EnterActions>
                    <DataTrigger.ExitActions>
                        <BeginStoryboard>
                            <Storyboard>
                                <ColorAnimation To="LightGray" 
                                                Storyboard.TargetProperty="(Path.Stroke).(SolidColorBrush.Color)" 
                                                Duration="0:0:0.8"
                                                FillBehavior="Stop"
                                                Storyboard.TargetName="OuterRing"/>
                            </Storyboard>
                        </BeginStoryboard>
                    </DataTrigger.ExitActions>
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </Path.Style>
</Path>

视图中使用的控件（XAML）

当从ViewModel中将ValueOutOfRange设置为“True”时，Path.Stroke颜色应在“OuterRing”上设置动画

当ViewModel中的ValueOutOfRange设置为“False”时，Path.Stroke颜色应恢复正常

UWP中控制模板的一部分

<Path Fill="Transparent"
      Stroke="{TemplateBinding Outline}"
      StrokeThickness="{TemplateBinding Thickness}"
      StrokeDashCap="Flat"
      x:Name="OuterRing">
    <Path.Data>
        <PathGeometry>
            <PathGeometry.Figures>
                <PathFigureCollection>
                    <PathFigure x:Name="OutlineFigurePart">
                        <PathFigure.Segments>
                            <PathSegmentCollection>
                                <ArcSegment x:Name="OutlineArcPart" IsLargeArc="True" SweepDirection="Clockwise"/>
                            </PathSegmentCollection>
                        </PathFigure.Segments>
                    </PathFigure>
                </PathFigureCollection>
            </PathGeometry.Figures>
        </PathGeometry>
    </Path.Data>

    <interactivity:Interaction.Behaviors>
        <core:DataTriggerBehavior Binding="{TemplateBinding IsValueOutOfRange}" Value="True" ComparisonCondition="Equal">
            <media:ControlStoryboardAction ControlStoryboardOption="Play">
                <media:ControlStoryboardAction.Storyboard>
                    <Storyboard>
                        <ColorAnimation
                            To="Red" 
                            Storyboard.TargetName="OuterRing" 
                            Storyboard.TargetProperty="(Path.Stroke).(SolidColorBrush.Color)" 
                            AutoReverse="True" 
                            Duration="0:0:8"
                            RepeatBehavior="Forever" />
                    </Storyboard>
                </media:ControlStoryboardAction.Storyboard>
            </media:ControlStoryboardAction>
        </core:DataTriggerBehavior>
    </interactivity:Interaction.Behaviors>
</Path>

---

在UWP中，更常见的方法是使用

VisualStateManager

处理：

根据您的代码，它可以这样重写：

代码隐藏

public bool是valueoutofrange
{
获取{return（bool）GetValue（IsValueOutOfRangeProperty）；}
set{SetValue（IsValueOutOfRangeProperty，value）；}
}
//使用DependencyProperty作为IsValueOutOfRange的备份存储。这将启用动画、样式、绑定等。。。
public static readonly dependencProperty是ValueOutofRangeProperty=
DependencyProperty.Register（“IsValueOutOfRange”、typeof（bool）、typeof（PathCustomControl）、new PropertyMetadata（false、new PropertyChangedCallback（IsValueOutOfRange_Changed））；
private static void IsValueOutofRange_已更改（DependencyObject d、DependencyPropertyChangedEventArgs e）
{
如果（例如，新值为bool isOut）
{
var instance=d作为PathCustomControl；
如果（isOut）
VisualStateManager.GoToState（实例，“无效”，false）；
其他的
VisualStateManager.GoToState（实例，“正常”，false）；
}
}

模板

当

IsValueOutOfRange

更改时，它会将控件切换到不同的状态，从而运行不同的动画

这只是一个例子，我使用设备上的一个按钮来切换控件的状态，它可以工作。但是，如果要调整项目，则需要满足以下两个条件：

提供初始

行程

值

首次加载控件时，默认的

IsValueOutOfRange

为

False

，因此

路径的默认颜色应与
正常状态相同

---

您好，到目前为止，您还应该包括部分UWP控件，以显示您的尝试。@corentpane谢谢。已经添加了部分UWP控制。由@Richard Zhang提供的答案非常有效。经过数小时的尝试理解VisualStateManager后，发现缺少的部分是IsValueOutofRange_Changed方法。谢谢你，理查德！值得一提的是，这是一个从控件派生的自定义控件，UI在资源字典中定义。在我的ControlTemplate中，我将某些元素包装在一个ViewBox中，由于某种原因，VisualStateManager没有启动。我有两个控制装置，一个起作用，另一个不起作用。几个小时后，我拉扯头发，将VisuaStateManager移到ViewBox之外，一切都按预期开始工作。

<Path Fill="Transparent"
      Stroke="{TemplateBinding Outline}"
      StrokeThickness="{TemplateBinding Thickness}"
      StrokeDashCap="Flat"
      x:Name="OuterRing">
    <Path.Data>
        <PathGeometry>
            <PathGeometry.Figures>
                <PathFigureCollection>
                    <PathFigure x:Name="OutlineFigurePart">
                        <PathFigure.Segments>
                            <PathSegmentCollection>
                                <ArcSegment x:Name="OutlineArcPart" IsLargeArc="True" SweepDirection="Clockwise"/>
                            </PathSegmentCollection>
                        </PathFigure.Segments>
                    </PathFigure>
                </PathFigureCollection>
            </PathGeometry.Figures>
        </PathGeometry>
    </Path.Data>

    <interactivity:Interaction.Behaviors>
        <core:DataTriggerBehavior Binding="{TemplateBinding IsValueOutOfRange}" Value="True" ComparisonCondition="Equal">
            <media:ControlStoryboardAction ControlStoryboardOption="Play">
                <media:ControlStoryboardAction.Storyboard>
                    <Storyboard>
                        <ColorAnimation
                            To="Red" 
                            Storyboard.TargetName="OuterRing" 
                            Storyboard.TargetProperty="(Path.Stroke).(SolidColorBrush.Color)" 
                            AutoReverse="True" 
                            Duration="0:0:8"
                            RepeatBehavior="Forever" />
                    </Storyboard>
                </media:ControlStoryboardAction.Storyboard>
            </media:ControlStoryboardAction>
        </core:DataTriggerBehavior>
    </interactivity:Interaction.Behaviors>
</Path>