Visual Basic程序设计与实训 教学课件 ppt 作者 苏玉雄 电子教案 第10章

第 10 章 简单多媒体编程,本章学习目标,多媒体在人类文化活动中扮演的角色越来越重要。计算机多媒体技术有效地结合了计算机及传统的视听科技，让用户以交互方式将文本（Text）、图像(Image)、图形(Graphic)、音频(Audio)、动画(Animation)、视频(Video)等多种信息，经过计算机软硬件设备获取、操作、编辑、存储等处理后，以单独或合成的形态表现出来。VB为用户提供了一个多媒体控制接口MCI，通过MCI这个公用接口，用户无需介入实际的设备就可操纵所有的多媒体设备。 计算机图形、图像、声音和动画等是计算机多媒体技术的基本内容。本章介绍这方面的基本知识以及它们在VB中的基本实现方法。 VB提供的图形控件主要有：直线（Line）控件、形状（Shape）控件、图片框（PictureBox）控件、图像框（Image）控件。VB的图形方法有Line、Circle、Pset和Point等。每一个控件都适用于一个特定的目的。Imag、Shape和Line控件需要较少的系统资源，且包含PictureBox中的可用的属性、方法和事件的子集，因此，比PictureBox控件显示得快。,10.1 直线控件和形状控件,10.1.1控件概述及属性说明 1直线控件 直线（Line）控件主要用来在窗体、框架或者图片框的表面绘制简单的线段。它常用的属性如下： X1，Y1，X2，Y2属性 格式：对象名称.X1|Y1|X2|Y2 =number 功能：通过设置线段的起点坐标(X1,Y1)和终点坐标(X2,Y2)属性，可设置线段的长度。 说明：”对象名称”参数是指添加到窗体中的直线控件的名称，其默认值为Line1。表示添加的直线控件的名字。X1和Y1分别表示线段的起点的横、纵坐标，X2和Y2分别表示线段的终点的横、纵坐标。Number表示一个数值，用来设置线段的坐标值。 示例：绘制一条起点坐标为（50，50），终点坐标为（500，500）的线段。 Line1.X1=50: Line1.Y1=50: Line1.X2=500: Line1.Y2=500 其他属性：另外，还有几种与图片框控件一样的属性，可以控制控件的外观。直线控件不支持任何事件。,10.1 直线控件和形状控件,2形状控件 形状（Shape）控件主要用于在窗体、框架或图片框中绘制预定义的几何图形，例如：矩形、正方形、椭圆形、圆形、圆角矩形、圆角正方形。它常用的属性如下： Shape属性 格式：对象名称.Shape=number 功能：返回或设置形状控件的。其取值为整数类型，默认设置为0。 说明：“对象名称”参数是指添加到窗体中的形状控件的名称，其默认值为Shape1。Number表示一个整数值，其合法取值有6个：05。其中，0表示vbShapeRectangle，即矩形；1表示vbShapeSquare，即正方形；2表示vbShapeOval，即椭圆形；3表示vbShapeCircle，即圆形；4表示vbShapeRectangle,即圆角矩形；5表示vbShapeRoundedSquare,即圆角正方形。 其他属性：另外，还有几种与直线控件一样的属性，可以控制控件的外观。如BorderColor（边框颜色）和FillColor（填充颜色）属性可以改变其颜色，BorderStyle（边框样式）、BorderWidth（边框宽度）、FillStyle（填充样式）和DrawMode（绘图模式）属性可以控制如何画图。 形状控件不支持任何事件，只用于表面装饰。,10.1.2 案例实践,案例1：形状控件和直线控件举例。 【案例说明】：在窗体上添加6个Shape控件（数组）和6个Line控件（数组） 【案例分析】：在本实例中我们使用控件数组，采用For循环结构对控件的相关属性赋值。 【操作步骤】： 1、界面设计 界面设计如图10-1a所示。 2、编写代码 3、程序运行界面：如图10-1b所示。,10.1.3 课堂练习,课堂练习1：用Shape控件数组产生棋盘图案。 【案例说明】：棋盘图案为19路乘19路。 【操作步骤】： 1、界面设计 在窗体上添加一个Shape控件，设置其Index属性为0，Visible属性为False，BackColor属性为白色。 2、编写代码 3、程序运行界面：程序运行结果如图10-2所示。,10.2 图片框和图像框控件,10.2.1控件概述及属性说明 1图片框控件（PictureBox） 图片框控件主要用来显示图片。此外，它还可以作为其他控件对象的容器。实际显示的图片由Picture属性决定。Picture属性可设置被显示的图片文件名。在程序运行时可以使用LoadPicture()在图形框中装入图形。 为了在运行时从图形框中删除一个图形，可用LoadPicture()，将一个空白图形装入图形框的Picture属性。 PictureBox控件不提供滚动条，也不能伸展被装入的图形以适应控件尺寸，但可以用图形框的的Autosize属性调整图形框大小以适应图形尺寸。当Autosize属性设置为True时，图形框能自动调整大小与显示的图片匹配。如果将Autosize属性设置为False时，则图形框不能自动改变大小来适应其中的图形，加载到图形框中的图形保持其原始尺寸，这意味着如果图形比控件大，则超过的部分将被剪裁掉。 PictureBox控件也可以用作其他控件对象的容器。像Frame控件一样，可以在PictureBox控件上面加上其他控件。这些控件随PictureBox移动面移动，其Top和Left属性是相对PictureBox而言，而与窗体无关。当PictureBox大小改变时，这些控件在PictureBox控件中的相对位置保持不变。,10.2 图片框和图像框控件,Picture属性 用于设置图片框加载的图片文件。 BoderStyle属性 用于设置图片框的边框样式。取值0，图片框无边框；取值1，图片框显示为凹进去的矩形框，被加载的图片放在框内。 Autosize属性 当取True时，图片框大小自动适应图片尺寸，而取False（默认值）时，图片框的大小不能改变。当框小于图片时则截掉图片多余部分，相反则会留下框的多余部分而影响艺术效果。 ScaleWidth属性 设置图片框上绘图区宽度和横坐标轴方向。 ScaleHeight属性 设置图片框上绘图区高度和纵坐标轴方向。 FillColor属性 返回或设置用于填充形状的颜色，也可用来填充由Circle和Line图形方法生成的圆和矩形框。其属性值既可在属性窗口设定，也可以在代码中设定。 FillStyle属性 返回或设置用于填充Shape控件以及由Circle和Line图形方法生成的圆和方框的模式。图形方法的输出外观。其属性值既可在属性窗口设定，也可以在代码中设定。如果FillStyle设置为1（透明），则忽略FillColor属性，但Form对象除外。,10.2 图片框和图像框控件,2图像框控件（Image） 在窗体上使用图像框的步骤与图片框同。但是图像框比图片框占用更少的的内存，描绘得更快。与图形框不同的是图像框内不能保存其他控件。 图像框没有Autosize属性，但它有Stretch属性。Strtct属性设置为False时，图像框可自动改变大小以适应其中的图形，Stretch属性设置为True时，加载到图像框的图形可自动调整尺寸以适应图像框的大小。 如果图像框内装入的图形较大，在Form窗体比较小的情况下，图像框的边界会被窗体的边界截断。可以通过代码使图像框适应窗体尺寸的变化,10.2 图片框和图像框控件,DrawWidth属性 用于返回或设置图形方法输出的线宽。其值范围从1-32767，该值以像素为单位表示线宽。默认值为1，即一个像素宽。增大该属性值会增加线的宽度。 DrawMode属性 用于返回或设置图形方法的输出外观。其属性值既可在属性窗口设定，也可以在代码中设定。 Picture属性 用于设置图像控件加载的图片文件。 BorderStyle属性 用于设置图像控件边框显示样式。0值无边框，1值有边框。 Stretch属性 缩放属性，取逻辑值。取True时，把图形缩放到刚好填满图像框；取False时，调整图像框尺寸到刚好放下图形，而图形的大小是不变的。与图片框的AutoSize比较可以看出，图片框的AutoSize取True值时，只改变图片框的大小以适应图片，而不能改变图片的大小以适应图片框，类似于图像框的Strtch取False值时的情况。,10.2.2 案例实践,案例1：图片框的Picture、Borderstyle、Auatosize、ScaleWidth、ScaleHeight、Left、Top属性举例。 【案例说明】：在窗体上添加1个图片框Picture1，在属性窗口设置其Picture属性值为“D:My Documents1.jpg”,其BorderStyle值为0，AutoSize值为False。 【案例分析】：本例使用LoadPicture()调用图片；设置属性使窗体大小随图片框的变化而变化，且使图片框位于窗体中央。 【操作步骤】： 1、界面设计：界面设计如图10-3a所示。 2、编写代码 3、程序运行界面：如图10-3b所示。,10.2.2 案例实践,案例2：图片框的DrawMode、DrawWidth属性举例。 【案例说明】：在窗体上添加1个图片框Picture1，设置其BoderStyle属性值为1，DrawWidth属性值为10。 【案例分析】：本例设置DrawMode属性值从0变化到15，使得图片框的前景色变化16次。 【操作步骤】： 1、界面设计：如图10-4a所示。 2、编写代码 3、程序运行界面：如图10-4b所示。,10.2.3 课堂练习,课堂练习1：图片框的FillColor、FillStyle属性举 例。 【案例说明】：本例鼠标在图片框移动时，可用随机的FillColor、FillStyle属性设置值在图片框中构造许多圆。 【操作步骤】： 1、界面设计 在窗体上添加一个图片框。参见图10-4a所示。 2、编写代码 3、程序运行界面：如图10-5所示。,10.2.3 课堂练习,课堂练习2：图像框的常用属性举例。 【案例说明】：本例鼠标在单击命令按钮后，图像向左上方移动直至填充整个窗体。 【操作步骤】： 1、界面设计：在窗体上添加一个图像框和一个命令按钮，如图10-6a所示。 2、编写代码 3、程序运行界面：如图10-6b所示。,10.3 绘制图形的方法,10.3.1 绘制图形的方法 1、Line方法 Line方法主要用于画直线或矩形，其语法格式如下： 对象. Line Step(x1,y1)-(x2,y2),颜色,BF 其中，对象指示Line在何处产生结果，它可以是窗体或图形框，缺省时为当前窗；(x1,y1)为线段的起点坐标或矩形的左上角坐标；(x2,y2)为线段的终点坐标或矩形的右下角坐标；关键字Step表示采用当前作图位置的相对值；关键字B表示画矩形；关键字F表示用画矩形的颜色来填充由FillColor和FillStyle属性决定。 2、Circle方法 Circle方法用于画圆、椭圆、圆弧和扇形，其语法格式如下： 对象. Circle Step(x,y),半径,颜色,起始角,终止角,长短轴比率 其中，对象指示Circle在何处产生结果，它可以是窗体或图形框或打印机，缺省时为当前窗；(x,y)为圆心坐标，关键字Step表示采用当前作图位置的相对值；圆弧和扇形通过参数起始角、终止角控制。,10.3 绘制图形的方法,当起始角、终止角取值在0-2时为圆弧，当在起始角、终止角取值前加一负号时，画出扇形，负号表示画圆心到圆弧的径向线；椭圆通过长短轴比率控制，默认值为1，画圆。 3、Pset方法 Pset方法用于画点，其语法格式如下： 对象. Pset Step(x,y),颜色