WPF InkCanvas绘制矩形和椭圆
程序员文章站
2023-12-14 09:56:28
前面说到了inkcanvas的基本操作,这里用一个实例来说明具体应用:绘制矩形和椭圆。
效果图
xaml代码
前面说到了inkcanvas的基本操作,这里用一个实例来说明具体应用:绘制矩形和椭圆。
效果图
xaml代码
<window x:class="wpf_inkcanvas.roi_inkcanvas" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:local="clr-namespace:wpf_inkcanvas" mc:ignorable="d" title="roi_inkcanvas" height="450" width="800"> <grid> <grid.rowdefinitions> <rowdefinition/> <rowdefinition height="auto"/> </grid.rowdefinitions> <image name="imgmeasure" horizontalalignment="center" stretch="uniform"/> <inkcanvas name="inkcanvasmeasure" editingmode="none" background="transparent" strokes="{binding inkstrokes, mode=twoway}" horizontalalignment="center" width="{binding elementname=imgmeasure, path=actualwidth}" height="{binding elementname=imgmeasure, path=actualheight}" mousedown="inkcanvasmeasure_mousedown" mousemove="inkcanvasmeasure_mousemove"> <label content="{binding meainfo}" background="transparent" horizontalalignment="left" verticalalignment="top" margin="10" fontsize="18" foreground="red" ishittestvisible="false"/> </inkcanvas> <stackpanel grid.row="1" orientation="horizontal"> <button content="openfile" margin="5" horizontalalignment="left" fontsize="20" click="openfile_click"/> <togglebutton name="btnsquare" content="draw square" margin="5" horizontalalignment="left" fontsize="20" click="drawsquare_click"/> <togglebutton name="btnellipse" content="draw ellipse" margin="5" horizontalalignment="left" fontsize="20" click="drawellipse_click"/> </stackpanel> </grid> </window>
后台代码
using microsoft.win32; using system; using system.collections.generic; using system.linq; using system.text; using system.threading.tasks; using system.windows; using system.windows.controls; using system.windows.data; using system.windows.documents; using system.windows.ink; using system.windows.input; using system.windows.media; using system.windows.media.imaging; using system.windows.shapes; namespace wpf_inkcanvas { /// <summary> /// roi_inkcanvas.xaml 的交互逻辑 /// </summary> public partial class roi_inkcanvas : window { private viewmodel viewmodel; private system.windows.point inip; public roi_inkcanvas() { initializecomponent(); drawingattributes drawingattributes = new drawingattributes { color = colors.red, width = 2, height = 2, stylustip = stylustip.rectangle, //fittocurve = true, ishighlighter = false, ignorepressure = true, }; inkcanvasmeasure.defaultdrawingattributes = drawingattributes; viewmodel = new viewmodel { meainfo = "测试······", inkstrokes = new strokecollection(), }; datacontext = viewmodel; } private void openfile_click(object sender, routedeventargs e) { openfiledialog opendialog = new openfiledialog { filter = "image files (*.jpg)|*.jpg|image files (*.png)|*.png|image files (*.bmp)|*.bmp", title = "open image file" }; if (opendialog.showdialog() == true) { bitmapimage image = new bitmapimage(); image.begininit(); image.urisource = new uri(opendialog.filename, urikind.relativeorabsolute); image.endinit(); imgmeasure.source = image; } } private void drawsquare_click(object sender, routedeventargs e) { if (btnsquare.ischecked == true) { btnellipse.ischecked = false; } } private void drawellipse_click(object sender, routedeventargs e) { if (btnellipse.ischecked == true) { btnsquare.ischecked = false; } } private list<system.windows.point> generateeclipsegeometry(system.windows.point st, system.windows.point ed) { double a = 0.5 * (ed.x - st.x); double b = 0.5 * (ed.y - st.y); list<system.windows.point> pointlist = new list<system.windows.point>(); for (double r = 0; r <= 2 * math.pi; r = r + 0.01) { pointlist.add(new system.windows.point(0.5 * (st.x + ed.x) + a * math.cos(r), 0.5 * (st.y + ed.y) + b * math.sin(r))); } return pointlist; } private void inkcanvasmeasure_mousedown(object sender, mousebuttoneventargs e) { if (e.leftbutton == mousebuttonstate.pressed) { inip = e.getposition(inkcanvasmeasure); } } private void inkcanvasmeasure_mousemove(object sender, mouseeventargs e) { if (e.leftbutton == mousebuttonstate.pressed) { // draw square if (btnsquare.ischecked == true) { system.windows.point endp = e.getposition(inkcanvasmeasure); list<system.windows.point> pointlist = new list<system.windows.point> { new system.windows.point(inip.x, inip.y), new system.windows.point(inip.x, endp.y), new system.windows.point(endp.x, endp.y), new system.windows.point(endp.x, inip.y), new system.windows.point(inip.x, inip.y), }; styluspointcollection point = new styluspointcollection(pointlist); stroke stroke = new stroke(point) { drawingattributes = inkcanvasmeasure.defaultdrawingattributes.clone() }; viewmodel.inkstrokes.clear(); viewmodel.inkstrokes.add(stroke); } // draw eclipse else if (btnellipse.ischecked == true) { system.windows.point endp = e.getposition(inkcanvasmeasure); list<system.windows.point> pointlist = generateeclipsegeometry(inip, endp); styluspointcollection point = new styluspointcollection(pointlist); stroke stroke = new stroke(point) { drawingattributes = inkcanvasmeasure.defaultdrawingattributes.clone() }; viewmodel.inkstrokes.clear(); viewmodel.inkstrokes.add(stroke); } } } } }
viewmodel.cs代码
using system; using system.collections.generic; using system.componentmodel; using system.linq; using system.text; using system.threading.tasks; using system.windows.ink; namespace wpf_inkcanvas { class viewmodel : inotifypropertychanged { public event propertychangedeventhandler propertychanged; protected virtual void onpropertychanged(string propertyname = null) { if (propertychanged != null) propertychanged.invoke(this, new propertychangedeventargs(propertyname)); } private string meainfo; public string meainfo { get => meainfo; set { meainfo = value; onpropertychanged("meainfo"); } } private strokecollection inkstrokes; public strokecollection inkstrokes { get { return inkstrokes; } set { inkstrokes = value; onpropertychanged("inkstrokes"); } } } }
补充说明:为什么要注释掉画笔属性//fittocurve = true,可以自行体会下不注释会是个什么效果;将inkcanvas的strokes绑定到变量有好处,在别的窗口也能获取到这个对象的哦,因为它是在viewmodel里的,传viewmodel参数就可以了;椭圆绘制完成后设置inkcanvas的edittingmode为select就可以修改大小和形状。
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。
推荐阅读
-
WPF InkCanvas绘制矩形和椭圆
-
Android编程之canvas绘制各种图形(点,直线,弧,圆,椭圆,文字,矩形,多边形,曲线,圆角矩形)
-
教你用CorelDRAW绘制矩形和方形 矩形工具的使用方法和应用技巧介绍
-
使用CorelDRAW椭圆工具绘制椭圆和圆形
-
HTML5如何为形状图上颜色怎么绘制具有颜色和透明度的矩形
-
WPF InkCanvas绘制矩形和椭圆
-
借助HTML5 Canvas来绘制三角形和矩形等多边形的方法
-
教你用CorelDRAW绘制矩形和方形 矩形工具的使用方法和应用技巧介绍
-
使用CorelDRAW椭圆工具绘制椭圆和圆形
-
html5 canvas绘制矩形和圆形的实例代码