如何在WPF中绘制这条路径?

7
我需要在WPF中创建这个形状。起初,我认为它是路径,但内部的线条显示它是一个3D形状。
我该如何绘制包括线条在内的这个形状?
非常感谢。 enter image description here

你需要将其制作为3D对象,还是仅在画布上绘制为2D图像? - Andriy Khrystyanovich
我不确定具体的方法,但是可以看一下 http://msdn.microsoft.com/en-us/library/ms747437.aspx ,可能会有帮助。 - NominSim
您可能需要编辑标签,将XNA标签包括进来,因为如果要进行任何3D操作,您将需要在XNA中创建它。 - Chris W.
等等,你只是想在2D中绘制它吗?如果是的话,那可以相对容易地完成。 - Chris W.
3
在2D上绘制涂痕也会很困难;在3D中,你可以直接应用一种纹理。 - Dan J
显示剩余3条评论
1个回答

13

你可以使用Path和Ellipse对象来简单地绘制形状的外部轮廓。通过在网格中绘制多条线条(作为Path对象),也可以绘制圆柱的顶面。只需将它们都绘制到顶部椭圆之外,并使用顶部椭圆作为遮罩进行修剪。

圆柱体内的垂直线条略微复杂。假设圆柱的左边缘位于x=0处,圆柱的左边缘与椭圆的左边缘相交的点处于y=0处,则可以用以下公式确定它们的坐标:

For i = 0 to NumberOfDivisions
  HorizontalPosition = CircleRadius - (cos(pi/NumberOfDivisions * i) * CircleRadius)
  TopOfLine = sin(pi/NumberOfDivisions * i) * CircleRadius * 0.5 //The 0.5 assumes that the ellipse will only be half as tall as it is wide.
  BottomOfLine = TopOfLine + HeightOfCylinder
  //draw vertical line where:
  //X1=HorizontalPosition, Y1=TopOfLine
  //X2=HorizontalPosition, Y2=BottomOfLine
Next

其中NumberOfDivisions + 1等于你想在圆柱上显示的线条数量。

MSDN有一些很好的示例可以帮助你开始使用Path类

如果你只需要一种表示3D圆柱的方法,而不需要网格线,线性渐变画刷和2个路径对象就能达到效果:

    <Canvas  >
        <Path Width="111" Height="113.5" Canvas.Left="0" Canvas.Top="12.5" Stretch="Fill" StrokeLineJoin="Round" Stroke="#FF000000" Data="F1 M 177,190C 176.999,196.903 152.375,202.5 122,202.5C 91.6246,202.5 67.0006,196.903 67,189.979L 67,90L 177,90L 177,190 Z ">
            <Path.Fill>
                <LinearGradientBrush StartPoint="-0.00454615,0.5" EndPoint="1.00455,0.5">
                    <LinearGradientBrush.GradientStops>
                        <GradientStop Color="#FF28A528" Offset="0"/>
                        <GradientStop Color="#FF63B963" Offset="0.152943"/>
                        <GradientStop Color="#FF9FCE9F" Offset="0.362069"/>
                        <GradientStop Color="#FF006C00" Offset="0.991379"/>
                    </LinearGradientBrush.GradientStops>
                </LinearGradientBrush>
            </Path.Fill>
        </Path>
        <Path Width="111" Height="26" Canvas.Left="0" Canvas.Top="0" Stretch="Fill" StrokeLineJoin="Round" Stroke="#FF000000" Fill="#FF2CF72C" Data="F1 M 122,77.4999C 152.376,77.4999 177,83.0964 177,89.9999C 177,96.9035 152.376,102.5 122,102.5C 91.6244,102.5 67.0001,96.9035 67.0001,89.9999C 67.0001,83.0964 91.6245,77.4999 122,77.4999 Z "/>
    </Canvas>

输入图像描述

编辑 好的,这个问题引起了我的兴趣,我努力写了一篇完整的文章,在CodePoject上,同时提供了一个简单项目的源代码来绘制解决方案。通常情况下,我不会费那么大力气,但这对我来说是一个很好的开始学习C#的简单项目。


我不认为那是他想要的结果,但因为这是一个很棒的例子,所以算+1。=) - CodingGorilla

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接