c# - WPF 沿路径绘制箭头

Question

只是想知道如何沿着路径绘制箭头。路径将改变方向并经过几个不同的点。箭头旨在向用户显示他们需要沿路径行驶的方向。

我试过使用刷子，但它没有用，因为我需要箭头来沿着路径 self 定位......

Answer 1

参见 Path Animations Overview和 MatrixAnimationUsingPath

它可用于沿 PathGeometry 移动控件，如果您设置 DoesRotateWithTangent，控件也将沿路径方向旋转。

编辑 1:

<Page.Resources>
    <PathGeometry x:Key="Path" x:Shared="False" Figures="M 10,100 C 35,0 135,0 160,100 180,190 285,200 310,100"/>
</Page.Resources>
<Canvas Width="400" Height="400">
    <Path Data="{StaticResource Path}" Stroke="Blue" StrokeThickness="1"/>
    <Path
        x:Name="Arrow1"
        Stretch="Fill"
        Width="16" Height="16" StrokeLineJoin="Miter"
        Data="M 0 -5 L 10 -5 M 5 0 L 10 -5 L 5 -10" 
        Stroke="Black" StrokeThickness="3">
        <Path.RenderTransform>
            <TransformGroup>
                <TranslateTransform X="-8" Y="-8"/>
                <MatrixTransform>
                    <MatrixTransform.Matrix>
                        <Matrix/>
                    </MatrixTransform.Matrix>
                </MatrixTransform>
            </TransformGroup>
        </Path.RenderTransform>
        <Path.Triggers>
            <EventTrigger RoutedEvent="Path.Loaded">
                <BeginStoryboard>
                    <Storyboard>
                        <MatrixAnimationUsingPath
                            Storyboard.TargetName="Arrow1"
                            Storyboard.TargetProperty="RenderTransform.Children[1].Matrix"                                
                            DoesRotateWithTangent="True"
                            Duration="0:0:5" 
                            BeginTime="0:0:0"
                            RepeatBehavior="Forever" PathGeometry="{StaticResource Path}" >                               
                        </MatrixAnimationUsingPath>
                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger>
        </Path.Triggers>
    </Path>
</Canvas>

EDIT2:计算你需要多少支箭

我假设您正在创建自定义控件并以编程方式添加箭头？如果是这样，我认为最简单的方法是为单个循环指定持续时间和 BeginTimeGap，即后续箭头的 BeginTimes 之间的时间。您必须添加的箭头数为 Duration/BeginTimeGap，或用简化代码表示:

while (BeginTime < Duration) 
{ 
    //add arrow with BeginTime and Duration; 
    BeginTime += BeginTimeGap; 
}

获得正确的速度和箭头之间的间距将归结为调整这两个值。