在WPF中对UserControl进行动画处理？ [英] Animate UserControl in WPF?

问题描述

我有两个xaml文件，一个是 MainWindow.xaml ，另一个是userControl EditTaskView.xaml 。
在MainWindow.xaml中，它由列表框组成，并且双击列表框的任何项时，它将显示EditView userControl中的其他窗口（编辑窗口）。每当列表框中的任何项目被双击时，我都试图为该userControl设置动画。我在userControl中添加了一些动画，但是动画只能运行一次。每当单击列表框中的任何项目时，如何使动画每次运行？

I have two xaml file one is MainWindow.xaml and other is userControl EditTaskView.xaml. In MainWindow.xaml it consists of listbox and when double clicked any item of listbox, it displays other window (edit window) from EditView userControl. I am trying to animate this userControl everytime whenever any item from the listbox is double clicked. I added some animation in userControl however the animation only gets run once. How can i make my animation run everytime whenever any item from the listbox is clicked?

MainWindow.xaml

MainWindow.xaml

 <ListBox x:Name="lstBxTask"   Style="{StaticResource ListBoxItems}" MouseDoubleClick="lstBxTask_MouseDoubleClick">
        <ListBox.ItemTemplate>               
            <DataTemplate>                    
                <StackPanel>
                    <Rectangle Style="{StaticResource LineBetweenListBox}"/>
                    <StackPanel Orientation="Horizontal">
                        <TextBlock Text="{Binding Taskname}"  Style="{StaticResource TextInListBox}"/>
                        <Button Name="btnDelete" Style="{StaticResource DeleteButton}" Click="btnDelete_Click"/>                                                      
                    </StackPanel>
                </StackPanel>                    
            </DataTemplate>
        </ListBox.ItemTemplate>
    </ListBox>  
    <ToDoTask:EditTaskView x:Name="EditTask" Grid.Row="1" Grid.RowSpan="2" Grid.ColumnSpan="2" Visibility="Collapsed"/>

在MainWindow代码中，有鼠标双击事件，该事件将EditTaskView的可见性更改为Visible。

In the MainWindow code, there is mouse double click event, which changes the visibility of EditTaskView to Visible.

建议？

推荐答案

感谢bitbonk，您的代码确实有帮助。

Thanks bitbonk, your code really help.

我想我知道我的问题是什么。我将EventTrigger作为FrameworkElement.Loaded而不是Control.MouseDoubleClick。

I think i figure out what was my problem. I had EventTrigger as FrameworkElement.Loaded instead of Control.MouseDoubleClick.

无论如何，代码看起来像这样：

anyway the code looks like this:

<Storyboard x:Key="AnimateEditView">
        <ThicknessAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Margin)" Storyboard.TargetName="EditTask">
            <EasingThicknessKeyFrame KeyTime="0" Value="0">
                <EasingThicknessKeyFrame.EasingFunction>
                    <ExponentialEase EasingMode="EaseOut"/>
                </EasingThicknessKeyFrame.EasingFunction>
            </EasingThicknessKeyFrame>
            <EasingThicknessKeyFrame KeyTime="0:0:1.6" Value="0"/>
        </ThicknessAnimationUsingKeyFrames>
        <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="EditTask">
            <EasingDoubleKeyFrame KeyTime="0" Value="0"/>
            <EasingDoubleKeyFrame KeyTime="0:0:1.6" Value="1"/>
        </DoubleAnimationUsingKeyFrames>
    </Storyboard>

<Window.Triggers>
        <EventTrigger RoutedEvent="FrameworkElement.Loaded">
            <BeginStoryboard Storyboard="{StaticResource headerAnimation}"/>
            <BeginStoryboard Storyboard="{StaticResource textBxAnimation}"/>
        </EventTrigger>
        <EventTrigger RoutedEvent="Control.MouseDoubleClick">
            <BeginStoryboard Storyboard="{StaticResource AnimateEditView}"/>
        </EventTrigger>
    </Window.Triggers>

这篇关于在WPF中对UserControl进行动画处理？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！