原标题:WPF-16 图形处理

我们这节主要介绍WPF常用画图标签,由于WPF图形处理设计大量篇幅 ,我们在这里抛砖引玉,具体更多的学习资料链接 https://github.com/microsoft/WPF-Samples/tree/master/Graphics 该链接中微软提供了大量的学习Demo ,WPF 图形处理最大的区别在于WPF底层使用的DirectX,Winform底层使用的是GDI+,所以WPF的图形界面上更胜一筹。

1. Line

该对象表示画一条线,我们在学习几何图形的时候,大家都知道两点可以确定一条线,所以我们画一条直线只需要给出两个坐标点可以

< Canvas > < Rectangle Width = "120" Height = "100" RadiusX = "5" RadiusY = "5" Stroke = "Green" StrokeThickness = "2" Fill = "Red" > </ Rectangle > </ Canvas >

3.Ellipse( 画椭圆 )

< Canvas > < Ellipse Height = "200" Width = "400" StrokeThickness = "2" Stroke = "Red" Fill = "Gold" /> </ Canvas >

4.Path(表示几何路径)

该对象包含了一系列对象的组合,例如(直线,矩形,椭圆),Data属性可以通过两种方式来表示:

4.1 StreamGeometry方式

</ Canvas >

我们来介绍一下Data中的指令:

1. 移动指令( Move Command ) 指定图形的起点, M或m表示起始点,大写绝对值,小写相对值,例如: M 10,100或m 10,100 是一个System.Windows.Point

2. 绘制命令(Draw Commands) 绘制命令可以由几个图形命令组成,我们可以使用下面图形命令:直线、水平线、竖线、三次贝塞尔曲线、二次贝塞尔曲线、平滑三次贝塞尔曲线、平滑二次贝塞尔曲线和椭圆弧

直线命令(Line Command): L endPoint或l endPoint表示结束点坐标,例如:l 20 30 and L 20,30 , endPoint表示 一个 System.Windows.Point 类型

水平线命令( Horizontal Line Command ): H x 或者 h x 当前点和指定的 x 坐标之间创建一条水平线 ,例如:H 90,x表示 System.Double

竖线命令( Vertical Line Command ):V y或者 v y 在当前点和指定的 y 坐标之间创建一条竖线,例如 :v 90 ,y表示System.Double类型

三次贝塞尔曲线命令(Cubic Bezier Curve Command)

语法如下: C CP1 CP2 EP 或者 c CP1 CP2 EP

备注:CP=controlPoint,EP=endPoint

例如 :C 10,300 300,-200 300,100 CP1 和CP2 和EP分别代表System.Windows.Point类型

二次贝塞尔曲线命令(Quadratic Bezier Curve Command):Q x,y x,y

语法如下: Q CP EP 或者 1 CP1 CP2 EP

备注:CP=controlPoint,EP=endPoint

例如 :Q 10,300 300,100 CP和EP分别代表 System.Windows.Point 类型

平滑三次贝塞尔曲线命令( Smooth cubic Bezier curve Command ):S x,y x,y

语法如下: S CP EP 或者 s CP EP

备注:CP=controlPoint,EP=endPoint

例如 : S 10,300 300,100 CP和EP分别代表 System.Windows.Point 类型

平滑二次贝塞尔曲线命令( Smooth quadratic Bezier curve Command ):

语法如下:T EP 或者 t EP

例如 : S 10,300 EP分别代表 System.Windows.Point 类型

椭圆弧命令( Elliptical Arc Command)

语法如下:A 或者a

  • size 圆弧的 x 轴和 y 轴半径

  • rotationAngle 椭圆的旋转,以度为单位, System.Double类型

  • isLargeArcFlag 如果圆弧角度应为 180 度或更大请设置为 1,否则 设置为 0

  • sweepDirectionFlag 如果以正角方向绘制圆弧,请设置为 1;否则设置为 0

  • endPoint 是一个 System.Windows.Point 类型

  • 3. 关闭指令( The Close Command ) :Z或者z , 结束当前图形,用一条直线连接图形的结束点和开始点

    4.2 PathFigureCollection 方式

    我们还引用刚才图形

    <Path Stroke="Black" Fill="Gray"> <Path.Data> <PathGeometry Figures="M 10,100 C 10,300 300,-200 300,100" /> </Path.Data> </Path> </Canvas> < PathGeometry.Figures > < PathFigureCollection > < PathFigure IsClosed = "True" StartPoint = "10,100" > < PathFigure.Segments > < PathSegmentCollection > < LineSegment Point = "100,100" /> < LineSegment Point = "100,50" /> </ PathSegmentCollection > </ PathFigure.Segments > </ PathFigure > </ PathFigureCollection > </ PathGeometry.Figures > </ PathGeometry > </ Path.Data > </ Path >

    我们可以看到这种方式对我们修改路径特别方便, PathSegment 派 生类如下:

    System.Windows.Media.ArcSegment

    System.Windows.Media.BezierSegment

    System.Windows.Media.LineSegment

    System.Windows.Media.PolyBezierSegment

    System.Windows.Media.PolyLineSegment

    System.Windows.Media.PolyQuadraticBezierSegment

    System.Windows.Media.QuadraticBezierSegment

    那我们怎么选择这两种方式呢? 在创建路径后无需修改路径时,请使用 StreamGeometry ;如果需要修改路径,请使用 PathGeometry

    5.Polygon

    可以使用 Polygon 元素绘制闭合图形。创建一个 Polygon 元素并使用其 Points 属性指定形状的顶点。将自动绘制一条连接第一个点和最后一个点的线。还可以指定 Fill 和/或 Stroke

    < Canvas Height = "300" Width = "300" > < Polygon Points = "10,110 60,10 110,110" Fill = "Blue" />

    < Polygon Points = "10,110 60,10 110,110" Fill = "Blue" Stroke = "Black" StrokeThickness = "4" Canvas.Top = "150" />

    < Polygon Points = "10,110 110,110 110,10" Fill = "Blue" Canvas.Left = "150" />

    < Polygon Points = "10,110 110,110 110,10" Stroke = "Black" StrokeThickness = "4" Canvas.Left = "150" Canvas.Top = "150" /> </ Canvas >

    6.Polyline

    如果想绘制折线,我们可以创建 Polyline 元素并设置 Points 属性指定形状顶点。最后,使用 Stroke StrokeThickness 属性描述折线轮廓,Polyline 元素不是封闭形状

    < Canvas Height = "400" Width = "400" > < Polyline Points = "10,110 60,10 110,110" Stroke = "Black" StrokeThickness = "4" />

    < Polyline Points = "10,110 110,110 110,10" Stroke = "Black" StrokeThickness = "4" Canvas.Left = "150" /> </ Canvas >

    这节我们主要介绍了常用图形绘制对象Line,Rectangle,Ellipse,Path,Polygon,Polyline用法,可以看出WPF提供了强大的绘图功能。 希望对各位有所帮助,谢谢! 返回搜狐,查看更多

    责任编辑:

    平台声明:该文观点仅代表作者本人,搜狐号系信息发布平台,搜狐仅提供信息存储空间服务。