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

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

《第6章 图形图像和多媒体应用程序设计方法.docx》由会员分享，可在线阅读，更多相关《第6章 图形图像和多媒体应用程序设计方法.docx（13页珍藏版）》请在冰豆网上搜索。

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

第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所示。

注意：

窗体的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的坐标系。

PrivateSubForm_Click（）

Cls

Form1.ScaleLeft=-14

Form1.ScaleTop=14

Form1.ScaleWidth=28

Form1.ScaleHeight=-28

Line（-14,0）-（14,0）

Line（0,14）-（0,-14）

CurrentX=0:

CurrentY=0:

Print0

CurrentX=13:

CurrentY=2:

Print"X"

CurrentX=0.5:

CurrentY=13:

Print"Y"

EndSub

程序运行界面如图2所示：

图2

2.采用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控件中的图形保持原尺寸。

因此如果图形比图片框大，则超过的部分将被裁剪掉。

可作为容器。

AutoSize

BorderStyle（用来设置图片框的边框风格）

PictureBox（用于加载图片）

Image控件（图像框）

用来显示图片。

Stretch属性设置为False时，图像框可自动改变大小以适应其中的图形，设置为True时，加载到图像框的图形可自动调整尺寸以适应图像框的大小。

该控件没有AutoSize属性。

不能作为容器。

PictureBox（用于加载图片）、

Stretch

Line控件（线条）

用于在容器对象中画直线。

由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所示。

常用属性有：

AutoEnable属性、PlayEnabled属性、PlayVisible属性、Command属性、

DeviceType属性、Length属性、Notify属性、Mode属性。

常用事件主要有：

Click事件、Done事件、StatusUpdate事件。

StatusUpdate事件允许应用程序更新显示，以通知用户当前MCI设备的状态。

应用程序可以从Position、Length和Mode等属性中获得状态信息。

4.图形方法

VB常用图形方法如表2所示。

表2VB常用图形方法

方法

说明

语法格式

Line

画直线、矩形、三角形

[对象].Line[[Step]（X1,Y1）]-[Step]X2,Y2）][,[Color][,B[F]]

Circle

画圆、椭圆、圆弧、扇形等

[对象].Circle[Step]（X,Y）,radius[,[color][,[start][,end][,aspet]]

Pset

画点

[对象].Pset[Step]{x,y}[Color]

Point

返回指定点的颜色

[对象.]Point（x,y）

Cls方法

用来清除绘图区

[对象.]cls

5.绘图属性

常用绘图属性及功能如表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缇的红色矩形，再用蓝色画出矩形的两条对角线。

代码如下：

PrivateSubForm_Click（）

Line（200,200）-（1000,1000）,RGB（255,0,0）,B

Line（200,200）-（1000,1000）,RGB（0,0,255）

Line（200,1000）-（1000,200）,RGB（0,0,255）

EndSub

例2.在窗体上绘制一个圆心在（2000，2000）、半径为1000缇的红色圆，内部用绿色水平线填充。

代码如下：

PrivateSubForm_Click（）

FillStyle=2

FillColor=RGB（0,255,0）

Circle（2000,2000）,1000,RGB（255,0,0）

EndSub

例3.建立窗体的自定义坐标系统，利用Line方法在窗体上绘制8个矩形，分别用8种FillStyle属性进行填充。

代码如下：

PrivateSubForm_Click（）

Scale（0,0）-（2500,400）

Fori=0To7

FillStyle=i

Line（100+i*250,100）-Step（200,200）,,B

Nexti

EndSub

例4.设计一程序。

要求单击装载按钮装入图形，且图形不随图片框大小而伸缩；单击复制按钮，将图片框中的图形复制到图形框中；单击清除按钮，清除两控件中的图形，并使两控件的高和宽均为1935；单击AutoSize按钮，图片框自动调整尺寸以适应图片的大小，单击Stretch按钮，图像框中的图形自动调整大小以适应图像框的尺寸。

解答

（1）界面设计

在窗体上建立一个图片框、一个图像框和5个命令按钮，其属性如下表：

控件名

属性

设置

Picture1

Image1

BorderStyle

1-FixedSingle

Command1

Caption

装载

Command2

Caption

复制

Command3

Caption

清除

Command4

Caption

AutoSize

Command5

Caption

Stretch

程序设计界面如图4所示：

图4

（2）编写Command1-Command5的事件代码

程序参考代码如下：

PrivateSubCommand1_Click（）

Picture1.Width=1935

Picture1.Height=1935

Picture1.AutoSize=False

Picture1.Picture=LoadPicture（"d:

\图\莫扎特.jpg"）

EndSub

PrivateSubCommand2_Click（）

Image1.Stretch=False

Image1.Picture=Picture1.Picture

EndSub

PrivateSubCommand3_Click（）

Picture1.Width=1935

Picture1.Height=1935

Image1.Width=1935

Image1.Height=1935

Picture1.Picture=LoadPicture（）

Image1.Picture=LoadPicture（）

EndSub

PrivateSubCommand4_Click（）

Picture1.AutoSize=True

EndSub

PrivateSubCommand5_Click（）

Image1.Width=1935

Image1.Height=1935

Image1.Stretch=True

EndSub

（3）运行程序

程序运行界面如图5所示：

图5

例5．创建一个绘图程序。

当程序运行时，单击“开始“按纽，在Picture控件上画出随机彩色同心圆，单击“清屏”按钮，则图像消失。

要求坐标度量单位为毫米，边线的宽度为2像素，绘制的圆不超出窗体。

程序运行界面如图6所示。

图6

分析：

（1）用Circle方法画圆，需要确定圆心的位置和半径，根据题意将圆心设在窗体中心，则圆心的坐标为:

X=Form1.ScaleWidth/2,Y=Form1.ScaleHeight/2,题目要求绘制的圆不超出窗体，所以圆的半径应为窗体净宽度和净高度中较小者的一半。

（2）题目要求坐标度量单位为毫米，则ScaleMode=6。

边线的宽度为2像素，则DrawWidth=2。

程序代码如下：

PrivateSubCommand1_Click（）

DimXAsInteger,YAsInteger,rAsInteger,r1AsInteger,iAsInteger

ScaleMode=6

DrawWidth=2

X=Form1.ScaleWidth/2

Y=Form1.ScaleHeight/2

IfScaleWidth>ScaleHeightThen

r=Y

Else

r=X

EndIf

Forr1=0Tor

Form1.Circle（X,Y）,r1,RGB（255*Rnd,255*Rnd,255*Rnd）

Next

EndSub

PrivateSubCommand2_Click（）

Cls

EndSub

例6,建立坐标系，在坐标系上用Pset方法绘制－2π到2π之间的正弦曲线。

程序运行界面如图7所示。

图7

分析：

（1）可用Scale方法定义坐标系。

由于所要绘制的正弦曲线在（－2π，2π）之间，考虑到四周的要有一些空隙，故X轴的范围可定义在（－8，8），Y轴的范围可定义在（－1.8，1.8）。

采用Scale（－8，1.8）-（8,-1.8）定义坐标系。

（2）坐标轴用Line方法画出。

（3）用CurrentX、CurrentY属性设定当前位置，然后用Print方法标注原点，X轴和Y轴。

（4）用Pset方法绘制正弦曲线，为使曲线光滑，X轴上相邻两点的距离取0.01。

程序代码如下：

PrivateSubForm_Click（）

DimiAsDouble,xAsDouble,yAsDouble

Cls

Form1.Scale（-8,2）-（8,-2）

Line（-7.5,0）-（7.5,0）

Line（0,1.8）-（0,-1.8）

CurrentX=7.5:

CurrentY=0.2:

Print"X"

CurrentX=0.3:

CurrentY=1.8:

Print"Y"

CurrentX=0.2:

CurrentY=-0.1:

Print"0"

Fori=-6.283To6.283Step0.01

x=i:

y=Sin（i）

PSet（x,y）

Nexti

EndSub