基于MFC的简单画图程序实验

1、简单画图程序【实验目的】本实验目的是通过构建基于mfc的windows画图程序，使学生：(1) 理解mfc应用程序的运行机制(2) 掌握使用mfc构建windows应用程序的基本结构及编程的基本方法(3) 理解和掌握mfc应用程序消息处理机制及应用(4) 掌握类向导（classwizard）的使用【实验要求】(1) 必须做好实验原理的预习。(2) 需要对提供的程序代码进行分析，并明确实验时还应在何处添加哪些语句。【实验环境】microsoft windows xpmicrosoft visual c+ 6.01 基本功能描述1) 在单文档菜单中，在菜单行中可插入一个菜单项，命名为绘图，在下拉菜

2、单中可分别设置绘制的图形形状，如直线、矩形及椭圆，线宽选项，有1-5可供选择，还可以设置线色以及填充色，通过弹出的颜色对话框选择需要的颜色，如果不选择线宽、线色以及填充色，则按默认的画笔，画刷来绘制选择的图形。 2) 选择好图形后，通过鼠标可以绘制出相应的直线，矩形或椭圆，鼠标的按下确定图形的起点，鼠标的拖动则确定了图形的终点，即通过鼠标的拖动来决定图形的大小，当鼠标弹起，此图形则绘制完毕。3) 增添工具栏，设置绘制的图形形状，线色以及填充色，可更方便地选择相应的功能。2 设计思路 1) 对需要用到的变量进行初始化。2) 选择相应的图形之后就响应相应的消息处理函数，给shape赋对应的值。选择

3、不同的线宽，线色与填充色，即可改变画笔或画刷的属性。3) 鼠标的按下响应函数onlbuttondown()，捕捉鼠标当前位置得到起点的坐标，鼠标的拖动响函数onmousemove()改变终点的坐标，鼠标的弹起响应onlbuttonup()，确定终点坐标，刷新，得到绘制图形。4) 选择图形或其它属性，可进行下一次绘制。开始 定义并初始化变shape 线色m_ncolor 填充色 m_fcolor 画笔pen画刷brush绘图起点opoint绘图终点cpoint选择线宽默认值（w=1）改变画笔属性选择线色默认值（黑色）改变画笔属性选择填充色默认值（黑色）改变画刷属性椭圆矩形直线响应函数onelli

4、pse()shape=3响应函数online()shape=1响应函数onrect()shape=2鼠标左键按下 响应函数onlbuttondown()opoint=point鼠标移动 响应函数onmousemove()epoint=point响应onpaint()，绘制图形鼠标左键弹起响应函数onlbuttonup()刷新，得到图形结束图1 程序流程图3 软件设计3.1 设计步骤1）创建单文档创建一个mfc appwizardexe工程，命名为“yinshuyan”，如图2所示，并创建单文档，如图3所示。创建成功后，系统自动生成相应的类，如图4所示。图2 创建工程图3 创建单文档图4 生成类

5、2） 编辑菜单添加需要的菜单项，如图5所示（可以通过拖动调整菜单的顺序）；并在菜单的属性中设定好所对应的id，如图6所示，各项菜单对应的id如表1所示（其中线宽菜单为弹出菜单，只需在菜单项目属性中的弹出选项前打勾即可，分隔线亦只需在菜单项目属性中选中分隔符（separator）选项即可）。图5 添加菜单项图6 设置菜单id表1 菜单项对应id菜单名id菜单名id直线id_line线宽1id_w1矩形id_rect线宽2id_w2椭圆id_ellipse线宽3id_w3颜色id_color线宽4id_w4填充色id_fillcolor线宽5id_w5建立类向导，在视图类cyinshuyanvie

6、w（通过菜单view-classwizard，或者快捷键ctrl+w打开）中，对各菜单项添加对应的command消息处理函数，部分菜单项还添加对应的update_command_ui消息函数，如图7所示。图7 建立类向导【注意：此图有误，class name的下拉框中，应选择“cyinshuyanview”而非此图显示的“cmainframe” 】上述操作完成后，可以发现在class cmainframe中自动增加了类似online()之类的许多函数，并且在源文件mainfrm.cpp中，自动添加了相应的消息映射。begin_message_map(cmainframe, cframewnd)

7、/afx_msg_map(cmainframe)on_wm_create()on_command(id_line, online)end_message_map()3）创建工具栏在插入处选择资源（菜单insert-resource，或者快捷键ctrl+r），新建工具栏，如图8所示；图8 新建工具栏在工具栏上添加相应的按钮，在属性处更改其id，如图9所示。图9 编辑工具栏4）在相应消息函数处添加代码，实现其功能建立类向导，在视图类cyinshuyanview中，添加wm_paint消息，以及wm_lbuttondown、wm_lbuttonup、wm_mousemove消息，并在其中添加相应的代

8、码，如图10所示。图10 添加wm_paint消息3.2 界面设计各控件名称，类型，属性及相关变量如表2所示。 表2 界面控件表控件名称控件类型属性相关变量绘图下拉式菜单 无 无 直线菜单项工具栏按钮id_lineint shape矩形菜单项工具栏按钮id_rectint shape椭圆菜单项 工具栏按钮id_ellipseint shape线宽弹出式菜单 无int w颜色(线色)菜单项工具栏按钮id_colorcolorref m_ncolor填充色菜单项工具栏按钮id_fillcolorcolorref m_fcolor 3.3 关键源代码1) 在“mainfrm.h”中，在class c

9、mainframe : public cframewnd里的protected下定义： ctoolbar m_drawtoolbar; /工具栏2)在“mainfrm.cpp”中，在cmainframe:oncreate(lpcreatestruct lpcreatestruct)里添加以下代码：if (!m_drawtoolbar.create(this) |!m_drawtoolbar.loadtoolbar(idr_draw)trace0(failed to create status barn);return -1; 3)在“yinshuyanview.h”中，在class cyins

10、huyanview : public cview里的public下定义相关变量：colorref m_ncolor;colorref m_fcolor;cpoint cpoint; cpoint opoint;bool m_down;int w;int shape; 4)在“yinshuyanview.cpp”中，添加如下函数及代码： cyinshuyanview: cyinshuyanview() w=1; /初始线宽默认为1 shape=0; void cyinshuyanview:onw1() w=1; /令线宽为1void cyinshuyanview:onw2() w=2; /令线宽

11、为2void cyinshuyan:onw3() w=3; /令线宽为3void cyinshuyanview:onw4() w=4; /令线宽为4void cyinshuyanview:onw5() w=5; /令线宽为5void cyinshuyanview:onupdatew1(ccmdui* pcmdui) pcmdui-setradio(w=1); /当线宽为1时，此选项前标有圆点void cyinshuyanview:onupdatew2(ccmdui* pcmdui) pcmdui-setradio(w=2); /当线宽为2时，此选项前标有圆点void cyinshuyanvie

12、w:onupdatew3(ccmdui* pcmdui) pcmdui-setradio(w=3); /当线宽为3时，此选项前标有圆点void cyinshuyanview:onupdatew4(ccmdui* pcmdui) pcmdui-setradio(w=4); void cyinshuyanview:onupdatew5(ccmdui* pcmdui) pcmdui-setradio(w=5);void cyinshuyanview:online() shape=1; /选择直线，则令shape为1void cyinshuyanview:onrect() shape=2; /选择矩形

13、，则令shape为2void cyinshuyanview:onellipse() shape=3; /选择椭圆，则令shape为3void cyinshuyanview:onupdateline(ccmdui* pcmdui) pcmdui-setcheck(shape=1); /shape为1时，直线选项前打上勾void cyinshuyanview:onupdaterect(ccmdui* pcmdui) pcmdui-setcheck(shape=2); /shape为2时，矩形选项前打上勾void cyinshuyanview:onupdateellipse(ccmdui* pcmd

14、ui) pcmdui-setcheck(shape=3); /shape为3时，椭圆选项前打上勾void cyinshuyanview:oncolor() ccolordialog color; / 创建颜色对话框 if(color.domodal() = idok) / 如果用户点击ok按钮 m_ncolor=color.getcolor(); / 更改颜色,把颜色赋到m_ncolorvoid cyinshuyanview:onfillcolor() ccolordialog fillcolor; / 创建颜色对话框 if(fillcolor.domodal() = idok) / 如果用户

15、点击ok按钮 m_fcolor=fillcolor.getcolor(); / 更改颜色,把颜色赋到m_fcolorvoid cyinshuyanview:onpaint() cpaintdc dc(this); / device context for painting cpen pen; /定义画笔 cbrush brush; /定义画刷 pen.createpen(ps_solid,w, m_ncolor); /创建画笔 brush.createsolidbrush(m_fcolor); /创建画刷 dc.selectobject(&pen); /获取画笔 dc.selectobject

16、(&brush); /获取画刷 if(shape=1) dc.moveto(opoint.x,opoint.y); dc.lineto(cpoint.x,cpoint.y); /绘制直线,从opoint到cpoint连线 if(shape=2) dc.rectangle(opoint.x,opoint.y,cpoint.x,cpoint.y); /绘制矩形 if(shape=3) dc.ellipse(opoint.x,opoint.y,cpoint.x,cpoint.y);/绘制椭圆void cyinshuyanview:onlbuttondown(uint nflags, cpoint p

17、oint) / todo: add your message handler code here and/or call default m_down=true; /鼠标按下 setcapture(); /获取坐标opoint=point; /把鼠标所在坐标赋给起点坐标opoint releasecapture(); /释放坐标cview:onlbuttondown(nflags, point);void cyinshuyanview:onmousemove(uint nflags, cpoint point) if(m_down) /如果鼠标按下cpoint=point; /把鼠标所在点坐标

18、赋给终点坐标cpoint cview:onmousemove(nflags, point);void cyinshuyanview:onlbuttonup(uint nflags, cpoint point) m_down=false; /鼠标不按下，即弹起 invalidate(0); /刷新 cview:onlbuttonup(nflags, point);3.4 关键功能实现1）选择要绘制的图形在直线、矩形以及椭圆的消息处理函数里为shape分别赋值为1,2,3，在onpaint()函数里添加3个if语句的代码来这实现这三个图形的绘制：当选择画直线时，shape=1，则执行绘制直线代码，

19、当选择画矩形时，shape =2,则执行绘制矩形的代码，当性选择画椭圆时,shape=3,则执行绘制椭圆的代码。2）改变线宽 在onpaint()创建的画笔中，pen.createpen(ps_solid,w, m_ncolor)，线宽处用w表示，则改变w的值即改变了画笔的粗细。选择菜单绘图线宽选择划线宽度值，此时所选的线宽值就赋给线宽变量w。若不选择线宽值，则w=1(即默认线宽值为1)。3）改变线色 在onpaint()创建的画笔中，pen.createpen(ps_solid,w, m_ncolor)，线的颜色处用m_ncolor表示，则改变m_ncolor即改变了画笔的颜色。选择菜单绘图

20、颜色，会弹出通过wm_colorref从系统中引入的颜色选择对话框，选择颜色后，点击确定则相应颜色值就赋给变量m_ncolor，此时画笔的颜色就会发上变化。若不选择颜色，则默认（线）颜色为黑色。4）改变填充色 在onpaint()创建的画刷中，brush.createsolidbrush(m_fcolor)，颜色就是用m_fcolor表示的，改变m_fcolor即改变了画刷的颜色。选择菜单绘图填充色，会弹出通过wm_colorref从系统中引入的颜色选择对话框，选择颜色后，点击确定则相应颜色值就赋给变量m_fcolor，此时画刷的颜色就会发上变化。若不选择颜色，则默认填充色为黑色。5）绘制图形

21、 鼠标左键按下，则捕获鼠标此时的位置坐标为画图的起点，此时在onlbuttondown()函数里，将捕获的坐标值赋给定义作为起点的变量opoint；按下鼠标左键拖动鼠标时，捕捉鼠标当前位置坐标值为终点坐标值，此时在onmousemove()函数里，把捕获的坐标值赋给定义作为终点的变量cpoint，onpaint()中绘图的代码中的坐标都得到了，进行绘图；鼠标左键弹起时，此时绘图结束，鼠标弹起时所在位置就是画图的最终终点位置，画图结束后，刷新窗口，以便重新画图，此时执行的是onlbuttonup()函数。这次实验中关键就是确定画图起点及终点坐标，因为是用鼠标绘制图形，所以需用函数来捕获鼠标当前所

22、在位置的坐标，因此设置了onlbuttondown()函数来捕获起点坐标，onmousemove()函数来捕获鼠标移动是的当前位置坐标，onlbuttonup()函数来捕获终点坐标。而绘制图形使用的函数是onpaint()，将图形的起点和终点坐标和鼠标的位置坐标相联系后就能用鼠标来绘制图形了，所以在它们之间用opoint和cpoint两变量实现链接。另外将绘图语句集中在onpaint()函数中，然后其他函数来调用onpaint()函数，这样不容易引起混乱，同时程序更简单，更有条理，便于修改。4. 思考题1）说明直线、椭圆、矩形绘制使用的函数，及其参数含义？ 答：直线、椭圆、矩形绘制使用的函数是onpaint()。函数里面定义和创建了绘图的画笔pen和填充图形的画刷brush，3种图形本身对应的消息处理函数里分别赋给shape3个不同的值：1，2，3，在onpaint()里有3个if语句，用来这实现这三个图形的绘制：当选择画直线时，shape=1，则执行绘制直线代码，当选择画矩形时，shape =2,则执行绘制矩形的代码，当性选择画椭圆时,shape=3,则执行绘制椭圆的代码。2）如何控制菜单项的状态，使用的消息类型？答：通过添加up