WPF：在 Windows 加载时停止隐藏控件的动画答案

【问题标题】：WPF: Stop Animation For Hidden Controls on Windows LoadWPF：在 Windows 加载时停止隐藏控件的动画
【发布时间】：2017-02-17 05:49:30
【问题描述】：

我有一个非常简单的淡入/淡出动画，使用数据触发器可以正常工作。我已将数据触发器绑定到 bool 属性，并在触发器内部将不透明度设置为 0 为 false，反之亦然。

现在的问题是加载时 bool 值为 false 的对象，我不希望它们在加载时显示然后动画自己隐藏。

我尝试在样式设置器上将不透明度设置为 0，但没有用

这是按钮样式

        <Style x:Key="LocationPickerButtonStyle" TargetType="{x:Type Button}">
        <Style.Setters>
            <Setter Property="Height" Value="93"/>
            <Setter Property="Width" Value="93"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Grid >
                            <Image x:Name="DefaultImage" Source="something.png"/>
                           <Ellipse x:Name="HitTest" Fill="Transparent" Height="93" Width="93" HorizontalAlignment="Center" VerticalAlignment="Center"/>
                        </Grid>
                        <ControlTemplate.Triggers>
                            <DataTrigger Binding="{Binding IsLocationVisible}" Value="true">
                                <DataTrigger.EnterActions>
                                    <BeginStoryboard x:Name="showSelectedLocation">
                                        <Storyboard Storyboard.TargetProperty="Opacity">
                                            <DoubleAnimation Duration="0:0:1" From="0" To="1"/>
                                        </Storyboard>
                                    </BeginStoryboard>
                                </DataTrigger.EnterActions>
                                <DataTrigger.ExitActions>
                                    <StopStoryboard BeginStoryboardName="showSelectedLocation"></StopStoryboard>
                                </DataTrigger.ExitActions>
                            </DataTrigger>
                            <DataTrigger Binding="{Binding IsLocationVisible}" Value="false">
                                <DataTrigger.EnterActions>
                                    <BeginStoryboard x:Name="hideSelectedLocation">
                                        <Storyboard Storyboard.TargetProperty="Opacity" >
                                            <DoubleAnimation Duration="0:0:1" From="1" To="0" />
                                        </Storyboard>
                                    </BeginStoryboard>
                                </DataTrigger.EnterActions>
                                <DataTrigger.ExitActions>
                                    <StopStoryboard BeginStoryboardName="hideSelectedLocation"></StopStoryboard>
                                </DataTrigger.ExitActions>
                            </DataTrigger>
                            <Trigger Property="Opacity" Value="0">
                                <Setter Property="Visibility" Value="Collapsed"></Setter>
                            </Trigger>
                            <Trigger Property="Opacity" Value="1">
                                <Setter Property="Visibility" Value="Visible"></Setter>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style.Setters>
    </Style>

【问题讨论】：

我正在尝试做类似的事情（如果另一个数据触发器为真，则阻止动画发生）但我所能做的就是停止它，如果它是从 StopStoryboard 开始的。
您是否需要在加载时立即折叠 bool 值为 false 的按钮？动画有一个解决方法，但在按钮折叠之前仍需要Animation Duration 时间。
@Funk 是的，我希望它在加载时折叠，用户可以通过选择特定选项将其恢复，然后它需要使用指定的动画，为了更好地表达，我只是不希望它在加载时执行数据触发器，因为我没有手动将关联属性设置为 false，它只有默认值。

标签： wpf storyboard

【解决方案1】：

在您的 XAML 中进行这些更改：

将您的 DataTriggers 从 <ControlTemplate.Triggers> 转移到 Style.Triggers。
将Style Setter 中的Opacity = 0 设置为每个Opacity 的起始Button。
删除false DataTrigger中的From = 1。

进行所有更改后，您的 Style 将如下所示：

    <Style x:Key="LocationPickerButtonStyle" TargetType="{x:Type Button}">
            <Style.Triggers>
                <DataTrigger Binding="{Binding IsLocationVisible}" Value="true">
                    <DataTrigger.EnterActions>
                        <BeginStoryboard x:Name="showSelectedLocation">
                            <Storyboard Storyboard.TargetProperty="Opacity">
                                <DoubleAnimation Duration="0:0:1" From="0" To="1"/>
                            </Storyboard>
                        </BeginStoryboard>
                    </DataTrigger.EnterActions>
                    <DataTrigger.ExitActions>
                        <StopStoryboard BeginStoryboardName="showSelectedLocation"></StopStoryboard>
                    </DataTrigger.ExitActions>
                </DataTrigger>
                <DataTrigger Binding="{Binding IsLocationVisible}" Value="false">
                    <DataTrigger.EnterActions>
                        <BeginStoryboard x:Name="hideSelectedLocation">
                            <Storyboard Storyboard.TargetProperty="Opacity" >
                                <DoubleAnimation Duration="0:0:1"  To="0" />
                            </Storyboard>
                        </BeginStoryboard>
                    </DataTrigger.EnterActions>
                    <DataTrigger.ExitActions>
                        <StopStoryboard BeginStoryboardName="hideSelectedLocation"></StopStoryboard>
                    </DataTrigger.ExitActions>
                </DataTrigger>
            </Style.Triggers>
            <Style.Setters>
                <Setter Property="Height" Value="93"/>
                <Setter Property="Width" Value="93"/>
                <Setter Property="Opacity" Value="0"/>
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="Button">
                            <Grid >
                                <Image x:Name="DefaultImage" Source="something.png"/>
                                <Ellipse x:Name="HitTest" Fill="Transparent" Height="93" Width="93" HorizontalAlignment="Center" VerticalAlignment="Center"/>
                            </Grid>
                            <ControlTemplate.Triggers>                                    
                                <Trigger Property="Opacity" Value="0">
                                    <Setter Property="Visibility" Value="Collapsed"></Setter>
                                </Trigger>
                                <Trigger Property="Opacity" Value="1">
                                    <Setter Property="Visibility" Value="Visible"></Setter>
                                </Trigger>
                            </ControlTemplate.Triggers>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style.Setters>
        </Style>

【讨论】：

差不多了，当默认为false时，动画仍然会在启动时触发。要抑制这种情况，请删除第二个 DataTrigger 的 DoubleAnimation 中的 From="1"。
@Funk 我在我的测试示例中这样做了，但在这里忘记提及了。
@AnjumSKhan 就像一个魅力。谢谢