1. 程式人生 > >在C#的WPF程式使用XAML實現畫線

在C#的WPF程式使用XAML實現畫線



在WPF中畫直線。新建WPF應用程式,使用XAML畫直線。
使用X1、Y1兩個屬性可以設定直線的起點座標,X2、Y2兩個屬性則可以設定直線的終點座標。控制起點/終點座標就可以實現平行、交錯等效果。Stroke(筆觸)屬性的資料型別是Brush(花刷),凡是Brush的派生類均可用於給這個屬性賦值。因為WPf提供了多種漸變色花刷,所以畫直線也可以畫出漸變效果。同時,Line的一些屬性還幫助我們畫出虛線以及控制線段終點的形狀。
下面是例子:

<Window x:Class="WpfLine.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="XAMLLines" Height="350" Width="525">
    <Grid>
        <Line X1="50" Y1="20" X2="400" Y2="20" Stroke="Red" StrokeThickness="10"></Line>
        <Line X1="10" Y1="40" X2="260" Y2="40" Stroke="Blue"  StrokeThickness="6"></Line>
        <Line X1="10" Y1="60" X2="260" Y2="20" Stroke="Black"  StrokeThickness="6"></Line>
        <Line X1="20" Y1="60" X2="360" Y2="60" Stroke="Green"  StrokeThickness="3"></Line>
        <Line X1="30" Y1="80" X2="460" Y2="80" Stroke="Purple"  StrokeThickness="1"></Line>
        <Line X1="40" Y1="90" X2="460" Y2="90" Stroke="Black"  StrokeThickness="2"></Line>
        <Line X1="10" Y1="110" X2="360" Y2="110" StrokeDashArray="3" Stroke="RosyBrown"  StrokeThickness="6"></Line>
        <Line X1="10" Y1="120" X2="360" Y2="120" StrokeDashArray="5" Stroke="RosyBrown"  StrokeThickness="6"></Line>
        <Line X1="50" Y1="140" X2="460" Y2="140" StrokeEndLineCap="Flat" Stroke="Brown"  StrokeThickness="6"></Line>
        <Line X1="40" Y1="155" X2="460" Y2="155" StrokeEndLineCap="Triangle" Stroke="Brown"  StrokeThickness="8"></Line>
        <Line X1="200" Y1="10" X2="200" Y2="500" Stroke="Red" StrokeDashArray="10" StrokeThickness="9"></Line>
   
        <Line X1="40" Y1="170" X2="460" Y2="170"  StrokeEndLineCap="Round"   StrokeThickness="8">
            <Line.Stroke>
                <LinearGradientBrush EndPoint="0,0.5" StartPoint="1,0.5">
                    <GradientStop Color="Blue"/>
                    <GradientStop Offset="1"/>
                </LinearGradientBrush>
            </Line.Stroke>
       </Line>                                                                                           
    </Grid>
</Window>

效果:


完!