《交互式技術(shù)》PPT課件.ppt

1、計(jì)算機(jī)圖形學(xué)基礎(chǔ),第5章 交互式技術(shù),本章主要內(nèi)容,常用的交互技術(shù) 交互技術(shù)的實(shí)現(xiàn)（鼠標(biāo)繪圖） 二維圖形技術(shù)綜合應(yīng)用,什么是交互技術(shù)？ 指使用輸入設(shè)備進(jìn)行輸入的技術(shù)。 作用：交互式繪圖 主要內(nèi)容： 交互設(shè)備 交互任務(wù) 基本交互技術(shù)（如橡皮筋技術(shù)）的實(shí)現(xiàn),交互式繪圖,設(shè)計(jì)者在操作計(jì)算機(jī)系統(tǒng)繪圖時(shí)，人與計(jì)算機(jī)之間進(jìn)行信息交換，從而完成復(fù)雜的繪圖任務(wù)。 需要：交互式技術(shù) 常見(jiàn)系統(tǒng)： AutoCAD 、Photoshop、3DMAX （視景仿真） Creator、Vega,交互技術(shù)、交互設(shè)備、交互任務(wù)三者關(guān)系,用戶,交互界面,系統(tǒng)程序員 圖形庫(kù),交互設(shè)備,交互技術(shù),交互技術(shù),交互任務(wù),圖形輸入設(shè)備的邏

2、輯分類,輸入控制,請(qǐng)求模式（Request Mode） 輸入設(shè)備在應(yīng)用程序的控制下工作，程序在輸入請(qǐng)求發(fā)出后一直被置于等待狀態(tài)，直到數(shù)據(jù)輸入。 取樣模式 （Sample Mode ） 應(yīng)用程序與輸入設(shè)備同時(shí)工作，當(dāng)輸入設(shè)備工作時(shí)，存儲(chǔ)輸入數(shù)據(jù)，并不斷更新當(dāng)前數(shù)據(jù)，當(dāng)程序要求輸入時(shí)，程序采用當(dāng)前數(shù)據(jù)值。 事件模式 （Event Mode ） 每次用戶對(duì)輸入設(shè)備的一次操作以及形成的數(shù)據(jù)稱為一個(gè)事件（Event），事件按先后順序排成隊(duì)列，先進(jìn)先出，設(shè)備被設(shè)置為事件方式，程序與設(shè)備同時(shí)工作。,5.1 常用的交互技術(shù),一個(gè)交互圖形系統(tǒng)或圖形應(yīng)用程序，必須允許用戶動(dòng)態(tài)的輸入坐標(biāo)，指定選擇功能，拾取操作對(duì)象

3、，設(shè)置變換坐標(biāo)，以及在圖形顯示時(shí)對(duì)圖形的局部進(jìn)行修改（例如平移、旋轉(zhuǎn)、縮放等比例變換）、刪除等操作。用戶還可以允許使用橡皮筋技術(shù)，拖動(dòng)技術(shù)等交互技術(shù)來(lái)進(jìn)行繪圖。這種交互繪圖方式完全區(qū)別于通過(guò)程序自動(dòng)運(yùn)行產(chǎn)生的繪圖方式。,橡皮條技術(shù),定位技術(shù),拖拽技術(shù),定值技術(shù),菜單技術(shù),柵格技術(shù),拾取技術(shù),約束技術(shù),吸附技術(shù)（引力域）,插入符號(hào)、回顯功能,直線、圓、矩形橡皮筋,5.1 常用的交互技術(shù), 定位技術(shù),5.1 常用的交互技術(shù),用來(lái)給應(yīng)用程序指定位置坐標(biāo)（x，y）或（x，y，z）。 完成此任務(wù)一般情況下可采取兩種方法， 其一，用鼠標(biāo)移動(dòng)屏幕上的光標(biāo)到滿意的位置， 然后按一下鼠標(biāo)左鍵； 其二，用鍵盤直接

4、輸入滿意的位置坐標(biāo)。 另外，還可以將這些技術(shù)混合在一起作用，,5.1.1 定位技術(shù),5.1.1 定位技術(shù),定位是圖形輸入和圖形操作時(shí)常用的輸入操作之一。 定位有直接定位和間接定位兩種方式。,void cursor(int x,int y) setwritemode(XOR_PUT); line(x+3,y,x-3,y); line(x,y-3,x,y+3); ,鼠標(biāo)等設(shè)備的相對(duì)移動(dòng)控制光標(biāo)定位(異或方式顯示光標(biāo)) 在屏幕指定位置畫一個(gè)十字光標(biāo)：void cursor(int x,int y),5.1.2橡皮筋技術(shù),定位操作有時(shí)依賴于環(huán)境。例如，在繪圖時(shí)，已經(jīng)存在一個(gè)圓C和圓外一點(diǎn)A，現(xiàn)在要確定

5、另外一點(diǎn)B，使兩點(diǎn)連線AB與圓C相切。這種點(diǎn)的確定可通過(guò)使用橡皮條技術(shù)而變得容易實(shí)現(xiàn)。,用橡皮條技術(shù)定位(顯示線段用異或方式),橡皮筋技術(shù)(續(xù)),橡皮筋技術(shù)圖例,5.1. 3 拖拽技術(shù),拖曳技術(shù)被用于拼裝定位和其他一些操作(如布局操作)中去，以便使工作變得直觀、簡(jiǎn)便、高效。,拖曳一個(gè)二極管符號(hào),拖曳技術(shù),5.1.4 定值技術(shù),定值輸入用于設(shè)置物體旋轉(zhuǎn)的角度、縮放的比例因子等,刻度尺與比例尺,圓形刻度尺與比例尺,定值技術(shù) 定值技術(shù)在交互過(guò)程中應(yīng)用很多，而且是必不可少的。用戶經(jīng)常需要輸入一個(gè)數(shù)值，指定一個(gè)數(shù)量，完成這種任務(wù)需要確定精度（單位），需要的設(shè)備是鍵盤或電位計(jì)。定值技術(shù)有兩種： （1）鍵入

6、數(shù)值；例如畫圓時(shí)，輸入半徑1.2等。 （2）改變電位計(jì)阻值產(chǎn)生要求的數(shù)量，可以用模擬的方式實(shí)現(xiàn)電位計(jì)功能。,5.1.5 拾取技術(shù),在圖形系統(tǒng)的許多交互操作中，經(jīng)常需要在一個(gè)分層 的對(duì)象結(jié)構(gòu)或雖不分層但很復(fù)雜的對(duì)象結(jié)構(gòu)中拾取一個(gè)基 本對(duì)象或一些基本對(duì)象的集合，然后對(duì)其施加某種操作 。,拾取一個(gè)基本對(duì)象可以通過(guò)一些方法來(lái)實(shí)現(xiàn) ： 指定名稱法 特征點(diǎn)法 外接矩形法 分類法 直接法,拾取技術(shù)(續(xù)),拾取操作,5.1.6 約束技術(shù),方向約束： 如X、Y方向上的約束（AutoCAD中命令為autho） 柵格約束： 輸入點(diǎn)用離它最近的網(wǎng)格點(diǎn)位置坐標(biāo)代替。 （AutoCAD中命令為Grid） （距離為10i，

7、10j）柵格坐標(biāo)： 10*(int(x+0.5)+5)/10 10*(int(y+0.5)+5)/10,5.1.7 菜單技術(shù),菜單是一種很重要的交互技術(shù)，它可用于指定命令、 確定操作對(duì)象或選定屬性等多中選一的場(chǎng)合。, 菜單的層次結(jié)構(gòu)(單層次的、多層次的 ), 菜單的表示 (字符串方法、圖符方法和圖像方法 ), 菜單的顯示控制 (固定式、彈出式 ), 菜單的選擇 菜單可通過(guò)多種設(shè)備來(lái)選擇，如使用指點(diǎn)設(shè)備直 接選擇、使用方向鍵順序循環(huán)選擇、使用數(shù)字鍵指定 選擇或使用功能鍵對(duì)應(yīng)選擇等。,5.1.8 網(wǎng)格(Grid)與吸附(Snap)技術(shù),有時(shí)要從某已有線段上的點(diǎn)或它的頂點(diǎn)開(kāi)始繪制另一 條線段或其他圖

8、形，直接使用定位設(shè)備很難保證選中 點(diǎn)的重合性。吸附技術(shù)則可克服這種困難。,帶有引力場(chǎng)的線段,網(wǎng)格與吸附技術(shù),網(wǎng)格化是幫助繪制整齊、精確圖形的一種技術(shù)。有時(shí)要從已有的某線段上的點(diǎn)或它的頂點(diǎn)開(kāi)始繪制另一條線段或其他圖形，直接使用定位設(shè)備來(lái)定位很難保證其重合性。 吸附技術(shù)可保證用戶在定位坐標(biāo)時(shí)只能選擇網(wǎng)格上的點(diǎn)，而不能選擇網(wǎng)格之間的點(diǎn)，這樣就可以克服單純使用定位設(shè)備時(shí)無(wú)法保證準(zhǔn)確性的困難。,5.2 CAD（交互式圖形）系統(tǒng)分析,計(jì)算機(jī)圖形學(xué)繪圖基礎(chǔ) 可以使用MFC類庫(kù)（任何時(shí)候可以調(diào)用Win32函數(shù)，最大程度地利用Windows） 與繪圖有關(guān)的關(guān)鍵類 Document存儲(chǔ)數(shù)據(jù) View觀察窗口（On

9、Draw()函數(shù)：“畫”的動(dòng)作） MainFrame Application代表應(yīng)用程序 （用戶啟動(dòng)應(yīng)用程序時(shí)，Windows交用應(yīng)用程序框架內(nèi)置的WinMain函數(shù)，尋找一個(gè)由CWinApp派生的全局構(gòu)造的應(yīng)用程序?qū)ο螅?圖形設(shè)備接口(Graphic Device Interface :GDI),管理： 圖形設(shè)備信息、坐標(biāo)系和映射模式、繪圖當(dāng)前狀態(tài)（畫筆、畫刷、顏色、字體）、繪圖具體操作（畫線、畫圓等） CGdiObject派生出的對(duì)象： CBitmap CBrush CPen CRgn CFont CPalette,VC中（繪圖應(yīng)用程序）最重要的類,CDC（設(shè)備環(huán)境類） 功能：其成員函數(shù)可

10、以用于對(duì)設(shè)備環(huán)境的操作、繪圖工具的使用、GDI對(duì)象的選擇等。例： CDC *pDC; pDC -LineTo(x,y); 先構(gòu)造一個(gè)CDC對(duì)象，然后能使用其成員函數(shù)，并及時(shí)刪除（太多了，系統(tǒng)回在調(diào)試窗口中報(bào)錯(cuò)）,繪圖系統(tǒng)設(shè)計(jì)基本原則,結(jié)構(gòu)層次化 通用性強(qiáng)、使用方便 處理速度快 程序容易：讀、查、改、移植、擴(kuò)充,圖形層次結(jié)構(gòu),一般物體可以分解為不同形體元素的集合，可分層表示： 圖形子圖形 床 ,床架,床頭,分層 復(fù)雜圖形-簡(jiǎn)單圖形,簡(jiǎn)單CAD繪圖軟件功能,基本功能 圖形繪制（點(diǎn)、線、多折線、圓/橢圓、圓?。?顏色、線型改變 文本 圖形放大/縮?。ㄖ乩L） 編輯（刪除、復(fù)制、移動(dòng)） 高級(jí)功能 Red

11、o/Undo 圖層 三維繪圖,5.3 交互技術(shù)的實(shí)現(xiàn)（鼠標(biāo)繪圖）,步驟如下： 新建一個(gè)MFC單文檔工程文件。 創(chuàng)建繪圖菜單，并添加3個(gè)子菜單。,3）利用ClassWizard為3個(gè)菜單項(xiàng)添加菜單響應(yīng)函數(shù),4）添加代碼,/繪制直線 void CDrawView:OnDrawLine() CDC *pDC=GetDC();/獲得當(dāng)前窗口的設(shè)備上下文 pDC-MoveTo(100,100);/起點(diǎn) pDC-LineTo(400,400);/終點(diǎn) /繪制矩形 void CDrawView:OnDrawRect() CDC *pDC=GetDC(); pDC-Rectangle(100,100,400,

12、400); /繪制圓 void CDrawView:OnDrawCircle() CDC *pDC=GetDC(); pDC-Ellipse(100,100,300,300); ,運(yùn)行結(jié)果,在視圖類頭文件中添加： /添加以下成員變量 CPoint m_p1,m_p2;/起點(diǎn)和終點(diǎn) int m_drawcurrent; /當(dāng)前繪圖對(duì)象 在構(gòu)造函數(shù)中初始化成員變量。 CDrawView:CDrawView() m_drawcurrent=0; 修改原繪圖代碼： /繪制直線 void CDrawView:OnDrawLine() m_drawcurrent=1;/直線 /繪制矩形 void CDra

13、wView:OnDrawRect() m_drawcurrent=2;/矩形 /繪制圓 void CDrawView:OnDrawCircle() m_drawcurrent=3;/圓 在OnLButtonDown中添加如下代碼： void CDrawView:OnLButtonDown(UINT nFlags, CPoint point) if(0=m_drawcurrent)return;/非繪圖狀態(tài) m_p1=point; /得到起點(diǎn) CView:OnLButtonDown(nFlags, point); ,在OnLButtonUp中添加如下代碼 #include “math.h” vo

14、id CDrawView:OnLButtonUp(UINT nFlags, CPoint point) if(0=m_drawcurrent)return; m_p2=point; CDC *pDC=GetDC(); switch(m_drawcurrent) case 1:/直線 pDC-MoveTo(m_p1); pDC-LineTo(m_p2); break; case 2:/矩形 pDC-Rectangle(m_p1.x,m_p1.y,m_p2.x,m_p2.y); break; case 3:/圓 int r=(int)sqrt(m_p2.x-m_p1.x)*(m_p2.x-m_p1.x)+(m_p2.y-m_p1.y) *(m_p2.y-m_p1.y);/半徑 int x1,x2,y1,y2; x1=m_p1.x-r;y1=m_p1.y-r; x2=m_p1.x+r;y2=m_p1.y+r; pDC-Ellipse(x1,y1,x2,y2); break; CView:OnLButtonUp(nFlags, point); ,5.4 二維圖形技術(shù)綜合應(yīng)用,給出兩個(gè)實(shí)例，參見(jiàn)教材：