WPF绘图箭头沿路径前进

Question

只是想知道如何沿路径绘制箭头.路径将改变方向并经历几个不同的点.箭头设计用于向用户显示沿着他们需要行进的路径的方向.

我试过用刷子但它不起作用,因为我需要箭头来定位它们沿着路径自我...

Answer 1

请参阅路径动画概述和MatrixAnimationUsingPath

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

EDIT1:

<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,即后续箭头的BeginTime之间的时间.您必须添加的箭头数量为Duration/BeginTimeGap,或者是简化代码:

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

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