wpf - 如何使用动画笔划粗细动态调整矩形路径的大小？

Question

我有一个由 RectangleGeometry 定义的 Rectangle 和 Path:

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition/>
        <RowDefinition/>
    </Grid.RowDefinitions>
    <Rectangle Grid.Row="0" Stroke="Red" Width="{Binding RctWidth}"/>
    <Path Grid.Row="1" Stroke="Red">
        <Path.Data>
            <RectangleGeometry Rect="0,0,50,10"/>
        </Path.Data>
        <Path.Triggers>
            <EventTrigger RoutedEvent="Path.Loaded">
                <BeginStoryboard>
                    <Storyboard TargetProperty="StrokeThickness">
                        <DoubleAnimation RepeatBehavior="Forever" From="1" To="3" Duration="0:0:0.5"/>
                    </Storyboard>
                </BeginStoryboard>          
            </EventTrigger>
        </Path.Triggers>
    </Path>
</Grid>

矩形根据绑定(bind)动态改变其宽度。 矩形Path 在其StrokeThickness 上应用了动画。 我希望矩形 Path 的大小与该矩形完全匹配，但以这样的方式，笔划厚度动画不会影响它(较粗的笔划应该使 Path实际上比矩形大一点 - 这是预期的行为)。

我怎样才能做到这一点？

请注意，我无法在 Path 上使用 Stretch="Fill" 属性。在这种情况下，笔画粗细只会在 Path 边界内增长，但我想保持笔画在内部和外部方向上增长的默认行为。

此外，我无法更改 Rectangle 宽度所绑定(bind)的 View 模型。这是一个外部组件，我不允许修改。

我实际上可以摆脱那个矩形。对我来说重要的是 Path 及其动态变化的宽度。

Answer 1

正如评论所述，笔画粗细仅向内部增长的影响可以通过负边距来取消。

对于将厚度从 1 更改为 3 的动画，边距需要从 0 更改为 -1(补偿一半的厚度变化):

<BeginStoryboard>
    <Storyboard>
        <DoubleAnimation Storyboard.TargetProperty="StrokeThickness" RepeatBehavior="Forever" From="1" To="3" Duration="0:0:0.5"/>
        <ThicknessAnimation Storyboard.TargetProperty="Margin" RepeatBehavior="Forever" From="0" To="-1" Duration="0:0:0.5"/>
    </Storyboard>
</BeginStoryboard>

有了这个，您就可以将您的解决方案与 Stretch="Fill" 一起使用，无论它是什么样子。