專業(yè)課程設(shè)計2(面向?qū)ο蟪绦蛟O(shè)計)課程設(shè)計說明書簡單畫圖程序設(shè)計

1、武漢理工大學(xué)專業(yè)課程設(shè)計2(面向?qū)ο蟪绦蛟O(shè)計)課程設(shè)計說明書目 錄1 基本功能描述12 設(shè)計思路13 軟件設(shè)計33.1 設(shè)計步驟33.2 界面設(shè)計73.3 關(guān)鍵功能實現(xiàn)84 結(jié)論與心得體會95. 參考文獻106. 思考題107. 附錄117.1 調(diào)試報告117.2 測試結(jié)果117.3 關(guān)鍵源代碼13簡單畫圖程序1 基本功能描述1) 在單文檔菜單中，在菜單行中可插入一個菜單項，命名為繪圖，在下拉菜單中可分別設(shè)置繪制的圖形形狀，如直線、矩形及橢圓，線寬選項，有1-5可供選擇，還可以設(shè)置線色以及填充色，通過彈出的顏色對話框選擇需要的顏色，如果不選擇線寬、線色以及填充色，則按默認的畫筆，畫刷來繪制選擇

2、的圖形。 2) 選擇好圖形后，通過鼠標(biāo)可以繪制出相應(yīng)的直線，矩形或橢圓，鼠標(biāo)的按下確定圖形的起點，鼠標(biāo)的拖動則確定了圖形的終點，即通過鼠標(biāo)的拖動來決定圖形的大小，當(dāng)鼠標(biāo)彈起，此圖形則繪制完畢。3) 增添工具欄，設(shè)置繪制的圖形形狀，線色以及填充色，可更方便地選擇相應(yīng)的功能。2 設(shè)計思路 1) 對需要用到的變量進行初始化。2) 選擇相應(yīng)的圖形之后就響應(yīng)相應(yīng)的消息處理函數(shù)，給shape賦對應(yīng)的值。選擇不同的線寬，線色與填充色，即可改變畫筆或畫刷的屬性。3) 鼠標(biāo)的按下響應(yīng)函數(shù)onlbuttondown()，捕捉鼠標(biāo)當(dāng)前位置得到起點的坐標(biāo)，鼠標(biāo)的拖動響函數(shù)onmousemove()改變終點的坐標(biāo)，鼠標(biāo)

3、的彈起響應(yīng)onlbuttonup()，確定終點坐標(biāo)，刷新，得到繪制圖形。4) 選擇圖形或其它屬性，可進行下一次繪制。開始 定義并初始化變shape 線色m_ncolor 填充色 m_fcolor 畫筆pen畫刷brush繪圖起點opoint繪圖終點cpoint選擇線寬默認值（w=1）改變畫筆屬性選擇線色默認值（黑色）改變畫筆屬性選擇填充色默認值（黑色）改變畫刷屬性橢圓矩形直線響應(yīng)函數(shù)onellipse()shape=3響應(yīng)函數(shù)online()shape=1響應(yīng)函數(shù)onrect()shape=2鼠標(biāo)左鍵按下 響應(yīng)函數(shù)onlbuttondown()opoint=point鼠標(biāo)移動 響應(yīng)函數(shù)onmo

4、usemove()epoint=point響應(yīng)onpaint()，繪制圖形鼠標(biāo)左鍵彈起響應(yīng)函數(shù)onlbuttonup()刷新，得到圖形結(jié)束圖1 程序流程圖3 軟件設(shè)計3.1 設(shè)計步驟1）創(chuàng)建單文檔創(chuàng)建一個mfc appwizardexe工程，命名為“yinshuyan”，如圖1所示，并創(chuàng)建單文檔，如圖2所示。創(chuàng)建成功后，系統(tǒng)自動生成相應(yīng)的類，如圖3所示。圖2 創(chuàng)建工程圖3 創(chuàng)建單文檔圖4 生成類2） 編輯菜單添加需要的菜單項，如圖4所示；并在菜單的屬性中設(shè)定好所對應(yīng)的id，如圖5所示，各項菜單對應(yīng)的id如表1所示（其中線寬菜單為彈出菜單，只需在菜單項目屬性中的彈出選項前打勾即可，分隔線亦只需在

5、菜單項目屬性中選中分隔符選項即可）。圖5 添加菜單項圖6 設(shè)置菜單id表1 菜單項對應(yīng)id菜單名id菜單名id直線id_line線寬1id_w1矩形id_rect線寬2id_w2橢圓id_ellipse線寬3id_w3顏色id_color線寬4id_w4填充色id_fillcolor線寬5id_w5建立類向?qū)?，在視圖類cyinshuyanview中，對各菜單項添加對應(yīng)的command消息處理函數(shù)，部分菜單項還添加對應(yīng)的update_command_ui消息函數(shù)，如圖6所示。圖7 建立類向?qū)?）創(chuàng)建工具欄在插入處選擇資源，新建工具欄，如圖7所示；圖8 新建工具欄在工具欄上添加相應(yīng)的按鈕，在屬性處

6、更改其id，如圖8所示。圖9 編輯工具欄4）在相應(yīng)消息函數(shù)處添加代碼，實現(xiàn)其功能建立類向?qū)?，在視圖類cyinshuyanview中，添加wm_paint消息，以及wm_lbuttondown、wm_lbuttonup、wm_mousemove消息，并在其中添加相應(yīng)的代碼，如圖9所示。圖10 添加wm_paint消息3.2 界面設(shè)計各控件名稱，類型，屬性及相關(guān)變量如表2所示。 表2 界面控件表控件名稱控件類型屬性相關(guān)變量繪圖下拉式菜單 無 無 直線菜單項工具欄按鈕id_lineint shape矩形菜單項工具欄按鈕id_rectint shape 續(xù)表2 界面控件表控件名稱控件類型屬性相關(guān)變量橢

7、圓菜單項 工具欄按鈕id_ellipseint shape線寬彈出式菜單 無int w顏色(線色)菜單項工具欄按鈕id_colorcolorref m_ncolor填充色菜單項工具欄按鈕id_fillcolorcolorref m_fcolor3.3 關(guān)鍵功能實現(xiàn)1）選擇要繪制的圖形在直線、矩形以及橢圓的消息處理函數(shù)里為shape分別賦值為1,2,3，在onpaint()函數(shù)里添加3個if語句的代碼來這實現(xiàn)這三個圖形的繪制：當(dāng)選擇畫直線時，shape=1，則執(zhí)行繪制直線代碼，當(dāng)選擇畫矩形時，shape =2,則執(zhí)行繪制矩形的代碼，當(dāng)性選擇畫橢圓時,shape=3,則執(zhí)行繪制橢圓的代碼。2）改變

8、線寬 在onpaint()創(chuàng)建的畫筆中，pen.createpen(ps_solid,w, m_ncolor)，線寬處用w表示，則改變w的值即改變了畫筆的粗細。選擇菜單繪圖線寬選擇劃線寬度值，此時所選的線寬值就賦給線寬變量w。若不選擇線寬值，則w=1(即默認線寬值為1)。3）改變線色 在onpaint()創(chuàng)建的畫筆中，pen.createpen(ps_solid,w, m_ncolor)，線的顏色處用m_ncolor表示，則改變m_ncolor即改變了畫筆的顏色。選擇菜單繪圖顏色，會彈出通過wm_colorref從系統(tǒng)中引入的顏色選擇對話框，選擇顏色后，點擊確定則相應(yīng)顏色值就賦給變量m_nco

9、lor，此時畫筆的顏色就會發(fā)上變化。若不選擇顏色，則默認（線）顏色為黑色。4）改變填充色 在onpaint()創(chuàng)建的畫刷中，brush.createsolidbrush(m_fcolor)，顏色就是用m_fcolor表示的，改變m_fcolor即改變了畫刷的顏色。選擇菜單繪圖填充色，會彈出通過wm_colorref從系統(tǒng)中引入的顏色選擇對話框，選擇顏色后，點擊確定則相應(yīng)顏色值就賦給變量m_fcolor，此時畫刷的顏色就會發(fā)上變化。若不選擇顏色，則默認填充色為黑色。5）繪制圖形 鼠標(biāo)左鍵按下，則捕獲鼠標(biāo)此時的位置坐標(biāo)為畫圖的起點，此時在onlbuttondown()函數(shù)里，將捕獲的坐標(biāo)值賦給定義

10、作為起點的變量opoint；按下鼠標(biāo)左鍵拖動鼠標(biāo)時，捕捉鼠標(biāo)當(dāng)前位置坐標(biāo)值為終點坐標(biāo)值，此時在onmousemove()函數(shù)里，把捕獲的坐標(biāo)值賦給定義作為終點的變量cpoint，onpaint()中繪圖的代碼中的坐標(biāo)都得到了，進行繪圖；鼠標(biāo)左鍵彈起時，此時繪圖結(jié)束，鼠標(biāo)彈起時所在位置就是畫圖的最終終點位置，畫圖結(jié)束后，刷新窗口，以便重新畫圖，此時執(zhí)行的是onlbuttonup()函數(shù)。4 結(jié)論與心得體會 這次課程設(shè)計我成功的完成了。通過本次課程設(shè)計，我完成了用移動鼠標(biāo)對直線，矩形，橢圓的簡單繪制工具的的制作，其中完成了繪圖形狀的選擇，畫圖線寬、線色以及圖形填充色的設(shè)置。 基于平時課外上機實驗的

11、練習(xí)，對菜單的創(chuàng)建，command消息處理函數(shù)和 update_command_ui消息函數(shù)的添加過程比較熟練，這部分還算簡單。難的是代碼的添加，對繪制圖形的程序有大概的思路，但具體編寫時變量的運用以及函數(shù)的調(diào)用設(shè)置。這次實驗中關(guān)鍵就是確定畫圖起點及終點坐標(biāo)，因為是用鼠標(biāo)繪制圖形，所以需用函數(shù)來捕獲鼠標(biāo)當(dāng)前所在位置的坐標(biāo)，因此我設(shè)置了onlbuttondown()函數(shù)來捕獲起點坐標(biāo)，onmousemove()函數(shù)來捕獲鼠標(biāo)移動是的當(dāng)前位置坐標(biāo)，onlbuttonup()函數(shù)來捕獲終點坐標(biāo)。而繪制圖形使用的函數(shù)是onpaint()，將圖形的起點和終點坐標(biāo)和鼠標(biāo)的位置坐標(biāo)相聯(lián)系后就能用鼠標(biāo)來繪制圖

12、形了，所以在它們之間用opoint和cpoint兩變量實現(xiàn)鏈接。另外我覺得將繪圖語句集中在onpaint()函數(shù)中，然后其他函數(shù)來調(diào)用onpaint()函數(shù)，這樣不容易引起混亂，同時程序更簡單，更有條理，便于修改。這次課程設(shè)計雖只是做了一個極其簡單的繪圖工具的制作，但也讓我從設(shè)計者的角度看到了設(shè)計程序以及電腦軟件工具的實質(zhì)及難度，看似一個很簡單的工具，其制作的背后工作是很大的，不光是圖標(biāo)，按鈕的設(shè)置，程序的編寫，代碼的實現(xiàn)都是很精密且不容許一點錯誤的工作。平時我們使用的很順手的一個小小工具，其開發(fā)的各項小號都不可小覷，由此，我們需要學(xué)的東西還太多太多。5. 參考文獻1揣錦華.面向?qū)ο蟪绦蛟O(shè)計與

13、vc+實踐.西安電子科技大學(xué)出版社.2005. 2魏亮, 李春葆編著.visual c+程序設(shè)計例學(xué)與實踐.清華大學(xué)出版社.2006.3嚴華峰等.visual c+課程設(shè)計案例精編(第二版) .中國水利水電出版社 2004.6. 思考題1）說明直線、橢圓、矩形繪制使用的函數(shù)，及其參數(shù)含義？ 答：直線、橢圓、矩形繪制使用的函數(shù)是onpaint()。函數(shù)里面定義和創(chuàng)建了繪圖的畫筆pen和填充圖形的畫刷brush，3種圖形本身對應(yīng)的消息處理函數(shù)里分別賦給shape3個不同的值：1，2，3，在onpaint()里有3個if語句，用來這實現(xiàn)這三個圖形的繪制：當(dāng)選擇畫直線時，shape=1，則執(zhí)行繪制直線

14、代碼，當(dāng)選擇畫矩形時，shape =2,則執(zhí)行繪制矩形的代碼，當(dāng)性選擇畫橢圓時,shape=3,則執(zhí)行繪制橢圓的代碼。2）如何控制菜單項的狀態(tài)，使用的消息類型？答：通過添加update_command_ui消息函數(shù)，在生成的函數(shù)里添加相關(guān)代碼來控制菜單項的狀態(tài)及使用的消息類型。如選擇直線時，使shape=1，則onupdateline里添加pcmdui-setcheck(shape=1)，那么當(dāng)shape的值為1時，即代表選擇了直線項，此時菜單中的直線選項前就打勾了，代表選中。矩形和橢圓類似。3）如何設(shè)置菜單和工具欄按鈕的快捷鍵操作？ 答：在資源視圖下選擇accelerator，雙擊idr_m

15、ainframe，打開編輯窗口，雙擊空白處，在id下拉列表框中選擇需要快捷鍵的菜單項或工具欄按鈕的id，在鍵一欄中輸入快捷鍵，選擇ctrl復(fù)選框和虛擬鍵單選按鈕即可，如圖10所示。圖11 快捷鍵的創(chuàng)建7. 附錄7.1 調(diào)試報告1）一開始我并沒有添加刷新函數(shù)invalidate()，這就使程序運行之后，無論鼠標(biāo)左鍵按下時如何移動無法繪圖，這是因為當(dāng)一個窗口內(nèi)鍵入內(nèi)容其實就是將窗口刷新了，相當(dāng)于更新了窗口，故必須有刷新函數(shù)，這和生活中的白紙寫字不一樣。2）當(dāng)添加invalidate()后，我把invalidate()放在onmousemove()里，但是這樣只能在窗口內(nèi)畫一個圖形，即每畫完一個圖形

16、就刷新一次。之后我通過與同學(xué)討論，并查找資料將invalidate()改為了invalidate(0)，這時是可繪制多個圖形，但鼠標(biāo)每移動一個位置都進行一次刷新，繪圖結(jié)束后，繪圖過程中的所有痕跡都在，產(chǎn)生了很多拖動的影子。，經(jīng)過幾次試驗，我將invalidate(0) 放在了onlbuttonup()中，那么每次重繪，上次的圖形會作為背景被保留下來，而不會被刷新掉。7.2 測試結(jié)果1)點擊鏈接，編譯，運行后的窗口如圖11所示。圖11 運行結(jié)果2）改變繪制圖形形狀，顏色，線寬，填充色之后繪制的圖形如圖12所示。圖12 改便各項屬性厚后的圖形 7.3 關(guān)鍵源代碼1) 在“mainfrm.h”中，在

17、class cmainframe : 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”中，在clas

18、s cyinshuyanview : public cview里的public下定義相關(guān)變量： colorref m_ncolor; colorref m_fcolor; cpoint cpoint; cpoint opoint; bool m_down; int w; int shape; 4)在“yinshuyanview.cpp”中，添加如下函數(shù)及代碼： cyinshuyanview: cyinshuyanview() w=1; /初始線寬默認為1 shape=0; void cyinshuyanview:onw1() w=1; /令線寬為1void cyinshuyanview:onw

19、2() w=2; /令線寬為2void cyinshuyan:onw3() w=3; /令線寬為3void cyinshuyanview:onw4() w=4; /令線寬為4void cyinshuyanview:onw5() w=5; /令線寬為5void cyinshuyanview:onupdatew1(ccmdui* pcmdui) pcmdui-setradio(w=1); /當(dāng)線寬為1時，此選項前標(biāo)有圓點void cyinshuyanview:onupdatew2(ccmdui* pcmdui) pcmdui-setradio(w=2); /當(dāng)線寬為2時，此選項前標(biāo)有圓點void

20、cyinshuyanview:onupdatew3(ccmdui* pcmdui) pcmdui-setradio(w=3); /當(dāng)線寬為3時，此選項前標(biāo)有圓點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() s

21、hape=2; /選擇矩形，則令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

22、(ccmdui* pcmdui) pcmdui-setcheck(shape=3); /shape為3時，橢圓選項前打上勾void cyinshuyanview:oncolor() ccolordialog color; / 創(chuàng)建顏色對話框 if(color.domodal() = idok) / 如果用戶點擊ok按鈕 m_ncolor=color.getcolor(); / 更改顏色,把顏色賦到m_ncolorvoid cyinshuyanview:onfullcolor() ccolordialog fullcolor; / 創(chuàng)建顏色對話框 if(fullcolor.domodal() =

23、 idok) / 如果用戶點擊ok按鈕 m_fcolor=fullcolor.getcolor(); / 更改顏色,把顏色賦到m_fcolorvoid cyinshuyanview:onpaint() cpaintdc dc(this); / device context for painting cpen pen; /定義畫筆 cbrush brush; /定義畫刷 pen.createpen(ps_solid,w, m_ncolor); /創(chuàng)建畫筆 brush.createsolidbrush(m_fcolor); /創(chuàng)建畫刷 dc.selectobject(&pen); /獲取畫筆 dc.selectobject(&brush); /獲取