如何动态调整带有动画笔画厚度的矩形路径？

我有一个Rectangle和由RectangleGeometry限定的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>

矩形变化。矩形Path具有施加在其StrokeThickness的动画。我希望长方形Path的大小与该矩形完全匹配，但是以这种方式笔划厚度动画不会影响这一点（较粗的笔划应使Path实际上比Rectangle大一点 - 这就是预期的行为）。

我该怎么做？

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

此外，我不能改变视图模型Rectangle的宽度是必然的。这是一个我不允许修改的外部组件。

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

来源

2017-08-07 dymanoid

您可以将'Path.Data'绑定到视图模型中的属性。每次'RctWidth'改变时，你都可以创建一个新的'RectangleGeometry'并分配给该属性。 –

@YusufTarıkGünaydın，如果生活会如此简单...不幸的是我不能触摸视图模型，因为它是一个外部组件。我正在寻找纯粹的XAML方式，或者是一些附加的属性/行为/无论如何。 – dymanoid

也许你可以加负利润率，抵消增加厚度的效果...... – grek40

正如评论，中风厚度只增长到内部的影响可以被消极的利润率抵消。

关于改变从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"解决方案，无论它可能看起来像。

来源

2017-08-08 08:00:20 grek40

好吧，就是这样。一个简单的解决方案，适用于'Stretch'模式。为什么我还没有尝试过动画边缘，这真的让我感到困惑...... – dymanoid

如何动态调整带有动画笔画厚度的矩形路径？

回答

相关问题