WPF-XAML-从父样式调用嵌套样式的动画

伊恩·卡森(Ian Carson)

我正在尝试将ItemsControl修改为具有水印,以指示掉入其中的内容的行为。

我在VisualBrush中使用一个Label来显示单词“ OR”作为ItemsControl的背景(控件将包含将与在一起的属性过滤器)。背景更改由ItemsControl上的IsMouseOver触发。

问题是这样的:如果我直接在Label中设置不透明度,则可以使我的VisualBrush(请参阅xaml)显示/消失,但是如果尝试为标签使用嵌套样式,则无法使Opacity进行动画处理。我尝试了几种方法都没有成功,因此很高兴收到关于我的错误的任何提示。

我已经包括(已注释掉)我尝试过的两个动画。我还尝试使用ColorAnimation在Label上设置前景,但未成功。

非常感谢Ian Carson

<ItemsControl x:Name="OrFilterItemsTarget"
              ItemsSource="{Binding Assets.OrFilters}"
              ItemTemplateSelector="{StaticResource FilterTargetTemplateSelector}"
              ItemContainerStyle="{StaticResource DraggableItemStyle}"
              BorderThickness="0,0,0,0.5"
              BorderBrush="DimGray"
              AllowDrop="True"
              IsHitTestVisible="True"
              Margin="0,2.95,15.934,77"
              HorizontalAlignment="Right"
              Width="105">
    <ItemsControl.Style>
        <Style TargetType="{x:Type ItemsControl}">
            <Style.Resources>
                <Style x:Key="LabelStyle"
                       TargetType="{x:Type Label}">
                    <Style.Resources>
                        <Storyboard x:Key="FadeUp">
                            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00"
                                                          Storyboard.TargetProperty="Opacity"
                                                          FillBehavior="HoldEnd">
                                <SplineDoubleKeyFrame KeyTime="00:00:2"
                                                     Value="0.5" />
                            </DoubleAnimationUsingKeyFrames>
                            <!--<DoubleAnimation Storyboard.TargetProperty="Opacity"
                                             From="0" To="0.5"
                                             Duration="0:0:2" />-->
                        </Storyboard>
                        <Storyboard x:Key="FadeDown">
                            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00"
                                                           Storyboard.TargetProperty="Opacity"
                                                           FillBehavior="Stop">
                                <SplineDoubleKeyFrame KeyTime="00:00:2"
                                                      Value="0" />
                            </DoubleAnimationUsingKeyFrames>
                            <!--<DoubleAnimation Storyboard.TargetProperty="Opacity"
                                             From="0.5" To="0"
                                             Duration="0:0:2" />-->
                        </Storyboard>
                    </Style.Resources>
                    <Style.Triggers>
                        <DataTrigger Binding="{Binding Path=IsMouseOver, ElementName=OrFilterItemsTarget}"
                                     Value="True">
                            <DataTrigger.EnterActions>
                                <BeginStoryboard Storyboard="{StaticResource FadeUp}" />
                            </DataTrigger.EnterActions>
                        </DataTrigger>
                        <DataTrigger  Binding="{Binding Path=IsMouseOver, ElementName=OrFilterItemsTarget}"
                                      Value="False">
                            <DataTrigger.EnterActions>
                                <BeginStoryboard Storyboard="{StaticResource FadeDown}" />
                            </DataTrigger.EnterActions>
                        </DataTrigger>
                    </Style.Triggers>
                </Style>
                <VisualBrush x:Key="FilterContentType"
                             AlignmentX="Center"
                             AlignmentY="Center"
                             Stretch="None">
                    <VisualBrush.Visual>
                        <Label Content="OR"
                               Foreground="DarkGray"
                               Style="{StaticResource LabelStyle}">
                        </Label>
                    </VisualBrush.Visual>
                </VisualBrush>
            </Style.Resources>
            <Style.Triggers>
                <Trigger Property="IsMouseOver"
                         Value="True">
                    <Setter Property="Background"
                            Value="{StaticResource FilterContentType}" />
                </Trigger>
                <Trigger Property="IsMouseOver"
                         Value="False">
                    <Setter Property="Background"
                            Value="Transparent" />
                </Trigger>
            </Style.Triggers>
        </Style>
    </ItemsControl.Style>
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <WrapPanel Orientation="Horizontal"
                       Background="Transparent">
                <i:Interaction.Behaviors>
                    <ei:FluidMoveBehavior AppliesTo="Children"
                                          Duration="0:0:0.3">
                        <ei:FluidMoveBehavior.EaseY>
                            <BackEase EasingMode="EaseIn"
                                      Amplitude="0.1" />
                        </ei:FluidMoveBehavior.EaseY>
                    </ei:FluidMoveBehavior>
                </i:Interaction.Behaviors>
            </WrapPanel>
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
</ItemsControl>
伊恩·卡森(Ian Carson)

最后,我意识到自己对这个问题的思考过多了。嵌套样式是不必要的。解决方案是在ItemsControl内自己的标签内将背景设置为VisualBrush(其内容设置为所需的最终外观),然后直接在ItemsControl上使用EventTriggers对VisualBrush的不透明度进行动画处理。请注意管理鼠标和拖动用户活动的各种事件。

感谢任何正在考虑此问题的人。最终的XAML看起来像这样,希望对某人有用。

 <ItemsControl x:Name="OrFilterItemsTarget"
               ItemsSource="{Binding Assets.OrFilters}"
               ItemTemplateSelector="{StaticResource FilterTargetTemplateSelector}"
               ItemContainerStyle="{StaticResource DraggableItemStyle}"
               BorderThickness="0,0,0,0.5"
               BorderBrush="DimGray"
               AllowDrop="True"
               IsHitTestVisible="True"
               Margin="0,2.95,15.934,77"
               HorizontalAlignment="Right"
               Width="105">
     <ItemsControl.Background>
         <VisualBrush x:Name="OrFilterContentType"
                      AlignmentX="Center"
                      AlignmentY="Center"
                      Stretch="None"
                      Opacity="0">
             <VisualBrush.Visual>
                 <Label Content="OR"
                        Foreground="DarkGray"
                        Opacity="0.5" />
             </VisualBrush.Visual>
         </VisualBrush>
     </ItemsControl.Background>
     <ItemsControl.Triggers>
         <EventTrigger RoutedEvent="ItemsControl.MouseEnter">
             <EventTrigger.Actions>
                 <BeginStoryboard>
                     <Storyboard>
                         <DoubleAnimation Storyboard.TargetName="OrFilterContentType"
                                          Storyboard.TargetProperty="(Brush.Opacity)"
                                          From="0" To="1"
                                          Duration="0:0:0.7" />
                     </Storyboard>
                 </BeginStoryboard>
             </EventTrigger.Actions>
         </EventTrigger>
         <EventTrigger RoutedEvent="ItemsControl.DragEnter">
             <EventTrigger.Actions>
                 <BeginStoryboard>
                     <Storyboard>
                         <DoubleAnimation Storyboard.TargetName="OrFilterContentType"
                                          Storyboard.TargetProperty="(Brush.Opacity)"
                                          From="0"
                                          To="1"
                                          Duration="0:0:0.7" />
                     </Storyboard>
                 </BeginStoryboard>
             </EventTrigger.Actions>
         </EventTrigger>
         <EventTrigger RoutedEvent="ItemsControl.MouseLeave">
             <EventTrigger.Actions>
                 <BeginStoryboard>
                     <Storyboard>
                         <DoubleAnimation Storyboard.TargetName="OrFilterContentType"
                                          Storyboard.TargetProperty="(Brush.Opacity)"
                                          From="1" To="0"
                                          Duration="0:0:0.7" />
                     </Storyboard>
                 </BeginStoryboard>
             </EventTrigger.Actions>
         </EventTrigger>
         <EventTrigger RoutedEvent="ItemsControl.DragLeave">
             <EventTrigger.Actions>
                 <BeginStoryboard>
                     <Storyboard>
                         <DoubleAnimation Storyboard.TargetName="OrFilterContentType"
                                          Storyboard.TargetProperty="(Brush.Opacity)"
                                          From="1"
                                          To="0"
                                          Duration="0:0:0.7" />
                     </Storyboard>
                 </BeginStoryboard>
             </EventTrigger.Actions>
         </EventTrigger>
         <EventTrigger RoutedEvent="ItemsControl.Drop">
             <EventTrigger.Actions>
                 <BeginStoryboard>
                     <Storyboard>
                         <DoubleAnimation Storyboard.TargetName="OrFilterContentType"
                                          Storyboard.TargetProperty="(Brush.Opacity)"
                                          From="1"
                                          To="0"
                                          Duration="0:0:0.7" />
                     </Storyboard>
                 </BeginStoryboard>
             </EventTrigger.Actions>
         </EventTrigger>
     </ItemsControl.Triggers>
     <ItemsControl.ItemsPanel>
         <ItemsPanelTemplate>
             <WrapPanel Orientation="Horizontal"
                        Background="Transparent">
                 <i:Interaction.Behaviors>
                     <ei:FluidMoveBehavior AppliesTo="Children"
                                           Duration="0:0:0.3">
                         <ei:FluidMoveBehavior.EaseY>
                             <BackEase EasingMode="EaseIn"
                                       Amplitude="0.1" />
                         </ei:FluidMoveBehavior.EaseY>
                     </ei:FluidMoveBehavior>
                 </i:Interaction.Behaviors>
             </WrapPanel>
         </ItemsPanelTemplate>
     </ItemsControl.ItemsPanel>
 </ItemsControl>

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

WPF ToggleButton XAML样式

来自分类Dev

WPF XAML样式复选框模板

来自分类Dev

在WPF中启动XAML动画

来自分类Dev

从WPF XAML中的继承样式更改控件的属性

来自分类Dev

WPF XAML DataGridTemplateColumn中的标签无效的选择样式

来自分类Dev

提取相同的属性以在WPF XAML中进行样式设置

来自分类Dev

在WPF中对XAML元素进行组样式设置

来自分类Dev

WPF / XAML事件处理程序与视图模型的样式绑定

来自分类Dev

App.xaml中基于ResourceDictionary的WPF样式

来自分类Dev

在 App.xaml 样式 WPF 中访问用户控件属性

来自分类Dev

C# WPF 以 XAML 样式指定文件夹

来自分类Dev

WPF-动态加载的XAML中的动画

来自分类Dev

WPF-动态加载的XAML中的动画

来自分类Dev

WPF:将变量从父xaml传递到usercontrol

来自分类Dev

嵌套样式WPF上的异常

来自分类Dev

WPF XAML-向目标行定义的资源字典中添加多种样式

来自分类Dev

来自XAML中不同属性的WPF DataGrid单元格样式

来自分类Dev

来自XAML中不同属性的WPF DataGrid单元格样式

来自分类Dev

如何为复选框图像创建自定义WPF XAML样式

来自分类Dev

是否有任何工具可以为 wpf (xaml) 中的复杂控件创建实时样式

来自分类Dev

WPF XAML 在鼠标悬停时动画/闪烁按钮

来自分类Dev

在WPF中重构XAML

来自分类Dev

XAML文件(WPF)的编译

来自分类Dev

WPF重用XAML资源

来自分类Dev

WPF松散XAML ResourceDictionary

来自分类Dev

WPF重用XAML资源

来自分类Dev

XAML文件(WPF)的编译

来自分类Dev

WPF XAML解析异常?

来自分类Dev

WPF XAML数据绑定