Question

我不知道如何用XAML绘制箭头。我目前还没有任何代码。

有人可以帮我用XAML代码进行绘制吗？

感谢您的帮助。

Answer 1

您可以使用<TextBlock Text="➔" />（How do you convert binary data to Strings and back in Java?）

Path

或<Path Stroke="Black" Data="M 0 4 L 16 4 L 10 0 M 16 4 L 10 8" />（http://xahlee.info/comp/unicode_arrows.html）

{{1}}

Answer 2

我只需用手绘制一个点并用眼睛调整点数：

<Path Stretch="Fill" Fill="LimeGreen" 
              Data="M
              0,115   95,115   //p1, p2  (when really use remove these comments)
              65,90   85,90    //p3, p4
              120,120          //p5
                      85,150  65,150  //p6, p7
                      95,125  0,125   //p8, p9
              Z"
              HorizontalAlignment="Center"  Width="60" Height="60" />

您可以调整宽度/高度，基本上p1,p2,p3,p4和p6,p7,p8,p9是对称的，Data可以省略描述和逗号，如下所示：

Data="M 0 115 95 115 65 90 85 90 120 120 85 150 65 150 95 125 0 125 Z"

结果：

除了这里有一种旋转箭头的方法，下面的示例将另一个右箭头旋转180度，成为左箭头：

    <Path Stretch="Fill" Fill="LimeGreen" 
          Data="M 0,110 70,110 45,90 75,90 120,120 75,150 45,150 70,130 0,130 Z"
          HorizontalAlignment="Right"  Width="30" Height="24" Margin="0,0,2,0"
          RenderTransformOrigin=".5,.5">
        <Path.RenderTransform>
            <RotateTransform Angle="180" />
        </Path.RenderTransform>
    </Path>

Answer 3

碰巧有一个很好的第三方库，可以免费使用，并且可能适合某些需要使用箭头作为行尾的用例。

完整的代码太长了，无法在此处复制，但是我在下面链接到了它。我找不到此代码的任何其他存储库（例如Nuget，Github等）

文章： Lines with Arrows, Charles Petzold, April 18, 2007, New York, N.Y.

摘要：

Arrowheads.zip文件包含一个演示程序和两个类从Shape派生的名为ArrowLine和ArrowPolyline

ArrowLine类从ArrowLineBase派生而来，基本上通过定义X1，Y1，X2和Y2属性来复制Line类； ArrowPolyline通过定义点来复制Polyline类属性。

...

由于箭头基本上是直线的一部分，因此会受到影响所有影响线的属性，例如“笔触” StrokeThickness，StrokeStartLineCap和StrokeLineJoin。如果您设定 IsArrowClosed为true，Fill属性开始起作用；的如果将“填充”（Fill）设置为与中风。

上面提到的类是可以从XAML使用的控件（用C＃编写）。简单的例子：

xmlns:p="clr-namespace:Petzold.Media2D;assembly=Arrowheads"

...
    
<p:ArrowLine
    X1="0"
    Y1="0"
    X2="148"
    Y2="0"
    Canvas.Top="18"
    Canvas.Left="26"
    />

示例输出：

（http://www.charlespetzold.com/blog/2007/04/Arrowheads.png）

请注意，如in his FAQ所述，Charles非常友好地提供了此代码以供重用：

我编写和发布的所有代码均可在您的软件中免费使用项目（无论是个人的还是商业的）不受限制。

（FAQ确实提到了有关出版物的一些限制，因此您应该完整阅读它。）

Answer 4

对于一个简单的箭头，这里有一个只使用一对线的技巧。第一条线是箭头的主轴，第二条线是形成箭头的零长度线。轴没有帽，箭头纯粹是帽。整个箭头可以通过旋转封闭画布来旋转，我觉得这很有用。

<Canvas Width="75" Height="50">
    <Line X1="0" Y1="25" X2="55" Y2="25" Stroke="#ffffff" StrokeThickness="20"/>
    <Line X1="50" Y1="25" X2="50" Y2="25" Stroke="#ffffff" StrokeThickness="50" StrokeEndLineCap="Triangle"/>
</Canvas>

用XAML绘制箭头

4 个答案: