《交互式技术》PPT课件.ppt

1、计算机图形学基础,第5章 交互式技术,本章主要内容,常用的交互技术 交互技术的实现（鼠标绘图） 二维图形技术综合应用,什么是交互技术？ 指使用输入设备进行输入的技术。 作用：交互式绘图 主要内容： 交互设备 交互任务 基本交互技术（如橡皮筋技术）的实现,交互式绘图,设计者在操作计算机系统绘图时，人与计算机之间进行信息交换，从而完成复杂的绘图任务。 需要：交互式技术 常见系统： AutoCAD 、Photoshop、3DMAX （视景仿真） Creator、Vega,交互技术、交互设备、交互任务三者关系,用户,交互界面,系统程序员 图形库,交互设备,交互技术,交互技术,交互任务,图形输入设备的逻

2、辑分类,输入控制,请求模式（Request Mode） 输入设备在应用程序的控制下工作，程序在输入请求发出后一直被置于等待状态，直到数据输入。 取样模式 （Sample Mode ） 应用程序与输入设备同时工作，当输入设备工作时，存储输入数据，并不断更新当前数据，当程序要求输入时，程序采用当前数据值。 事件模式 （Event Mode ） 每次用户对输入设备的一次操作以及形成的数据称为一个事件（Event），事件按先后顺序排成队列，先进先出，设备被设置为事件方式，程序与设备同时工作。,5.1 常用的交互技术,一个交互图形系统或图形应用程序，必须允许用户动态的输入坐标，指定选择功能，拾取操作对象

3、，设置变换坐标，以及在图形显示时对图形的局部进行修改（例如平移、旋转、缩放等比例变换）、删除等操作。用户还可以允许使用橡皮筋技术，拖动技术等交互技术来进行绘图。这种交互绘图方式完全区别于通过程序自动运行产生的绘图方式。,橡皮条技术,定位技术,拖拽技术,定值技术,菜单技术,栅格技术,拾取技术,约束技术,吸附技术（引力域）,插入符号、回显功能,直线、圆、矩形橡皮筋,5.1 常用的交互技术, 定位技术,5.1 常用的交互技术,用来给应用程序指定位置坐标（x，y）或（x，y，z）。 完成此任务一般情况下可采取两种方法， 其一，用鼠标移动屏幕上的光标到满意的位置， 然后按一下鼠标左键； 其二，用键盘直接

4、输入满意的位置坐标。 另外，还可以将这些技术混合在一起作用，,5.1.1 定位技术,5.1.1 定位技术,定位是图形输入和图形操作时常用的输入操作之一。 定位有直接定位和间接定位两种方式。,void cursor(int x,int y) setwritemode(XOR_PUT); line(x+3,y,x-3,y); line(x,y-3,x,y+3); ,鼠标等设备的相对移动控制光标定位(异或方式显示光标) 在屏幕指定位置画一个十字光标：void cursor(int x,int y),5.1.2橡皮筋技术,定位操作有时依赖于环境。例如，在绘图时，已经存在一个圆C和圆外一点A，现在要确定

5、另外一点B，使两点连线AB与圆C相切。这种点的确定可通过使用橡皮条技术而变得容易实现。,用橡皮条技术定位(显示线段用异或方式),橡皮筋技术(续),橡皮筋技术图例,5.1. 3 拖拽技术,拖曳技术被用于拼装定位和其他一些操作(如布局操作)中去，以便使工作变得直观、简便、高效。,拖曳一个二极管符号,拖曳技术,5.1.4 定值技术,定值输入用于设置物体旋转的角度、缩放的比例因子等,刻度尺与比例尺,圆形刻度尺与比例尺,定值技术 定值技术在交互过程中应用很多，而且是必不可少的。用户经常需要输入一个数值，指定一个数量，完成这种任务需要确定精度（单位），需要的设备是键盘或电位计。定值技术有两种： （1）键入

6、数值；例如画圆时，输入半径1.2等。 （2）改变电位计阻值产生要求的数量，可以用模拟的方式实现电位计功能。,5.1.5 拾取技术,在图形系统的许多交互操作中，经常需要在一个分层 的对象结构或虽不分层但很复杂的对象结构中拾取一个基 本对象或一些基本对象的集合，然后对其施加某种操作 。,拾取一个基本对象可以通过一些方法来实现 ： 指定名称法 特征点法 外接矩形法 分类法 直接法,拾取技术(续),拾取操作,5.1.6 约束技术,方向约束： 如X、Y方向上的约束（AutoCAD中命令为autho） 栅格约束： 输入点用离它最近的网格点位置坐标代替。 （AutoCAD中命令为Grid） （距离为10i，

7、10j）栅格坐标： 10*(int(x+0.5)+5)/10 10*(int(y+0.5)+5)/10,5.1.7 菜单技术,菜单是一种很重要的交互技术，它可用于指定命令、 确定操作对象或选定属性等多中选一的场合。, 菜单的层次结构(单层次的、多层次的 ), 菜单的表示 (字符串方法、图符方法和图像方法 ), 菜单的显示控制 (固定式、弹出式 ), 菜单的选择 菜单可通过多种设备来选择，如使用指点设备直 接选择、使用方向键顺序循环选择、使用数字键指定 选择或使用功能键对应选择等。,5.1.8 网格(Grid)与吸附(Snap)技术,有时要从某已有线段上的点或它的顶点开始绘制另一 条线段或其他图

8、形，直接使用定位设备很难保证选中 点的重合性。吸附技术则可克服这种困难。,带有引力场的线段,网格与吸附技术,网格化是帮助绘制整齐、精确图形的一种技术。有时要从已有的某线段上的点或它的顶点开始绘制另一条线段或其他图形，直接使用定位设备来定位很难保证其重合性。 吸附技术可保证用户在定位坐标时只能选择网格上的点，而不能选择网格之间的点，这样就可以克服单纯使用定位设备时无法保证准确性的困难。,5.2 CAD（交互式图形）系统分析,计算机图形学绘图基础 可以使用MFC类库（任何时候可以调用Win32函数，最大程度地利用Windows） 与绘图有关的关键类 Document存储数据 View观察窗口（On

9、Draw()函数：“画”的动作） MainFrame Application代表应用程序 （用户启动应用程序时，Windows交用应用程序框架内置的WinMain函数，寻找一个由CWinApp派生的全局构造的应用程序对象）,图形设备接口(Graphic Device Interface :GDI),管理： 图形设备信息、坐标系和映射模式、绘图当前状态（画笔、画刷、颜色、字体）、绘图具体操作（画线、画圆等） CGdiObject派生出的对象： CBitmap CBrush CPen CRgn CFont CPalette,VC中（绘图应用程序）最重要的类,CDC（设备环境类） 功能：其成员函数可

10、以用于对设备环境的操作、绘图工具的使用、GDI对象的选择等。例： CDC *pDC; pDC -LineTo(x,y); 先构造一个CDC对象，然后能使用其成员函数，并及时删除（太多了，系统回在调试窗口中报错）,绘图系统设计基本原则,结构层次化 通用性强、使用方便 处理速度快 程序容易：读、查、改、移植、扩充,图形层次结构,一般物体可以分解为不同形体元素的集合，可分层表示： 图形子图形 床 ,床架,床头,分层 复杂图形-简单图形,简单CAD绘图软件功能,基本功能 图形绘制（点、线、多折线、圆/椭圆、圆弧） 颜色、线型改变 文本 图形放大/缩小（重绘） 编辑（删除、复制、移动） 高级功能 Red

11、o/Undo 图层 三维绘图,5.3 交互技术的实现（鼠标绘图）,步骤如下： 新建一个MFC单文档工程文件。 创建绘图菜单，并添加3个子菜单。,3）利用ClassWizard为3个菜单项添加菜单响应函数,4）添加代码,/绘制直线 void CDrawView:OnDrawLine() CDC *pDC=GetDC();/获得当前窗口的设备上下文 pDC-MoveTo(100,100);/起点 pDC-LineTo(400,400);/终点 /绘制矩形 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); ,运行结果,在视图类头文件中添加： /添加以下成员变量 CPoint m_p1,m_p2;/起点和终点 int m_drawcurrent; /当前绘图对象 在构造函数中初始化成员变量。 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;/非绘图状态 m_p1=point; /得到起点 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 二维图形技术综合应用,给出两个实例，参见教材：