0、讲点废话
除了仪表盘控件比较常用外，还有图表也经常使用，同样网上也有非常强大的图表控件，有收费的（DVexpress），也有免费的。但我们平时在使用时，只想简单地绘一个图，控件库里面的许多功能我们都用不到，没必要使用那么功能丰富的控件，以提高程序运行的效率和减小程序的占用空间。同时，我们自己如果能够绘制图表出来，对于程序的移植，也非常方便。对于大部分平台，相信设计方法是不会变的。
1、图表整体设计
简单来看一个图表的组成，一般由4个部分组成，坐标轴，刻度和刻度值，绘图区域（添加数据点和绘制曲线）。
2、坐标轴绘制
先作出两根垂直的直线出来，为x轴和y轴，XAML代码如下。2，3行代码即为两个数轴。4~23行，是作出两个小三角形，以形成箭头的形状。
1 <Canvas Margin="5"> 2 <Line x:Name="x_axis" Stroke="Black" StrokeThickness="3" X1="40" Y1="280" X2="480" Y2="280" StrokeStartLineCap="Round"/> 3 <Line x:Name="y_axis" Stroke="Black" StrokeThickness="3" X1="40" Y1="280" X2="40" Y2="30" StrokeStartLineCap="Round"/> 4 <Path x:Name="x_axisArrow" Fill="Black"> 5 <Path.Data> 6 <PathGeometry> 7 <PathFigure StartPoint="480,276" IsClosed="True"> 8 <LineSegment Point="480,284"/> 9 <LineSegment Point="490,280"/> 10 </PathFigure> 11 </PathGeometry> 12 </Path.Data> 13 </Path> 14 <Path x:Name="y_axisArrow" Fill="Black"> 15 <Path.Data> 16 <PathGeometry> 17 <PathFigure StartPoint="36,30" IsClosed="True"> 18 <LineSegment Point="44,30"/> 19 <LineSegment Point="40,20"/> 20 </PathFigure> 21 </PathGeometry> 22 </Path.Data> 23 </Path> 24 </Canvas>
WPF中没有画带箭头直线的函数，这个必需要自己写了，最好的方法当然还是在XAML中，用Path来绘制出一个三角形在线的末端。当然这种用绝对坐标绘出来的小三角形，它不方便绘制到别的画布中，当前单纯为了做出效果，后面可以用C#动态生成箭头，在后台完成绘制。上述代码的效果如下所示。
3、坐标轴刻度和标签添加
4、数据点添加和曲线绘制
心得体会
WPF自定义控件(2)——图表设计[1]
时间： 2024-10-29 16:12:42