《计算机图形学 教学课件 ppt 作者 徐文鹏 第6章 交互技术》由会员分享，可在线阅读，更多相关《计算机图形学 教学课件 ppt 作者 徐文鹏 第6章 交互技术（29页珍藏版）》请在金锄头文库上搜索。
1、河南理工大学,计算机图形学,第6章 交互技术,Computer Graphics,基本交互技术 高级交互技术,第6章 交互技术,6.1 基本交互技术,基本交互技术包括定位、选择、数值输入、文本输入及三维交互 6.1.1定位 定位是指向应用程序所描述的二维空间或三维空间中指定一个点的坐标。 定位的方式有两种，一种方式是将定位光标移动到确定的位置按一下键，另一种方式就是用命令输入点的坐标。 常用的定位设备有鼠标、触摸屏、数字化板和游戏棒。有时，采用多种设备相结合能获得较高的定位效率，可以将键盘输入和鼠标操作结合起来操作。,6.1 基本交互技术,6.1.2选择 选择，也就是图形拾取。在一些由矢量图形
2、格式为主的软件中，在图元集合中选出一个或多个图元(或图组)是一个基本任务。 选择操作的方式很多，如可以用鼠标设备定位到待选图元的位置后确认选择，也可以在标识各图元代号(如ID号)的列表中选择图元代号。 拾取的对象可能是一个图元、多个图元的组合，或者图元中用于编辑的一部分。 拾取后的图形一般要高亮显示或显示其特征点，以强调图形处于选中状态。,6.1 基本交互技术,6.1.2选择 1 点拾取 指在待选中的图形附近位置上按下鼠标键或键盘键来发送选中命令。图元或图组是否能被选中仍需要计算机进行判断。对于点图元、线图元、面状图元和图组，选中判断的算法有所不同。 点图元的点拾取 点图元的点拾取可以通过计算
3、图元与选择点的距离来判断。设 为待判断的点图元， 为选择点的坐标，若 (为选择阈值) 则点图元被选中。为减少计算，可将开平方舍去。,6.1 基本交互技术,6.1.2选择 1 点拾取 (2)线图元的点拾取 线图元一般指直线或折线。线图元的点拾取可以通过计算选择点与线图元的距离来判断。 设有一直线段L，两端点的坐标为 和 ，选择点P的坐标为 ，则点P到直线L的线距离为 根据解析几何直线方程可得,6.1 基本交互技术,6.1.2选择 (3)面状图元的点拾取 面状图元包括圆、矩形和多边形。面状图元的点拾取是通过判断选择点是否位于多边形图元内部来决定的。 常用于判断一个点是否在多边形内部的算法有： (1
4、)射线法。一条射线从点P发出，穿过多边形的边界的次数称为交点数目。当交点数目为偶数时，点P在多边形外部；否则为奇数时，在多边形内部；,6.1 基本交互技术,6.1.2选择 (3)面状图元的点拾取 (2)转角法。多边形环绕点P的角度总和(或多边形边在以点P为圆心的单位圆上的投影的弧长总和)称为环绕数。环绕数为零时，点P在多边形外部；否则在多边形内部。 以上两种算法也可导出为一种算法：从起点P发出向右侧的射线，若遇到方向向上的边与射线相交，则环绕数加1，遇到方向向下的边与射线相交，环绕数减1。当最后的环绕数为零时，P在多边形的外部。,6.1 基本交互技术,6.1.2选择 (4)图组的点拾取 图组是
5、包含了多个类型不同的图元的组合。一种较简单的判断方法是判断选择点是否落在图组的最小外接矩形内。这种方法速度快，但不够精确。较精确的判断方式是对于图组中不同类型的图元分别按照上面介绍的方法判断，只要图组中有一个图元满足选中条件，就认为改图组被选中了。,6.1 基本交互技术,6.1.2选择 2 线拾取 线拾取指在屏幕上用鼠标画一条用于选择图元的折线，凡与折线相交的图元为被选中的图元。对于点图元，只要折线中有一条直线段与它的距离小于阈值就认为该点图元被选中了。对于折线图元和多边形图元，只要用于选择的折线与其中的一条直线段(一条边)相交就认为该图元被选中。这里算法的关键是要判断两条直线段是否相交，有两
6、种方法： (1)跨立测试: 判断线段a的两端点是否位于线段b的两侧，并且线段b的两端点是否位于线段a的两侧，符合这个条件的为两线段相交。,6.1 基本交互技术,6.1.2选择 2 线拾取 (2)参数法测试 设一条直线的端点为(x1,y1)及(x2,y2)，参数的范围是0,1；另一条直线的端点为(X3,y3)及(x4,y4)，参数的范围也是0,1，则有 其中 如再令 则有,若用上式计算出的u1、u2均在0,1内，则两条直线有交点，且能求出交点的坐标。,6.1 基本交互技术,用直线选取多边形图元,6.1.2选择 2 线拾取,6.1 基本交互技术,6.1.2选择 3 面状图形拾取 面状图形拾取包括以
7、圆、矩形和多边形进行图元拾取，三者的拾取方法相似。这种拾取方式可分为两类，一类是只要图元中有一部分与圆弧(或矩形框)相交就认为该图元被选中了；另一类是当图元中所有顶点都位于圆内时才认为该图元被选中了。,基于圆、矩形、多边形的图形拾取,6.1 基本交互技术,6.1.3 数值输入和文字输入 数值的交互输入是指在某个范围内指定一个数值，输入交互技术有： 用文本框或命令行接受键盘输入； 用鼠标操作滚动条、旋钮、标度盘等控件； 文字及语音识别； 用鼠标移动屏幕上的刻度尺。,6.2 高级交互技术,6.2.1分组与图层 图元组：当图形软件中所表达的图形较多时，对图元的编辑操作难以控制，效率较低。可以将一些相
8、关的图元合并为一个组。合并后的图元组可进一步合并为更高一级的图元组，形成一棵树状结构。分组以后的图元一般只能进行统一的操作，具有较高的编辑效率，比如同等比例的缩放变换、相同位移的平移变换、其它如颜色和线的粗细等属性变换。,6.2 高级交互技术,6.2.1分组与图层(续) 图层： 图层是比图元组更高级别的图元集合，图层中的图元可以按照图元类别或图元主题分组，或交由用户来决定各图层中的图元。 属于同一图层内的所有图元可以只共享一个属性。图层还具有可见性、可编辑性、可选择性、图层的顺序等属性。 图层为可见时，图层中包含的所有图元全部显示出来，若用户不需要看到某图层的图元时可以将图层设为不可见。 可编
9、辑性是用于控制图层内的图元是否可编辑的属性，当用户只想编辑某一图层内的图元并避免影响了其它图层内的图元时，可只将待编辑图层设为可编辑。,6.2 高级交互技术,6.2.2几何约束 几何约束是为方便输入如矩形、圆等规则图元或者某特定位置的图元而采用的输入约束机制，目的是为了减少用户在输入时产生的随机错误，提高输入位置的精确性。主要包括定位约束、方向约束和规则性约束。 一种常见的定位约束是在图形的绘制或编辑区域定义一个不可见的网格，用来约束输入点的位置。网格是由等间距垂直线和水平线组成，其交点为网格点，无论用任何方式输入点的位置，软件都会采用距离最近的原则，将输入点的位置定在离输入位置最近的网格点上
10、。 另一种实用的定位约束是使用“引力场”，即对每个已有点周围生成圆形或矩形的“引力场”区域，在输入新点时，若光标位置落入“引力场”，软件会将位置自动“吸引”到已有的点位上(这时显示的是被吸引的橡皮筯图形)，这时确定输入位置就能保证新输入的点与原有的点能完全重合。,6.2 高级交互技术,6.2.2几何约束 方向约束主要用于控制线段输入的方向，它能够保证输入的线段只有垂直、水平、45、135等方向。 规则性约束，主要用于控制正方形和圆的输入。因一般软件中提供了椭圆和矩形的输入，只有采用规则性约束时才能使输入的椭圆(长方形)自动约束为圆(正方形)。,6.2 高级交互技术,6.2.3 拖动、旋转、缩放
11、和形变 当要把一个图元从一个位置移动到另一个位置时，可以在图元的当前位置按下鼠标键，拖动时图元本身或其影子会随着鼠标指针移动，这种方法能使用户感到很直观。橡皮筯是另一种拖动形式，当拖动时会显示鼠标指针离开原来位置的直线路径，这条路径会紧随鼠标指针，像一条连接原来位置和新位置的橡皮筯。 当图元处于旋转状态后，会在图元的附近显示其旋转中心，旋转中心的位置可以用鼠标拖动。旋转图元时可以用鼠标移动旋转柄，或者直接在屏幕上拖动，或者通过键盘的上、下、左、右键来控制旋转方向。,6.2 高级交互技术,6.2.3 拖动、旋转、缩放和形变 缩放操作与旋转操作类似，有一个缩放中心，通过修改缩放比例来实现。 拖动、
12、旋转、缩放操作本质上只是对图元的仿射变换，不能任意改变图元的形状。采用对局部结点进行编辑的方法才能实现任意形变。进入形变状态后，待编辑的图元会高亮显示其所有顶点，这时用鼠标可以拖动顶点的位置，与顶点相连的边成为橡皮筯，从而改变其形状。,6.2 高级交互技术,6.2.4 橡皮筯 橡皮筯指在绘图时跟随光标的直线和曲线，当光标移动时形状随之变化。如用鼠标绘制直线时，直线的起点确定后，会产生一条从起点到光标当前位置的橡皮筯直线，它会随着光标移动，只有当直线的终点确定后这条橡皮筯就会“固化”为直线。橡皮筯也可以扩展为矩形、椭圆、圆、样条曲线等任意图形。 采用橡皮筯技术可以使绘图过程变得很直观，增强了绘图
13、者的操作决策效率。,6.2 高级交互技术,6.2.5 双缓存 显示在屏幕上的任何图形本质上都是以光栅位图(帧缓存)的形式绘制在屏幕上的。一般情况下，屏幕上的图形发生改变时都需要将原有的屏幕擦除(刷新)，再重新绘制一次，这时会感觉到整个屏幕在闪烁，图形绘制变得不连贯。如果采用双缓存技术，屏幕变化很连贯柔和。 使用双缓存的关键是在内存中另建一块缓存。在很多程序开发库中，缓存即是位图。新建一个与图形绘制区域大小相同的位图作为后台缓存，在其上绘制所有图形，绘制的图形不会反映在屏幕上，在刷新屏幕时，只要将此位图绘制出来即可，位图图像代替了原有屏幕上的图形。在使用橡皮筯技术时最好采用双缓存的方式来显示。,
14、6.2 高级交互技术,CBitmap MemBitmap; /新建一个位图对象，作为后台缓存 CDC MemDC; /新建一个绘图上下文对象，作为与MemBitmap相关联的对象 /获得当前视图对象(CView的对象)关联的绘图上下文 CClientDC *dc=new CClientDC(this); /释放原有内存 MemDC.DeleteDC(); MemBitmap.DeleteObject(); /新建一块与dc相容的另一块绘图上下文对象 MemDC.CreateCompatibleDC(dc); /新建与dc相容位图 MemBitmap.CreateCompatibleBitmap
15、(dc,1000,800); /将MemDC与MemBitmap相关联 MemDC.SelectObject(,6.2 高级交互技术,在微软公司最新发布的M Framework平台上，使用GDI+实现双缓存技术就更简单了，下面给出用C#实现的双缓存示例代码： Bitmap MemBitmap=new Bitmap(this.Width,this.Height); /后台缓存所用的位图 Graphics g=Graphics.FromImage(MemBitmap); /使用g对象绘制图形，图形被画在了MemBitmap上 g.DrawLine(); g.DrawRectangle(); /创建
16、this指针所指Form对象(或某控件)的指针 Graphics g=this.CreateGraphics(); /刷新屏幕(Form窗体) g.DrawImage(MemBitmap，)；,6.2 高级交互技术,6.2.6 全图的漫游、缩放 不少二维图形软件如AutoCAD、GIS软件都提供了灵活的图形浏览功能，其中漫游、缩放等功能必不可少。 漫游指图形窗口在用户坐标系中的平移。 因为屏幕上只能显示位于窗口范围内的图形，因此移动图形窗口会使屏幕上显示的内容发生平移和变化。 漫游的实现归结为窗口中心在用户坐标系中的平移。 不少软件支持键盘方向键控制平移位置，也支持鼠标的拖放式漫游。,6.2 高级交互技术,6.2.6 全图的漫游、缩放 漫游可在不同尺度(比例)下进行，如尺度
