wpf 鼠标拖动绘制几何图形

最近在学习wpf，简单的使用Button控件创建了一个绘制自由线条，直线，矩形和圆形的绘制，学习事件不多，所以只是使用控件完成的这些功能，没有使用类来进行编辑（如果使用类的话可以实现更多功能，像选中已经绘制的图形进行该图形参数的编辑来改变图形的大小，之后使用了类来完成绘制命令后再重写一篇吧）。

实现这些功能，在wpf中自然要先构建 .xaml界面。

 <Grid Margin="3" x:Name="grid"><Grid.ColumnDefinitions><ColumnDefinition Width="*"></ColumnDefinition><ColumnDefinition Width="3*"></ColumnDefinition>            </Grid.ColumnDefinitions><Grid x:Name="grid1" Grid.Column="0"><Grid.RowDefinitions><RowDefinition Height="*"></RowDefinition><RowDefinition Height="*"></RowDefinition><RowDefinition Height="*"></RowDefinition><RowDefinition Height="*"></RowDefinition><RowDefinition Height="*"></RowDefinition></Grid.RowDefinitions><Button Height="30" Margin="5" Grid.Row="0" Name="PathLine" Click="button0">随意画线</Button><Button Height="30" Margin="5" Grid.Row="1" Name="Line" Click="button1">画直线</Button><Button Height="30" Margin="5" Grid.Row="2" Name="Rect" Click="button2">画矩形</Button><Button Height="30" Margin="5" Grid.Row="3" Name="Elli" Click="button3">画圆形</Button><Button Height="30" Margin="5" Grid.Row="4" Click="Button_Clear" Content="清空"/></Grid><Canvas Grid.Column="1" Margin="3" x:Name="canvas1" Background="Gray" MouseLeftButtonDown="Canvas_MouseButtonDown" MouseLeftButtonUp="Canvas_MouseButtonUp" MouseMove="Canvas_MouseMove"/>        </Grid>

编辑完成的见面应该如下图所示：

这之后就是控件的响应事件的生成了，Button按钮事件的生成就不赘述了，直接上代码：

        private void button1(object sender, RoutedEventArgs e){this.Type = TypeEnum.画直线;}private void button2(object sender, RoutedEventArgs e){this.Type = TypeEnum.矩形;}private void button3(object sender, RoutedEventArgs e){this.Type = TypeEnum.圆形;}       private void button0(object sender, RoutedEventArgs e){this.Type = TypeEnum.任意;}private void Button_Clear(object sender, RoutedEventArgs e){canvas1.Children.Clear();}

这里在Button按钮事件中使用了枚举的方法，

public enum TypeEnum { Null = 0, 画直线, 任意, 矩形, 圆形 }

这里是为了对应鼠标按钮的事件来对应响应要绘制的图形。

对应鼠标事件我这里使用了MouseLeftButtonDown，MouseLeftButtonDown和MouseMove，

尝试过直接使用MouseButtonDown（Up），但是似乎默认使用鼠标右键，所有在代码里还是写详细一点吧。

在生成Mouse事件的响应命令之前，就是几个变量的定义了：

        private Path path = null;//初始化bool isMouseDowm = false;private TypeEnum Type = TypeEnum.Null;public Point startPoint;

Mouse事件对应的响应代码如下：

        private void Canvas_MouseButtonDown(object sender, MouseButtonEventArgs e){startPoint = e.GetPosition(canvas1);isMouseDowm = true;}private void Canvas_MouseButtonUp(object sender, MouseButtonEventArgs e){            isMouseDowm = false;this.path = new Path();}private void Canvas_MouseMove(object sender, MouseEventArgs e){if (isMouseDowm){if (Type == TypeEnum.任意){this.path = new Path();//实例化this.path.Stroke = Brushes.Black;this.path.StrokeThickness = 3;PathGeometry pg = new PathGeometry();//复杂图形PathFigure pf = new PathFigure();//复杂图形的一部分pf.StartPoint = startPoint;LineSegment ls = new LineSegment();//使用line连接两点ls.Point = e.GetPosition(canvas1);pf.Segments.Add(ls);pg.Figures.Add(pf);//给startPoint重新赋值startPoint = e.GetPosition(canvas1);//鼠标移动到的位置为新的起点this.path.Data = pg;canvas1.Children.Add(this.path);                    }else if (Type == TypeEnum.画直线){//方法1//canvas1.Children.Remove(this.path);//this.path = new Path();//this.canvas1.Children.Add(this.path);//this.path.Stroke = Brushes.Black;//this.path.StrokeThickness = 3;//LineGeometry lg = new LineGeometry(startPoint, e.GetPosition(canvas1));//this.path.Data = lg;//方法2          //这里进行两种判断，一是先点击画直线的情况，二是已经点击过其他按钮的情况if (this.path == null){this.path = new Path();//判断条件满足canvas1.Children.Add(this.path);}this.path.Stroke = Brushes.Green;this.path.StrokeThickness = 3;this.path.Data = new LineGeometry(startPoint, e.GetPosition(canvas1));if (this.path != null){canvas1.Children.Remove(this.path);this.path.Data = new LineGeometry(startPoint, e.GetPosition(canvas1));canvas1.Children.Add(this.path);}}else if (Type == TypeEnum.矩形){canvas1.Children.Remove(this.path);this.path = new Path();this.path.Stroke = Brushes.Red;this.path.StrokeThickness = 3;RectangleGeometry rg = new RectangleGeometry();double startX = startPoint.X;double startY = startPoint.Y;double height = Math.Abs(e.GetPosition(canvas1).X - startPoint.X);double width = Math.Abs(e.GetPosition(canvas1).Y - startPoint.Y);rg.Rect = new Rect(startX, startY, width, height);this.path.Data = rg;canvas1.Children.Add(this.path);                   }else if (Type == TypeEnum.圆形){canvas1.Children.Remove(this.path);this.path = new Path();this.path.Stroke = Brushes.Blue;this.path.StrokeThickness = 3;double startX = startPoint.X;double startY = startPoint.Y;double radiusX = Math.Abs(e.GetPosition(canvas1).X - startPoint.X);double radiusY = Math.Abs(e.GetPosition(canvas1).Y - startPoint.Y);EllipseGeometry eg = new EllipseGeometry(new Point(startX, startY), radiusX, radiusY);this.path.Data = eg;canvas1.Children.Add(this.path);}                }}

画直线的部分，使用了Remove命令来消除上一个path线条（因为我使用的是LineGeometry，如果不擦去上一个路径就会出现绘制出一个无数线条构成的扇形图，而不是动态的实现一条直线的出现），然后在矩形的绘制过程中wight和height的计算命令应该是wight=x2-x1,height=y2-y1,但是会出现绘制无法响应mousebuttonup导致绘制无法结束的情况，那位大佬知道的希望可以给我一点指导呀。

注释就没写太多了，主要是使用了Geometry的几个派生类：PathGeometry，LineGeometry，RectangleGeometry和EllipseGeometry，绘制方法也就是确定起始点和终点，根据不同的绘制要求进行响应的计算（就长宽和圆形的半径（椭圆就RadiusX和RadiusY））。

总的来说，面向对象的思维没有体现（因为没有类和类中的方法的封装，多态和继承），之后想要使用面向对象的思维重写该文，还是希望各位大佬能不吝赐教呀，感谢。

wpf 鼠标拖动绘制几何图形相关推荐

Qt鼠标拖动绘制基本几何图形
概述用Qt鼠标事件实现基本几何图形的绘制,支持直线.矩形.圆形.椭圆.后期可以在此基础上进行扩展. 效果图实现本示例使用QGraphics体系来实现,因为要移动对象,所以生成的图形必须是一个单独 ...
JavaScript鼠标拖动绘制方框实现选区
学习编程,与君共勉. 针对JavaScript拖动鼠标绘制方框实现选区的方法,在网上查了很多,但感觉不是写的很繁琐就是感觉很乱,没有一个详细的步骤,这对于我们这些菜鸟来说真的很难理解,所以我写了一份比 ...
WPF之路——绘制几何图形
一.Geometry和Share Geometry类(几何绘图)包括,LineGeometry(几何线条).RectangleGeometry(几何矩形).EllipesGeometry(几何椭圆图形 ...
WPF 使用Path绘制几何图形
Path类继承自Shape,可以绘制很多简单的,复合的图形.Path类通过提供的Data属性,Data属性接受一个Geometry对象(我的理解就是Data要装什么集合图形呀),Geometry一共有 ...
python matplotlib.pyplot 如何实时绘制三维动态窗口？（可鼠标拖动角度）
实时绘制三维图并更新窗口 # -*- coding: utf-8 -*- """ @File : test.py @Time : 2020/5/26 18:09 @Aut ...
【Java AWT 图形界面编程】使用鼠标滚轮缩放 Canvas 画布中绘制的背景图像 ( 绘制超大图像 + 鼠标拖动 + 鼠标滚轮缩放 + 以当前鼠标指针位置为缩放中心示例 )
文章目录一.鼠标滚轮缩放的中心点设置为当前鼠标中心点 - 要点分析 1.保存当前鼠标指针指向的位置 2.根据鼠标指针指向的位置以及比例重新计算图片位置二.绘制超大图像 + 鼠标拖动 + 鼠标滚轮缩 ...
WPF编程，实现鼠标拖动控件并带有中间动效
一. 前提要实现鼠标对控件的拖拽移动,首先必须知道下面几点: WPF中的鼠标左键按下.鼠标移动事件,有时候通过XAML界面添加的时候并有没有作用,我们要通过触发事件的元素和要监听的路由事件绑定来进行 ...
WPF使用Canvas绘制可变矩形
WPF使用Canvas绘制可变矩形原文:WPF使用Canvas绘制可变矩形版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.net/WANGYAN9110/ ...
真・WPF 按钮拖动和调整大小
真・WPF 按钮拖动和调整大小独立观察员 2020 年 8 月 29 日手头有个 Winform 程序,是使用动态生成按钮,然后拖动.调整大小,以此来记录一些坐标数据,最后保存坐标数据的. 在数据 ...
Python+turtle交互式绘图：可以用鼠标拖动的小海龟
功能描述:代码运行后,在窗口上显示3个小海龟,使用鼠标拖动小海龟时可以动态改变窗口颜色,如下图所示. 说明:本例代码主体部分来自turtle Demo,我稍微修改了一下,重点增加了注释,方便阅读和理解 ...

wpf 鼠标拖动绘制几何图形

wpf 鼠标拖动绘制几何图形相关推荐

最新文章

热门文章