来源：蜘蛛抓取(WebSpider)
时间：2015-05-07 05:20
标签：
wpf绘制曲线
10123人阅读
.NET 程序开发（8）
WPF2D3DDemoWPFShowWPF
语法如下：
&Page x:Class=&Animation.SolidColorBrush&
xmlns=&/winfx/2006/xaml/presentation&
xmlns:x=&/winfx/2006/xaml&
Title=&SolidColorBrush&
&Ellipse Canvas.Left=&60& Canvas.Top=&80& Width=&100& Height=&100&
Fill=&Blue& Opacity=&0.5& Stroke=&Black& StrokeThickness=&3&/&
&Ellipse Canvas.Left=&30& Canvas.Top=&30& Width=&100& Height=&100& Stroke=&Blue& StrokeThickness=&3&&
&Ellipse.Fill&
&SolidColorBrush Color=&Green& Opacity=&0.6& /&
&/Ellipse.Fill&
&/Ellipse&
&Ellipse Canvas.Left=&90& Canvas.Top=&30& Width=&100& Height=&100& Stroke=&Black& StrokeThickness=&3&&
&Ellipse.Fill&
&SolidColorBrush Color=&Red& Opacity=&0.3& /&
&/Ellipse.Fill&
&/Ellipse&
.tw/4907/article.php?pbgid=4907&entryid=245479
参考知识库
* 以上用户言论只代表其个人观点，不代表CSDN网站的观点或立场
访问：146963次
积分：1854
积分：1854
排名：第18599名
原创：30篇
评论：79条
(1)(3)(2)(3)(5)(3)(4)(8)(1)WPF中的静态、动态图形绘制问题
桂林老师来信询问数学图形绘制问题。分三种情况说明：
一、利用【工具】中的工具绘制
【工具】中有椭圆、矩形、直线工具，直接使用就行。还有钢笔、铅笔工具（在《WPF和Silverlight教程》中有较详细介绍）。下面的方法均需要编制较多程序。
二、编程绘制静态规则图形&&&
利用Shape基类绘制规则图形
&&& 基类派生了六个实用类，可以实例化直接使用的对象，如 （椭圆）、（直线）、（路径）、（绘制封闭的多边形）、（绘制首尾连接的直线，可以不封闭）和
（矩形），Expression Blend中的图形控件使用了其中的对象。的对象共享以下通用属性：
&&& ：说明绘制形状的轮廓颜色；
&&& ：说明形状轮廓的粗细；
&&&&：说明如何绘制形状的内部；
还有一些其它属性，这些属性在Blend的【属性】面板中可以找到，不在这里叙述。这些对象控件的使用也很简单，从【工具】面板选择就行，下面只举例说明如何通过编程应用Shape的对象绘制图形。一般在绘制规则图形时会使用到这些类。
要说明的是图形绘制时的坐标体系：
WPF默认的二维坐标原点是设计屏幕的左上角，X正方向向左，Y正方向向下，单位是1英寸（25.4毫米）的1/96。
图3.23.1列举了几个图形绘制方法，界面的根布局类型改为Canvas，按钮事件代码即是图形的绘制程序。
1. 绘制直线
private void button1_Click(object sender,
System.Windows.RoutedEventArgs e)
Line line = new Line();//定义直线对象
&&&&&&&&&&&
line.Stroke = System.Windows.Media.Brushes.R //设置线的颜色，红色
&&&&&&&&&&&
line.X1 = 0; //直线起点
&& &line.Y1 =
0;&&&&&&&&&&&
&&&&&&&&&&&
line.X2 = 150; //直线终点
&&&&&&&&&&&
320;&&&&&&&&&&&
&&&&&&&&&&&
line.StrokeThickness = 5; //直线粗细
&&&&&&&&&&&
this.LayoutRoot.Children.Add(line); //装入界面根布局容器中
图3.23.1 Shape类图形绘制
2. 绘制椭圆
private void button2_Click(object sender,
System.Windows.RoutedEventArgs e)
&&&&&&&&&&&
Ellipse ellipse = new Ellipse();//定义椭圆对象
&&&&&&&&&&&&//属性设置，填充颜色、边粗细、边颜色、宽、高等
&&ellipse.Fill=System.Windows.Media.Brushes.G
&&&&&&&&&&&
ellipse.StrokeThickness =
4;&&&&&&&&&&
&&&&&&&&&&&
ellipse.Stroke =System.Windows.Media.Brushes.G //边，金黄色
&&&&&&&&&&&
ellipse.Width = 80;
&&&&&&&&&&&
ellipse.Height = 200;
&&&&&&&&&&&
//椭圆对象相对于父容器对象Canvas的位置，左边距、上边距
&&Canvas.SetLeft(ellipse,165);
&&&&&&&&&&&
Canvas.SetTop(ellipse,80);
&&&&&&&&&&&
this.LayoutRoot.Children.Add(ellipse);
3. 绘制矩形
private void button3_Click(object sender,
System.Windows.RoutedEventArgs e)
Rectangle rectangle = new Rectangle();//矩形对象
//属性设置，填充颜色、边粗细、边颜色、宽、高等
&&&&&&&&&&&
rectangle.Fill=System.Windows.Media.Brushes.B
&&&&&&&&&&
&rectangle.StrokeThickness =
4;&&&&&&&&&&&&
&&&&&&&&&&
&rectangle.Stroke
=System.Windows.Media.Brushes.P //边，粉色
&&&&&&&&&&&
rectangle.Width = 80;
&&&&&&&&&&
&rectangle.Height = 200;
//矩形对象相对于父容器对象Canvas的位置，左边距、上边距
&&Canvas.SetLeft(rectangle,260);
&&&&&&&&&&&
Canvas.SetTop(rectangle,80);
&&&&&&&&&&&
this.LayoutRoot.Children.Add(rectangle);
4. 封闭多边形
封闭多边形Polygon的绘制需要指明多边形的顶点坐标，只要有了这些点集，Polygon自动依次连接每个顶点，并且自动将最后1个顶点和第1个顶点连接，绘制出封闭多边形，Polygon有个属性Points，需要声明设置此属性的点集合。
private void button4_Click(object sender,
System.Windows.RoutedEventArgs e)
{&&&&&&&&&&&
&& Polygon polygon = new
Polygon();//定义封闭多边形对象
//属性设置，边颜色、填充颜色、边粗细等
&&&&&&&&&&
polygon.Stroke = System.Windows.Media.Brushes.R
//填充，浅海蓝色
&&&&&&&&&&
polygon.Fill = System.Windows.Media.Brushes.LightSeaG
&&polygon.StrokeThickness =
2;&&&&&&&&&&&
&&&&&&&&&&
Point Point1 = new Point(360,80); //封闭多边形的多个顶点坐标
&&&&&&&&&&
Point Point2 = new Point(390,90);
&&&&&&&&&&
Point Point3 = new Point(435,150);
&& Point Point4 = new
Point(390,200);
&& Point Point5 = new
Point(360,300);
&&&&&&&&&&&
//定义点集合对象
&&&&&&&&&&
PointCollection pointCollection = new
PointCollection();&&&&&&&&&&&
&&&&&&&&&&&
pointCollection.Add(Point1); //将顶点添加到点集合对象
&&&&&&&&&&&
pointCollection.Add(Point2);
&&&&&&&&&&&
pointCollection.Add(Point3);
&&pointCollection.Add(Point4);
&&&&&&&&&&&
pointCollection.Add(Point5);&&&&&&&&&&&
&&&&&&&&&&&
polygon.Points = pointC //设置Polygon属性Points的点集合
&&&&&&&&&&&
this.LayoutRoot.Children.Add(polygon);
5. 不封闭形状
&&&&不封闭形状Polyline
的绘制和Polygon的绘制类似，需要指明顶点坐标，只要有了这些点集，Polyline自动依次连接每个顶点，但最后1个顶点和第1个顶点不会连接，从而绘制出不封闭形状，Polyline也有个属性Points，需要声明设置此属性的点集合。
private void button5_Click(object sender,
System.Windows.RoutedEventArgs e)
Polyline polyline = new Polyline();//定义不封闭形状的对象
//属性设置，边颜色、填充颜色、边粗细等
&&&&&&&&polyline.Stroke
= System.Windows.Media.Brushes.R
&&&&&&&&&&&
//填充色，浅海蓝色
&&&&&&&&&&
polyline.Fill =
System.Windows.Media.Brushes.LightSeaG&
&polyline.StrokeThickness = 2;
&&&&&&&&&&
Point Point1 = new Point(460,80); //不封闭形状的多个顶点坐标
&&Point Point2 = new
Point(490,90);
&&&&&&&&&&
Point Point3 = new Point(535,150);
&&&Point Point4
= new Point(490,200);
&&&Point Point5
= new Point(460,300);
&&&&&&&&&&
//定义点集合对象
&&&&&&&&&&
PointCollection pointCollection = new
PointCollection();&
&&&&&&&&&&&&
&&&&pointCollection.Add(Point1);
//将顶点添加到点集合对象
&&&&&&&&&&
pointCollection.Add(Point2);
&&&&&&&&&&
pointCollection.Add(Point3);
pointCollection.Add(Point4);
&&&&&&&&&&
pointCollection.Add(Point5);&&&&&&&&&&&
&&&&&&&&&&
polyline.Points = pointC//Polyline对象属性Points的点集合
&&&&&&&&&&
this.LayoutRoot.Children.Add(polyline);
&&&&&三、编程绘制动态随机图形&
利用Geometry基类绘制动态图形
&&& 类以及派生类可以描绘基本、复杂二维形状的几何图形，可以剪辑图形绘制到屏幕，可以形成动画。的派生类大致可以分为三个类别：基本几何图形、复合几何图形和路径图形。当然，类描绘的图形需要借助其他方法显示。
由于内容较多，这里没有详细介绍类，只是结合自由落体运动轨迹动态图形绘制介绍有关知识。图3.23.2（Example2.23\Window1.xaml）是动态绘制自由落体运动中高度变化的轨迹示例，希望对其他实时图形的绘制有所启发。
图3.23.2左边有个小球，小球（ellipse）被放置在Canvas控件（canvas1）中，从顶端自由下落，在地面弹跳几次后停止，自由落体动画、缓冲曲线设置均使用编程实现。右边是动态绘制的图形，坐标线是直线控件直接放到【设计面板】实现，动态图形点的采集是在定时器的定时处理程序中实现的。右边黑色背景是Canvas控件（canvas2）。运动轨迹的绘制使用几何线段绘制对象PathFigure，此对象有个特点，只要确定绘制的开始点，就会自动连接后面采集的点形成线段，线段需要复合几何图形PathGeometry对象组合形成曲线图形、并借助于Path对象显示。图3.23.2左下方有两个按钮控件，一个用于“启动”（b1，启动自由落体动画），另一个用于“复位”（b2，小球回到开始位置）。最下方有个文本框TextBlock用于显示小球下落过程中高度的数字值，下面是程序。
图3.23.2 实时图形绘制
初始化程序&&
int i=1; //动画时间计数
DispatcherTimer timer=new
DispatcherTimer();//定时器&&&&&&&
PathFigure pf = new PathFigure();//运动轨迹线段绘制
PathGeometry pg = new
PathGeometry();//组合绘制的线段&&&&&&
Path pa = new
Path();//绘制轨迹曲线的容器，用于显示&&&&
DoubleAnimation da=new DoubleAnimation();//小球自由落体运动动画
BounceEase easeBounce=new
BounceEase();//缓动曲线定义&&&&&&
DoubleAnimation rt=new DoubleAnimation();//复位动画
public Window1()
&&&&&&&&&&&
this.InitializeComponent();
&&&&&&&&&&&
pa.Stroke=Brushes.LightG//绘制颜色，亮绿色
&&&&&&&&&&&
pa.StrokeThickness=2;//绘制的线宽
&&&&&&&&&&&
Canvas.SetTop(this.ellipse,0);&
//设置小球起点&&&&&
&&&&&&&&&&&
startpoint();//确定绘制的开始点，自定义程序
&&&&&&&&&&&
timer.Interval=TimeSpan.FromMilliseconds(10);//定时10毫秒
&&&&&&&&&&&
timer.Tick+=new System.EventHandler(timer_Tick); //定时事件
&&&&&&&&&&&
da.Completed+=new System.EventHandler(da_Completed);//动画完成事件
绘制起点自定义程序
private void startpoint()
{&&&&&&&&&&&
&&&&&&&&&&&
pf.StartPoint = new Point(0,0);//定义绘制的第一个点
&&&&&&&&&&&
//加入到PathFigure对象中，true表示描绘线段
&&&&&&&&&&&
pf.Segments.Add(new LineSegment(new
Point(0,0),true));&&&&&&&&&&
&&&&&&&&&&&
pg.Figures.Add(pf); //组合绘制的线段，只要操作一次
&&&&&&&&&&&
pa.Data=//作为Path对象的数据
&&&&&&&&&&&
this.canvas2.Children.Add(pa);//加入Canvas在屏幕显示
&&&&&&&&&&&
Canvas.SetLeft(pa,0);//设置Path对象左边距从0开始，绘制开始的X坐标
&&&&&&&&&&&
Canvas.SetTop(pa,this.canvas2.Height/2);//绘制开始的Y坐标
3. 自由落体动画
private void b1_Click(object sender,
System.Windows.RoutedEventArgs e)
&&&&&&&&&&&
easeBounce.EasingMode=EasingMode.EaseO//缓动曲线模式
&&&&&&&&&&&
da.EasingFunction=easeB//动画缓动曲线设置
da.Duration=TimeSpan.FromSeconds(5);//动画间隔时间5秒
&&&&&&&&&&&
da.From=0;//从高度0开始，起点
&&&&&&&&&&&
da.To=400;//落地高度400，终点
&&&&&&&&&&&
this.ellipse.RenderTransform=new TranslateTransform();//小球位移变换
&&&&&&&&&&&
timer.Start();//启动定时器
&&&&&&&&&&&
ellipse.BeginAnimation(Canvas.TopProperty,da);//启动动画&&&&&&&&&&&
4. 动画完成
private void da_Completed(object sender,
System.EventArgs e)
&&&&&&&&&&&
timer.Stop();&&&&&&
5. 定时器定时事件
private void timer_Tick(object sender,
System.EventArgs e)
&&&&&&&&&&&
double y=Canvas.GetTop(this.ellipse);//获取当前高度
&&&&&&&&&&&
pf.Segments.Add(new LineSegment(new Point(i,y/2),true));//加入
&&&&&&&&&&&
i++;//计数
&&&&&&&&&&&
this.tb.Text=y.ToString();//显示数字值
6. 复位动画程序
private void b2_Click(object sender,
System.Windows.RoutedEventArgs e)
&&&&&&&&&&&
rt.Duration=TimeSpan.FromSeconds(1);//动画时间1秒
&&&&&&&&&&&
rt.From=400;//开始点
&&&&&&&&&&&
rt.To=0;//终点
&&&&&&&&&&&
this.ellipse.RenderTransform=new TranslateTransform();
&&&&&&&&&&&
ellipse.BeginAnimation(Canvas.TopProperty,rt);
&&&&&&&&&&&
pf.Segments.Clear();//PathFigure对象清0，所有绘制线段消失
&&&&&&&&&&&
i=1;//重新计数&
以上的编程对初学者有点困难，其实可以寻找其他可以容易画图的软件生成EXE文件，在WPF中连接就相对简单了。
已投稿到：
以上网友发言只代表其个人观点，不代表新浪网的观点或立场。WPF学习04：2D绘图 使用Shape绘基本图形
来源：博客园
我们将使用Shape进行基本图形绘制。 例子
一个可移动的矩形方框：
XAML代码： &Window x:Class="Shape.MainWindow"
xmlns="/winfx/2006/xaml/presentation"
xmlns:x="/winfx/2006/xaml" Background="#019aff"
Title="Shape" Height="350" Width="525" KeyUp="Window_KeyUp" Loaded="Window_Loaded"
&Canvas Name="MainCanvas"&
&Rectangle Stroke="White" Width="80.6" Canvas.Top="50" Canvas.Left="50" Height="80.6" Name="DisplayRectangle"/&
&/Canvas& &/Window&
后台代码： private void Window_KeyUp(object sender, KeyEventArgs e) {
switch (e.Key)
case Key.Up:
RectangleCanvasTop += <span style="color: #;
break;
case Key.Down:
RectangleCanvasTop -= <span style="color: #;
break;
case Key.Right:
RectangleCanvasLeft += <span style="color: #;
break;
case Key.Left:
RectangleCanvasLeft -= <span style="color: #;
break;
default:
break;
Canvas.SetLeft(DisplayRectangle, RectangleCanvasLeft);
Canvas.SetTop(DisplayRectangle, RectangleCanvasTop); } Shape简介
以下是各类Shape的继承结构：
各类Shape均继承于Shape，而Shape与其它的WPF控件一样，也继承于FrameworkElement，即其它控件支持的功能（各种事件，属性），Shape也是支持的，这是使用Shape绘图的优点。
例子中，Shape是放在Canvas中的，Shape亦可放在其它的Layout控件中。由于Canvas提供了绝对定位的支持，故而常常与Shape搭配出现。 Ellipse:
XAML实现： &Canvas Name="MainCanvas"&
&Ellipse Width="100" Height="100" Fill="White"&&/Ellipse&
&Ellipse Canvas.Left="100" Width="50" Height="100" Fill="White"&&/Ellipse& &/Canvas&
后台代码实现： var circle = new Ellipse() {
Width = <span style="color: #0,
Height = <span style="color: #0,
Fill = new SolidColorBrush(Colors.White) }; var ellipse = new Ellipse() {
Width = <span style="color: #,
Height = <span style="color: #0,
Fill = new SolidColorBrush(Colors.White) }; Canvas.SetLeft(ellipse, <span style="color: #0); MainCanvas.Children.Add(circle); MainCanvas.Children.Add(ellipse); Line
XAML实现: &Line X1="50" X2="100" Y1="50" Y2="100" Stroke="White"&&/Line& &Line X1="100" X2="150" Y1="100" Y2="100" Stroke="White"&&/Line&
后台代码实现: MainCanvas.Children.Add(new Line(){
X1 = <span style="color: #,
X2 = <span style="color: #0,
Y1 = <span style="color: #0,
Y2 = <span style="color: #,
Stroke = new SolidColorBrush(Colors.White) }); Polygon
XAML实现: &Polygon Points="0,0 50,50 50,100" Stroke="Black"&&/Polygon& &Polygon Canvas.Left="100" Points="0,0 50,50 50,100 100,50" Fill="White" Stroke="Black"&&/Polygon&
后台代码: var polygon1PointsCollection = new PointCollection(); polygon1PointsCollection.Add(new Point() { X = <span style="color: #, Y = <span style="color: # }); polygon1PointsCollection.Add(new Point() { X = <span style="color: #, Y = <span style="color: # }); polygon1PointsCollection.Add(new Point() { X = <span style="color: #, Y = <span style="color: #0 }); var polygon1 = new Polygon() {
Stroke = new SolidColorBrush(Colors.Black),
Points = polygon1PointsCollection }; MainCanvas.Children.Add(polygon1); var polygon2PointsCollection = new PointCollection(); polygon2PointsCollection.Add(new Point() { X = <span style="color: #, Y = <span style="color: # }); polygon2PointsCollection.Add(new Point() { X = <span style="color: #, Y = <span style="color: # }); polygon2PointsCollection.Add(new Point() { X = <span style="color: #, Y = <span style="color: #0 }); polygon2PointsCollection.Add(new Point() { X = <span style="color: #0, Y = <span style="color: # }); var polygon2 = new Polygon() {
Stroke = new SolidColorBrush(Colors.Black),
Points = polygon2PointsCollection,
Fill = new SolidColorBrush(Colors.White) }; Canvas.SetLeft(polygon2, <span style="color: #0); MainCanvas.Children.Add(polygon2); 虚线边框：
XAML实现: &Polygon Points="0,0 50,50 50,100" Stroke="Black" StrokeDashArray="2 2"&&/Polygon& &Polygon Points="0,0 50,50 50,100" Stroke="Black" StrokeDashArray="4 4" Canvas.Left="100"&&/Polygon&
免责声明：本站部分内容、图片、文字、视频等来自于互联网，仅供大家学习与交流。相关内容如涉嫌侵犯您的知识产权或其他合法权益，请向本站发送有效通知，我们会及时处理。反馈邮箱&&&&。
学生服务号
在线咨询，奖学金返现，名师点评，等你来互动
