Question

我的Ellipse上有一组Canvas。

对于每个省略号上的MouseEnter事件，我想调整元素的大小，以便给出放大的外观和感觉。

为了让它更具吸引力，我想逐渐改变（平滑/动画的感觉）。任何提示都表示赞赏。

Answer 1

尝试这样的事情：

    <Style x:Key="ScaleStyle" TargetType="{x:Type FrameworkElement}">
        <Setter Property="RenderTransformOrigin" Value="0.5,0.5"/>
        <Setter Property="RenderTransform">
            <Setter.Value>
                <ScaleTransform />
            </Setter.Value>
        </Setter>
        <Style.Triggers>
            <EventTrigger RoutedEvent="MouseEnter">
                <BeginStoryboard>
                    <Storyboard>
                        <DoubleAnimation To="1.2" Duration="0:0:0.2"
                                         Storyboard.TargetProperty="RenderTransform.ScaleX" />
                        <DoubleAnimation To="1.2" Duration="0:0:0.2"
                                         Storyboard.TargetProperty="RenderTransform.ScaleY" />
                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger>
            <EventTrigger RoutedEvent="MouseLeave">
                <BeginStoryboard>
                    <Storyboard>
                        <DoubleAnimation To="1.0" Duration="0:0:0.1"
                                         Storyboard.TargetProperty="RenderTransform.ScaleX" />
                        <DoubleAnimation To="1.0" Duration="0:0:0.1"
                                         Storyboard.TargetProperty="RenderTransform.ScaleY" />
                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger>
        </Style.Triggers>
    </Style>
</Window.Resources>
<Canvas>
    <Ellipse Style="{StaticResource ScaleStyle}" Canvas.Left="100" Canvas.Top="100"
             Width="200" Height="100" Stroke="Black" StrokeThickness="2" Fill="Transparent" />
</Canvas>

顺利调整UIElement的大小

1 个答案: