簡體   English   中英

如何在WPF中繪制此路徑?

[英]How to draw this path in WPF?

我需要在WPF中創建這個形狀。 首先,我認為是一條路徑,但內部顯示的線條是3D形狀。

我怎樣畫這個形狀包括線條?

非常感謝。

在此輸入圖像描述

使用Path和Ellipse對象可以非常簡單地繪制形狀的外部/輪廓。 圓柱體的頂面也可以在網格中用許多線條(作為路徑對象)繪制。 您可以繪制它們,使它們都延伸到頂部橢圓之外,並使用頂部橢圓作為蒙版來修剪它們。

圓柱體內的垂直線稍微復雜一些。 它們的坐標可以通過以下公式確定,假設圓柱的左邊緣位於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#。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM