第6章 图形图像和多媒体应用程序设计方法.doc

第6章 图形图像和多媒体应用程序设计方法本章在分析“指针式时钟”和“VCD播放器”程序设计实例的基础上，主要介绍图形操作的基础知识和VB中开发多媒体应用程序的两种主要方式。主要包括坐标系统、简单几何绘图、相关控件的使用方法等。通过本章学习，你应该能够达到如下学习目标：1掌握图形图像的基本处理方法。2理解VB坐标系统的原理。3掌握图形控件和多媒体控件的使用和与绘图有关的常用属性和方法。4理解“指针式时钟”程序的设计方法，能够读懂并完善这类程序的部分语句。5了解“VCD播放器”程序设计的方法，能够读懂并完善这类程序的部分语句。6了解播放多媒体信息的基本方法一、主要知识点1.VB坐标系统在VB中，每个对象都定位在存放它的容器内，对象的定位都要使用容器的坐标系。例如，窗体处于屏幕内，屏幕就是窗体的容器（如教材图6.5所示），而在窗体内绘制对象时，窗体就是容器（如教材图6.6所示）。如果在图片框内绘制图形，则该图片框就是容器（如教材图6.7所示）。容器内的对象只能在容器内变动，当移动容器时，容器内的对象也随着容器一起移动，而且与容器的相对位置保持不变。（1）窗体的缺省坐标系统构成一个坐标系需要三个要素：坐标原点、坐标轴度量单位、坐标轴方向。坐标轴的度量单位由对象的ScaleMode属性来决定（有8种形式），缺省为Twip(缇)。默认的坐标原点（0，0）为对象的左上角，横向向右为X轴的正向，纵向向下为Y轴的正向。窗体的缺省坐标系统如图1所示。图1 窗体的缺省坐标系统窗体的标准坐标系(ScaleTop,ScaleLeft)缺省值(0,0)Y轴ScaleWidthScaleHeightX轴注意：窗体的Height属性值包括了标题栏和水平边框宽度，Width属性值包括了垂直边框宽度（如教材图6.5所示）。实际可用宽度和高度由ScaleWidth和ScaleHeight属性决定。（2）自定义坐标系统VB中坐标系的定义有如下两种方法：通过ScaleTop、ScaleLeft、ScaleWidth、ScaleHeight四项属性来实现ScaleTop、ScaleLeft的值用于指定对象左上角坐标，所有对象的ScaleLeft、ScaleTop属性的缺省值为0，坐标原点在对象的左上角，当改变ScaleLeft、ScaleTop的值后，坐标系的X轴或Y轴按此值平移形成新的坐标原点。对象右下角的坐标为（ScaleLeft+ScaleWidth，ScaleTop+ ScaleHeight），根据左上角和右下角坐标的大小自动设置坐标轴的正向，X轴与Y轴的度量单位分别为1/ScaleWidth和1/ScaleHeight。例如，在Form1_Click()事件中通过属性定义窗体Form1的坐标系。Private Sub Form_Click()ClsForm1.ScaleLeft = -14Form1.ScaleTop = 14Form1.ScaleWidth = 28Form1.ScaleHeight = -28Line (-14, 0)-(14, 0)Line (0, 14)-(0, -14)CurrentX = 0: CurrentY = 0: Print 0CurrentX = 13: CurrentY = 2: Print XCurrentX = 0.5: CurrentY = 13: Print YEnd Sub程序运行界面如图2所示：图22.采用Scale方法来设置坐标系其语法如下： 对象名.Scale(x1,y1)（x2,y2）(x1,y1)表示对象左上角坐标，（x2,y2）表示对象右上角坐标，VB根据给定的坐标参数计算出ScaleLeft、ScaleTop 、ScaleWidth 、ScaleHeight 的值。Scale方法不带参数时，则取消用户自定义的坐标系，而采用默认的坐标系。例如，Form1.Scale(-14,14)-(14,-14)可建立和上图一样的坐标系。复习教材图6.9和图6.10进一步理解用Scale方法设置坐标系的含义。使用VB6.0的颜色在程序运行时，有两种方式可以指定颜色值。（1）使用RGB函数（2）使用QBColor函数2.图形控件VB图形控件如表1所示表1 图形控件控件名作用及说明常用属性PictureBox控件（图片框）用来显示图片。AutoSize属性为Ture时，图片框能自动调整大小与显示的图片匹配。为False时，图形框不能自动调整大小来适应其中的图形，加载到PictureBox控件中的图形保持原尺寸。因此如果图形比图片框大，则超过的部分将被裁剪掉。可作为容器。AutoSizeBorderStyle（用来设置图片框的边框风格）PictureBox（用于加载图片）Image控件（图像框）用来显示图片。Stretch属性设置为False时，图像框可自动改变大小以适应其中的图形，设置为True时，加载到图像框的图形可自动调整尺寸以适应图像框的大小。该控件没有AutoSize属性。不能作为容器。PictureBox（用于加载图片）、StretchLine控件（线条）用于在容器对象中画直线。由x1,y1和x2,y2属性确定直线位置。BorderColor（用于设置线条的颜色）BorderWidth（用于设置线条的宽度）、BorderStyle（用于设置线条的类型）Shape控件（形状）用来在窗体或图片框中绘制常见的几何图形。Shape（用于设定几何图形的类型）FillStyle（用于设置形状内的填充格式）FillColor（设置形状内的填充格式颜色）PictureBox控件和Image控件的异同点：（1）两种控件都支持相同的图片格式。支持的图片格式有：位图（.bmp）、图标（.ico）、增强型图元文件（.emf）、普通图元文件（.wmf）、位图（.gif，可支持256种颜色）、位图（.jpeg可支持8位和24位颜色）。（2）二者都具有Picture属性。（3）PictureBox控件可作为容器，Image控件则不能（4）PictureBox控件可以显示动态的图形信息，而Image控件只能用来显示静态的图形信息。（5）Image控件使用的系统资源比PictureBox控件少，重新绘图速度快，但支持的属性、事件、方法较少。（6）Image控件没有Autosize属性，但可通过Stretch属性来确定是否缩放图形来适应控件大小，PictureBox控件中的图形不能伸缩。3. 多媒体控件（MMControl控件）MMControl控件是一个专门用来管理多媒体控制接口MCI设备的ActiveX控件。它是具有一组执行MCI命令的下压式按钮。它被用来向诸如声卡、MIDI序列发生器、CD-ROM驱动器、视频CD播放器和视频磁带记录器及播放器等设备发出MCI命令。该控件也支持AVI视频文件的回放。MMControl控件在窗体上的外观如图3所示。图3 MMControl控件外观常用属性有：AutoEnable属性、PlayEnabled属性、PlayVisible属性、Command属性、DeviceType属性、Length属性、Notify属性、Mode属性。常用事件主要有：Click事件、Done事件、StatusUpdate事件。StatusUpdate事件允许应用程序更新显示，以通知用户当前MCI设备的状态。应用程序可以从Position、Length和Mode等属性中获得状态信息。4. 图形方法VB常用图形方法如表2所示。表2 VB常用图形方法方法说明语法格式Line画直线、矩形、三角形对象.LineStep (X1,Y1)- Step X2,Y2) ,Color,BFCircle画圆、椭圆、圆弧、扇形等对象.CircleStep(X,Y),radius,color,start,end,aspetPset画点对象.PsetStepx,yColorPoint返回指定点的颜色 对象.Point(x,y)Cls方法用来清除绘图区对象.cls5. 绘图属性常用绘图属性及功能如表3所示。表3 绘图属性及功能说明绘图属性功能说明CurrentX,CurrentY当前绘图位置BorderStyle,BrderWidth线型、线宽DrawMode、DrawStyle、DrawWidth绘图模式、风格、线宽FillStyle,FillColor填充格式、填充颜色ForeColor、BackColor前景颜色、背景颜色6.图形显示方法在VB中，可根据需要采用不同方法把图形添加到窗体、图片框和图像框中。（1）在设计时添加图形有两种方法：使用对象的Picture属性添加图片使用剪贴板，将图形粘贴到对象中（2）在运行时添加图形有两种方法使用LoadPicture函数加载图形文件，格式如下：.Picture=LoadPicture(“图形文件名”)如使用如下语句可以删除Picture1图片框中的图形文件Picture1.Picture = LoadPicture()使用Picture属性在对象间相互复制，如使用如下语句：Picture2.Picture = Picture1.Picture可将Picture1图片框中的图形拷贝到Picture2图片框中。二、本章重点1.坐标系统（默认坐标系统和自定义坐标系统）。2.PictureBox控件和Image控件属性的设置，二者之间的区别。3.图形显示方法。4.Line方法、Circle方法、Pset等绘图方法的灵活使用。三、本章难点坐标系统（默认坐标系统和自定义坐标系统）四、典型例题例1.在窗体上绘制一个边长为1000缇的红色矩形，再用蓝色画出矩形的两条对角线。代码如下：Private Sub Form_Click()Line (200, 200)-(1000, 1000), RGB(255, 0, 0), BLine (200, 200)-(1000, 1000), RGB(0, 0, 255)Line (200, 1000)-(1000, 200), RGB(0, 0, 255)End Sub例2.在窗体上绘制一个圆心在（2000，2000）、半径为1000缇的红色圆，内部用绿色水平线填充。代码如下：Private Sub Form_Click()FillStyle = 2FillColor = RGB(0, 255, 0)Circle (2000, 2000), 1000, RGB(255, 0, 0)End Sub例3.建立窗体的自定义坐标系统，利用Line方法在窗体上绘制8个矩形，分别用8种FillStyle属性进行填充。代码如下：Private Sub Form_Click()Scale (0, 0)-(2500, 400)For i = 0 To 7FillStyle = iLine (100 + i * 250, 100)-Step(200, 200) , , BNext iEnd Sub例4.设计一程序。要求单击装载按钮装入图形，且图形不随图片框大小而伸缩；单击复制按钮，将图片框中的图形复制到图形框中；单击清除按钮，清除两控件中的图形，并使两控件的高和宽均为1935；单击AutoSize按钮，图片框自动调整尺寸以适应图片的大小，单击Stretch按钮，图像框中的图形自动调整大小以适应图像框的尺寸。解答（1）界面设计在窗体上建立一个图片框、一个图像框和5个命令按钮，其属性如下表：控件名属性设置Picture1Image1BorderStyle1-FixedSingleCommand1Caption装载Command2Caption复制Command3Caption清除Command4CaptionAutoSizeCommand5CaptionStretch程序设计界面如图4所示：图4（2）编写Command1-Command5的事件代码程序参考代码如下：Private Sub Command1_Click()Picture1.Width = 1935Picture1.Height = 1935Picture1.AutoSize = FalsePicture1.Picture = LoadPicture(d:图莫扎特.jpg)End SubPrivate Sub Command2_Click()Image1.Stretch = FalseImage1.Picture = Picture1.PictureEnd SubPrivate Sub Command3_Click()Picture1.Width = 1935Picture1.Height = 1935Image1.Width = 1935Image1.Height = 1935Picture1.Picture = LoadPicture()Image1.Picture = LoadPicture()End SubPrivate Sub Command4_Click()Picture1.AutoSize = TrueEnd SubPrivate Sub Command5_Click()Image1.Width = 1935Image1.Height = 1935Image1.Stretch = TrueEnd Sub（3）运行程序程序运行界面如图5所示：图5例5创建一个绘图程序。当程序运行时，单击“开始“按纽，在Picture控件上画出随机彩色同心圆，单击“清屏” 按钮，则图像消失。要求坐标度量单位为毫米，边线的宽度为2像素，绘制的圆不超出窗体。程序运行界面如图6所示。图6分析：（1）用Circle方法画圆，需要确定圆心的位置和半径，根据题意将圆心设在窗体中心，则圆心的坐标为:X = Form1.ScaleWidth / 2, Y = Form1.ScaleHeight / 2,题目要求绘制的圆不超出窗体，所以圆的半径应为窗体净宽度和净高度中较小者的一半。（2）题目要求坐标度量单位为毫米，则ScaleMode = 6。边线的宽度为2像素，则DrawWidth = 2。程序代码如下：Private Sub Command1_Click() Dim X As Integer, Y As Integer, r As Integer, r1 As Integer, i As IntegerScaleMode = 6DrawWidth = 2X = Form1.ScaleWidth / 2Y = Form1.ScaleHeight / 2If ScaleWidth ScaleHeight Thenr = YElser = XEnd IfFor r1 = 0 To rForm1.Circle (X, Y), r1, RGB(255 * Rnd, 255 * R