《交互式技术》PPT课件

《《交互式技术》PPT课件》由会员分享，可在线阅读，更多相关《《交互式技术》PPT课件（41页珍藏版）》请在装配图网上搜索。

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

2、位设备(Locator)指定一个点的坐标位置(x,y)笔划设备(Stroke)指定一系列点的坐标数值设备(Valuator)输入一个整数或实数字符串设备(String)输入一串字符选择设备(Choice)选择某个菜单项拾取设备(Pick)选择显示着的图形的组成部分输入控制请求模式（Request Mode）输入设备在应用程序的控制下工作，程序在输入请求发出后一直被置于等待状态，直到数据输入。取样模式（Sample Mode）应用程序与输入设备同时工作，当输入设备工作时，存储输入数据，并不断更新当前数据，当程序要求输入时，程序采用当前数据值。事件模式（Event Mode）每次用户对输入设备的一

3、次操作以及形成的数据称为一个事件（Event），事件按先后顺序排成队列，先进先出，设备被设置为事件方式，程序与设备同时工作。5.1 常用的交互技术常用的交互技术一个交互图形系统或图形应用程序，必须允许用户动态的输入坐标，一个交互图形系统或图形应用程序，必须允许用户动态的输入坐标，指定选择功能，拾取操作对象，设置变换坐标，以及在图形显示时对指定选择功能，拾取操作对象，设置变换坐标，以及在图形显示时对图形的局部进行修改（例如平移、旋转、缩放等比例变换）、删除等图形的局部进行修改（例如平移、旋转、缩放等比例变换）、删除等操作。用户还可以允许使用橡皮筋技术，拖动技术等交互技术来进行操作。用户还可以允许

4、使用橡皮筋技术，拖动技术等交互技术来进行绘图。这种交互绘图方式完全区别于通过程序自动运行产生的绘图方绘图。这种交互绘图方式完全区别于通过程序自动运行产生的绘图方式。式。橡皮条技术橡皮条技术定位技术定位技术拖拽技术拖拽技术 定值技术定值技术 菜单技术菜单技术 栅格技术栅格技术 拾取技术拾取技术约束技术约束技术吸附技术（引力域）吸附技术（引力域）插入符号、回显功能插入符号、回显功能直线、圆、矩形橡皮筋直线、圆、矩形橡皮筋5.1 常用的交互技术常用的交互技术 定位技术定位技术 5.1 常用的交互技术常用的交互技术用来给应用程序指定位置坐标（x，y）或（x，y，z）。完成此任务一般情况下可采取两种方法

5、，q 其一，用鼠标移动屏幕上的光标到满意的位置，然后按一下鼠标左键；q 其二，用键盘直接输入满意的位置坐标。q 另外，还可以将这些技术混合在一起作用，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橡皮筋技术

6、橡皮筋技术 定位操作有时依赖于环境。例如，在绘图时，已经存在一个圆C和圆外一点A，现在要确定另外一点B，使两点连线AB与圆C相切。这种点的确定可通过使用橡皮条技术而变得容易实现。用橡皮条技术定位(显示线段用异或方式)橡皮橡皮筋筋技术技术(续续)橡皮筋技术图例 5.1.3 拖拽技术拖拽技术 拖曳技术被用于拼装定位和其他一些操作(如布局操作)中去，以便使工作变得直观、简便、高效。拖曳一个二极管符号 拖曳技术(a)按动按钮选中图形(b)移动光标，也移动图形(c)图形放好时按钮停止图5-2 利用拖曳技术进行图形定位5.1.4 定值技术定值技术 定值输入用于设置物体旋转的角度、缩放的比例因子等 刻度尺与

7、比例尺 圆形刻度尺与比例尺 定值技术定值技术在交互过程中应用很多，而且是必不可少的。定值技术在交互过程中应用很多，而且是必不可少的。用户经常需要输入一个数值，指定一个数量，完成用户经常需要输入一个数值，指定一个数量，完成这种任务需要确定精度（单位），需要的设备是键这种任务需要确定精度（单位），需要的设备是键盘或电位计。定值技术有两种：盘或电位计。定值技术有两种：（1）键入数值；例如画圆时，输入半径等。）键入数值；例如画圆时，输入半径等。（2）改变电位计阻值产生要求的数量，可以用模拟）改变电位计阻值产生要求的数量，可以用模拟的方式实现电位计功能。的方式实现电位计功能。拾取技术拾取技术 在图形系统

8、的许多交互操作中，经常需要在一个分层 的对象结构或虽不分层但很复杂的对象结构中拾取一个基 本对象或一些基本对象的集合，然后对其施加某种操作。拾取一个基本对象可以通过一些方法来实现：指定名称法 特征点法 外接矩形法 分类法 直接法 拾取技术拾取技术(续续)拾取操作 5.1.6 约束技术约束技术方向约束：如X、Y方向上的约束（AutoCAD中命令为autho）栅格约束：输入点用离它最近的网格点位置坐标代替。（AutoCAD中命令为Grid）（距离为10i，10j）栅格坐标：10*(int(x+0.5)+5)/10 10*(int(y+0.5)+5)/105.1.7 菜单技术菜单技术 菜单是一种很重

9、要的交互技术，它可用于指定命令、确定操作对象或选定属性等多中选一的场合。菜单的层次结构菜单的层次结构(单层次的、多层次的)菜单的表示菜单的表示(字符串方法、图符方法和图像方法)菜单的显示控制菜单的显示控制(固定式、弹出式)菜单的选择菜单的选择 菜单可通过多种设备来选择，如使用指点设备直 接选择、使用方向键顺序循环选择、使用数字键指定 选择或使用功能键对应选择等。5.1.8 网格网格(Grid)与吸附与吸附(Snap)技术技术有时要从某已有线段上的点或它的顶点开始绘制另一条线段或其他图形，直接使用定位设备很难保证选中点的重合性。吸附技术则可克服这种困难。带有引力场的线段 网格与吸附技术网格与吸附

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

11、indows交用应用程序框架内置的WinMain函数，寻找一个由CWinApp派生的全局构造的应用程序对象）图形设备接口(Graphic Device Interface:GDI)管理：图形设备信息、坐标系和映射模式、绘图当前状态（画笔、画刷、颜色、字体）、绘图具体操作（画线、画圆等）CGdiObject派生出的对象：CBitmap CBrush CPen CRgn CFont CPaletteVC中（绘图应用程序）最重要的类 CDC（设备环境类）功能：其成员函数可以用于对设备环境的操作、绘图工具的使用、GDI对象的选择等。例：CDC*pDC;pDC-LineTo(x,y);先构造一个CDC对

12、象，然后能使用其成员函数，并及时删除（太多了，系统回在调试窗口中报错）绘图系统设计基本原则 结构层次化 通用性强、使用方便 处理速度快 程序容易：读、查、改、移植、扩充图形层次结构 一般物体可以分解为不同形体元素的集合，可分层表示：图形子图形床 床架床头 分层分层复杂图形复杂图形-简单图形简单图形简单CAD绘图软件功能 基本功能 图形绘制（点、线、多折线、圆/椭圆、圆弧）颜色、线型改变 文本 图形放大/缩小（重绘）编辑（删除、复制、移动）高级功能 Redo/Undo 图层 三维绘图5.3 交互技术的实现（鼠标绘图）步骤如下：新建一个MFC单文档工程文件。1)创建绘图菜单，并添加3个子菜单。菜单

13、标题菜单项标题菜单项ID绘图直线ID_DRAW_LINE矩形ID_DRAW_RECT圆ID_DRAW_CIRCLE3）利用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,400);/绘制圆void CDrawView:On

14、DrawCircle()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 CDrawView:OnDrawRect()m_drawcurrent=2;/矩形/绘制圆void C

15、DrawView: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”void CDrawView:OnLButtonUp(UINT nFlags,CPoint point)if(0=m_drawcur

16、rent)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

17、-r;x2=m_p1.x+r;y2=m_p1.y+r;pDC-Ellipse(x1,y1,x2,y2);break;CView:OnLButtonUp(nFlags,point);5.4 二维图形技术综合应用 给出两个实例，参见教材：实例1平面图形综合设计 实例2-平面曲线图案设计 习题习题1、吸附技术有什么好处？2、Visual C+中有哪些鼠标响应的事件？试实现这些响应事件。3、基本CAD程序包括哪些功能？利用自己绘图程序进行平面图形设计（包括绘图图形与图形填充）。本章小结常用的交互技术有哪几种？栅格技术与吸附技术的异同。CAD（交互式图形）系统分析。利用Visual C+实现二维图形技术综合应用。