0

我有一个 ListBox，我想用彩色Rectangle滑出显示当前状态。

当项目是Selected 或 应该扩展时，它应该收缩MouseOver。Recangle

<ControlTemplate.Resources>
    <Storyboard x:Key="MoveOutStoryboard">
        <DoubleAnimation To="175"
                    Storyboard.TargetProperty="Width"
                    Storyboard.TargetName="AnimatingGrid">
            <DoubleAnimation.EasingFunction>
                <QuinticEase EasingMode="EaseOut" />
            </DoubleAnimation.EasingFunction>
        </DoubleAnimation>
        <ColorAnimation Storyboard.TargetName="ContentPresenter"
                Storyboard.TargetProperty="(TextElement.Foreground).(SolidColorBrush.Color)"
                To="White" />
    </Storyboard>

    <Storyboard x:Key="MoveInStoryboard">
        <DoubleAnimation To="16"
                    Storyboard.TargetProperty="Width"
                    Storyboard.TargetName="AnimatingGrid">
            <DoubleAnimation.EasingFunction>
                <QuinticEase EasingMode="EaseOut" />
            </DoubleAnimation.EasingFunction>
        </DoubleAnimation>
        <ColorAnimation Storyboard.TargetName="ContentPresenter"
                Storyboard.TargetProperty="(TextElement.Foreground).(SolidColorBrush.Color)"
                To="Black" />
    </Storyboard>
</ControlTemplate.Resources>

由于没有“或”多触发器，我想出了以下触发器：

<ControlTemplate.Triggers>
    <Trigger Property="IsMouseOver" Value="True">
        <Trigger.EnterActions>
            <BeginStoryboard Storyboard="{StaticResource MoveOutStoryboard}" />
        </Trigger.EnterActions>
    </Trigger>

    <Trigger Property="IsSelected" Value="True">
        <Trigger.EnterActions>
            <BeginStoryboard Storyboard="{StaticResource MoveOutStoryboard}" />
        </Trigger.EnterActions>
    </Trigger>

    <MultiTrigger>
        <MultiTrigger.Conditions>
            <Condition Property="IsMouseOver" Value="False" />
            <Condition Property="IsSelected" Value="False" />
        </MultiTrigger.Conditions>

        <MultiTrigger.EnterActions>
            <BeginStoryboard Storyboard="{StaticResource MoveInStoryboard}" />
        </MultiTrigger.EnterActions>
    </MultiTrigger>
</ControlTemplate.Triggers>

但不知何故，MoveOutStoryboard当我有最后一MultiTrigger组时，从未调用过，但我不知道为什么。

谢谢你的帮助。

4

2 回答 2

1

因为除非由同一个触发器启动，否则另一个动画无法控制属性，所以试试这个

            <Trigger Property="IsMouseOver"
                     Value="True">
                <Trigger.EnterActions>
                    <BeginStoryboard Storyboard="{StaticResource MoveOutStoryboard}" />
                </Trigger.EnterActions>
                <Trigger.ExitActions>
                    <BeginStoryboard Storyboard="{StaticResource MoveInStoryboard}" />
                </Trigger.ExitActions>
            </Trigger>
            <Trigger Property="IsSelected"
                     Value="True">
                <Trigger.EnterActions>
                    <BeginStoryboard Storyboard="{StaticResource MoveOutStoryboard}" />
                </Trigger.EnterActions>
                <Trigger.ExitActions>
                    <BeginStoryboard Storyboard="{StaticResource MoveInStoryboard}" />
                </Trigger.ExitActions>
            </Trigger>

如果您遇到鼠标悬停和 IsSelected 的问题，请使用此

            <Trigger Property="IsMouseOver"
                     Value="True">
                <Trigger.EnterActions>
                    <RemoveStoryboard BeginStoryboardName="moveIn2" />
                    <RemoveStoryboard BeginStoryboardName="moveOut2" />
                    <BeginStoryboard x:Name="moveOut1"
                                     Storyboard="{StaticResource MoveOutStoryboard}" />
                </Trigger.EnterActions>
                <Trigger.ExitActions>
                    <RemoveStoryboard BeginStoryboardName="moveIn2" />
                    <RemoveStoryboard BeginStoryboardName="moveOut2" />
                    <BeginStoryboard x:Name="moveIn1"
                                     Storyboard="{StaticResource MoveInStoryboard}" />
                </Trigger.ExitActions>
            </Trigger>
            <Trigger Property="IsSelected"
                     Value="True">
                <Trigger.EnterActions>
                    <RemoveStoryboard BeginStoryboardName="moveIn1" />
                    <RemoveStoryboard BeginStoryboardName="moveOut1" />
                    <BeginStoryboard x:Name="moveOut2"
                                     Storyboard="{StaticResource MoveOutStoryboard}" />
                </Trigger.EnterActions>
                <Trigger.ExitActions>
                    <RemoveStoryboard BeginStoryboardName="moveIn1" />
                    <RemoveStoryboard BeginStoryboardName="moveOut1" />
                    <BeginStoryboard x:Name="moveIn2"
                                     Storyboard="{StaticResource MoveInStoryboard}" />
                </Trigger.ExitActions>
            </Trigger>

还删除可能没有必要的多重触发器，或者您可以将删除情节提要方法与您的方法结合起来，这也应该有效。

编辑

这是您使用 RemoveStoryboard 的方法，这是有效的，我也测试过

    <ControlTemplate.Triggers>
        <Trigger Property="IsMouseOver"
                    Value="True">
            <Trigger.EnterActions>
                <RemoveStoryboard BeginStoryboardName="multi" />
                <RemoveStoryboard BeginStoryboardName="sel" />
                <BeginStoryboard x:Name="over"
                                    Storyboard="{StaticResource MoveOutStoryboard}" />
            </Trigger.EnterActions>
        </Trigger>

        <Trigger Property="IsSelected"
                    Value="True">
            <Trigger.EnterActions>
                <RemoveStoryboard BeginStoryboardName="multi" />
                <RemoveStoryboard BeginStoryboardName="over" />
                <BeginStoryboard x:Name="sel"
                                    Storyboard="{StaticResource MoveOutStoryboard}" />
            </Trigger.EnterActions>
        </Trigger>

        <MultiTrigger>
            <MultiTrigger.Conditions>
                <Condition Property="IsMouseOver"
                            Value="False" />
                <Condition Property="IsSelected"
                            Value="False" />
            </MultiTrigger.Conditions>

            <MultiTrigger.EnterActions>
                <RemoveStoryboard BeginStoryboardName="sel" />
                <RemoveStoryboard BeginStoryboardName="over" />
                <BeginStoryboard x:Name="multi"
                                    Storyboard="{StaticResource MoveInStoryboard}" />
            </MultiTrigger.EnterActions>
        </MultiTrigger>
    </ControlTemplate.Triggers>



或者这个，但这可能有问题，你可以在动画中看到一些快照

    <ControlTemplate.Triggers>
        <Trigger Property="IsMouseOver"
                    Value="True">
            <Trigger.EnterActions>
                <BeginStoryboard x:Name="over"
                                    Storyboard="{StaticResource MoveOutStoryboard}" />
            </Trigger.EnterActions>
            <Trigger.ExitActions>
                <RemoveStoryboard BeginStoryboardName="over" />
            </Trigger.ExitActions>
        </Trigger>

        <Trigger Property="IsSelected"
                    Value="True">
            <Trigger.EnterActions>
                <BeginStoryboard x:Name="sel"
                                    Storyboard="{StaticResource MoveOutStoryboard}" />
            </Trigger.EnterActions>
            <Trigger.ExitActions>
                <RemoveStoryboard BeginStoryboardName="sel" />
            </Trigger.ExitActions>
        </Trigger>

        <MultiTrigger>
            <MultiTrigger.Conditions>
                <Condition Property="IsMouseOver"
                            Value="False" />
                <Condition Property="IsSelected"
                            Value="False" />
            </MultiTrigger.Conditions>

            <MultiTrigger.EnterActions>
                <BeginStoryboard x:Name="multi"
                                    Storyboard="{StaticResource MoveInStoryboard}" />
            </MultiTrigger.EnterActions>
            <MultiTrigger.ExitActions>
                <RemoveStoryboard BeginStoryboardName="multi" />
            </MultiTrigger.ExitActions>
        </MultiTrigger>
    </ControlTemplate.Triggers>
于 2014-08-28T08:52:16.003 回答
1

因此，经过多次尝试并在 pushpraj 的帮助下，我得到了最终解决方案。也许它会帮助任何有同样问题的人：

<MultiTrigger>
                            <MultiTrigger.Conditions>
                                <Condition Property="IsMouseOver"
                                       Value="True" />
                                <Condition Property="IsSelected"
                                       Value="False" />
                            </MultiTrigger.Conditions>

                            <MultiTrigger.EnterActions>
                                <RemoveStoryboard BeginStoryboardName="moveIn1" />
                                <RemoveStoryboard BeginStoryboardName="moveOut2" />
                                <BeginStoryboard x:Name="moveOut1"
                                         Storyboard="{StaticResource MoveOutStoryboard}" />
                            </MultiTrigger.EnterActions>
                        </MultiTrigger>

                        <Trigger Property="IsSelected"
                             Value="True">
                            <Trigger.EnterActions>
                                <BeginStoryboard x:Name="moveOut2"
                                         Storyboard="{StaticResource MoveOutStoryboard}" />
                            </Trigger.EnterActions>
                        </Trigger>

                        <MultiTrigger>
                            <MultiTrigger.Conditions>
                                <Condition Property="IsMouseOver"
                                       Value="False" />
                                <Condition Property="IsSelected"
                                       Value="False" />
                            </MultiTrigger.Conditions>

                            <MultiTrigger.EnterActions>
                                <RemoveStoryboard BeginStoryboardName="moveOut2" />
                                <BeginStoryboard x:Name="moveIn1"
                                         Storyboard="{StaticResource MoveInStoryboard}" />
                            </MultiTrigger.EnterActions>
                        </MultiTrigger>
于 2014-08-28T09:13:50.493 回答