Question

当鼠标在矩形上移动时，我希望在矩形上显示用户控件，并在鼠标离开时重置动画并折叠用户控件。

我的问题是我应该如何“重置”动画，因为我当前接近的只是在鼠标离开时折叠用户控件。下面是我的演示代码。

EDITTED：

ControlLibrary.xaml

<UserControl.Style>
    <Style>
      <Style.Triggers>
       <EventTrigger RoutedEvent="FrameworkElement.Loaded">
                <BeginStoryboard Name="opacityStoryBoard">
                    <Storyboard  >
                        <DoubleAnimation Storyboard.TargetProperty="Opacity" Duration="00:00:10" From="0" To="2" />
                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger>

            <EventTrigger RoutedEvent="FrameworkElement.MouseLeave">
                <SeekStoryboard BeginStoryboardName="opacityStoryBoard" Offset="00:00:00">  </SeekStoryboard>
            </EventTrigger>

            <Trigger Property="FrameworkElement.Visibility" Value="Collapsed">
                <Setter Property="FrameworkElement.Opacity" Value="0"/>
            </Trigger>
        </Style.Triggers>
    </Style>
</UserControl.Style>

<StackPanel Orientation="Vertical">
    <Label Content="Welcome" HorizontalAlignment="Stretch" VerticalAlignment="Top"
    HorizontalContentAlignment="Center" VerticalContentAlignment="Center" 
    Foreground="White"  Background="Transparent" FontSize="25" Height="300" Margin="10,0" />

    <!--<Image Height="300" x:Name="qr" Margin="10,0"  />-->


 </StackPanel>

mainWindow.xaml

<myToolTip:UserControl1 Visibility="Collapsed" 
        x:Name="customToolTip" />

    <Rectangle Fill="Transparent" HorizontalAlignment="Left" Height="322" Stroke="Black" 
       VerticalAlignment="Top" Width="518" MouseMove="Rectangle_MouseMove_1"   MouseLeave="Rectangle_MouseLeave_1">
    </Rectangle>

mainWindow.cs

      private void Rectangle_MouseMove_1(object sender, MouseEventArgs e)
    {

        customToolTip.Visibility = System.Windows.Visibility.Visible;

    }

    private void Rectangle_MouseLeave_1(object sender, MouseEventArgs e)
    {
        customToolTip.Visibility = System.Windows.Visibility.Collapsed;
    }

请指导我......谢谢。

Answer 1

使用SeekStoryBoard类重置鼠标离开矩形时的动画时间。

例如：

<Style.Triggers>
    <EventTrigger RoutedEvent="FrameworkElement.Loaded">
            <BeginStoryboard Name="opacityStoryBoard">
                    <Storyboard  >
                        <DoubleAnimation Storyboard.TargetProperty="Opacity" Duration="00:00:10" From="0" To="2" />
                    </Storyboard>
            </BeginStoryboard>
    </EventTrigger>
    <Trigger Property="FrameworkElement.Visibility" Value="Collapsed">
            <Setter Property="FrameworkElement.Opacity" Value="0"/>
            <Trigger.EnterActions>
                    <SeekStoryboard BeginStoryboardName="opacityStoryBoard" Offset="00:00:00"></SeekStoryboard>
            </Trigger.EnterActions>
    </Trigger>
</Style.Triggers>

鼠标离开时重置用户控件的动画

1 个答案: