3.1.1.4.6《教学项目--VB程序设计》.doc

项目四 动画设计模块一 图形控件活动一 图形控件与计时器【参考学时】6课时【学习目标】u 掌握直线控件和图形控件的使用方法u 初步学会计时器控件的使用【活动描述】设计一个应用程序，其功能如图一所示。鼠标指向相应命令按钮可以显示该内容说明，单击命令按钮可以进入相应界面对应的功能。(图一：主界面)（图二：自制式时钟界面）（图三：直线与图形控件）【活动分析】1. line和shape控件界面通过属性的改变来改变形状的外观。在界面上使用标签、滚动条等控件。2. 自制式时钟需使用一个新的控件时钟控件，结合时间函数就可以完成该界面。【学习支持】1. shape控件shape控件可用于在窗体、框架或图片框中创建许多预定义形状，比如矩形、正方形、椭圆形、圆形、圆角矩形或圆角正方形。Shape控件的重要属性：Backstyle、borderstyle、fillstyle、borderwidth、shape2. line控件该控件用来在窗体、框架或图片框中创建简单的线段。Line控件的重要属性：Borderstyle、bordercolor、borderwidth、drawmode、x1、y1、x1、y13. timer控件重要属性：interval、enabled 【小小实例】 计时器倒计时、计数【活动步骤】1. 主界面界面设计： 代码设计：Private Sub Command1_Click()Form2.ShowEnd SubPrivate Sub Command1_MouseMove(Button As Integer, Shift As Integer, X As Single, Y As Single)Label1.Caption = shape控件主要用于在窗体、框架或图片中创建许多预定义的形状，比如矩形、正方形、椭圆形、圆形、圆角矩形或圆角正方形。通过交互式教学演示，使同学了解并掌握visual basic系统所提供的shape控件的主要属性和应用方法End SubPrivate Sub Command2_Click()Form3.ShowEnd SubPrivate Sub Command2_MouseMove(Button As Integer, Shift As Integer, X As Single, Y As Single)Label1.Caption = 通过制作数字式时钟，对经常使用到的定时器控件的主要参数及应用特点等有个更清楚的认识。End Sub2自制式时钟界面Private Sub Command1_Click()Form1.ShowMe.HideEnd SubPrivate Sub Timer1_Timer()Label1.Caption = NowEnd Sub3.直线与形状控件界面Private Sub Command1_Click()Timer1.Enabled = TrueEnd SubPrivate Sub Command2_Click()Form1.ShowMe.HideEnd SubPrivate Sub HScroll1_Change()Timer1.Enabled = FalseLine1.BorderStyle = HScroll1.ValueLabel1.Caption = borderstyle的属性值： & HScroll1.ValueEnd SubPrivate Sub HScroll2_Change()Timer1.Enabled = FalseShape1.Shape = HScroll2.ValueLabel2.Caption = shape的属性值： & HScroll2.ValueEnd SubPrivate Sub HScroll3_Change()Timer1.Enabled = FalseShape1.FillStyle = HScroll3.ValueLabel3.Caption = fillstyle的属性值： & HScroll3.ValueEnd SubPrivate Sub Timer1_Timer()Static i As Integeri = i + 1Line1.BorderStyle = i Mod 6Shape1.Shape = i Mod 6Shape1.FillStyle = i Mod 8End Sub【知识小结】1. line控件的属性及其使用2. shape控件的属性及其使用3timer控件的使用项目四 动画设计模块一 图形控件活动二 图片框与图像框控件【参考学时】8课时【学习目标】u 掌握图片框和图象框控件加载图片的三种方法u 掌握图片框和图象框控件的异同点u 运用图片框和图象框设计窗体【活动描述】在前一个活动基础上增加一个功能，分别用图片框和图像框设计界面，能通过命令按钮改变控件中图像的大小，并能实现对图像水平，垂直翻转。【活动分析】要改变图象内容的大小，只要改变控件的大小，改变控件大小很方便，但如果要使得控件中的内容随着控件的改变而改变其大小，则要设置相关属性。【学习支持】一 图片框控件名：picturebox常用属性：1picture 可用图片类型 *.bmp *.jpg *.ico *.wmf2autosize true或false图片框中装入图片的方法：1 Picture属性设置该属性选择图片2 用“复制”“粘贴”的方法在其他编辑软件中“复制”所需图片然后在控件上“粘贴”3 Loadpicture方法 Picture1.picture=loadpicture(“d:aa.jpg”)二图象框 控件名：image 与图片框类似 不同点：1 图象框占内存小，一般尽量使用图象框2 图片框相当于一个容器，里面可以放其他控件3 图片框可用autosize属性调整合适的大小;false *.wmf 图象跟着控件变 否则，控件跟着图象变。图象框可用stretch属性调整合适的大小 三图片框的方法paintpicture方法格式：目标对象.paintpicture 源对象,dx,dy,dw,dh,sx,sy,sw,sh垂直翻转：Picture2.PaintPicture Picture1.Picture, 0, Picture1.ScaleHeight, Picture2.ScaleWidth, -Picture2.ScaleHeight水平翻转：Picture2.PaintPicture Picture1.Picture, Picture1.ScaleWidth, 0, -Picture2.ScaleWidth, Picture2.ScaleHeight【活动步骤】一 界面设计设置图片框picture1的autosize属性为FALSE，载入wmf文件设置图像框image1的stretch属性为TRUE，载入jpg文件二代码设计Private Sub Command2_Click()Picture1.Width = Picture1.Width + 50Picture1.Height = Picture1.Height + 50Image1.Width = Image1.Width + 50Image1.Height = Image1.Height + 50End SubPrivate Sub Command3_Click()Picture1.Width = Picture1.Width - 50Picture1.Height = Picture1.Height - 50Image1.Width = Image1.Width - 50Image1.Height = Image1.Height - 50End SubPrivate Sub Form_Load()Picture1.Picture = LoadPicture(App.Path + bb.wmf)Image1.Picture = LoadPicture(App.Path + aa.jpg)Picture1.Width = 1500Picture1.Height = 1000Image1.Width = 1500Image1.Height = 1000End SubPrivate Sub Command4_Click()Picture2.PaintPicture Picture1.Picture, Picture1.ScaleWidth, 0, -Picture2.ScaleWidth, Picture2.ScaleHeightEnd SubPrivate Sub Command5_Click()Picture2.PaintPicture Picture1.Picture, 0, Picture1.ScaleHeight, Picture2.ScaleWidth, -Picture2.ScaleHeightEnd Sub【知识小结】1. 图片框与图像框的重要属性2. 两者的区别3使用其设计界面【自主实践活动】设计一个图形编辑软件。可以浏览硬盘中的图形文件，打开一个图形文件等。项目四 动画设计模块二 图形方法活动一 图形方法的应用【参考学时】8课时【学习目标】u 掌握line方法的格式，学会用line方法画直线、矩形、正方形等u 掌握circle方法的格式，学会用circle方法画圆、椭圆、圆弧等u 掌握pset方法的格式【活动要求】设计一个应用程序，其功能如下图：鼠标移到命令按钮上分别显示相应的功能描述，单击该命令按钮进入该功能界面。【活动分析】1. 主界面实现如前一个活动。2. line方法界面通过line方法在图片框控件中绘制菱形和矩形。3. circle方法界面通过不同的参数设置使用circle方法在图片框中绘制出圆、椭圆和弧形。4. pset方法界面中结合计时器控件在界面上实现群星闪烁的效果。【学习支持】1. line方法格式：对象名.line(x1,y1)-(x2,y2),color,mode参数说明：x1,y1：画线起点，缺省时从当前位置开始画x2,y2：画线目标点（结束点）color：指定线条颜色mode：可选参数。如为B，则画一个矩形框，框的填充色及图案用fillcolor和fillstyle属性指定。如设置为BF，矩形框用与线条一样的颜色填充。【小贴士】颜色函数：RGB(R,G,B)与QBCOLOR（N）其中参数R,G,B的取值范围是0255N的取值范围是015 2. circle方法格式：对象名.circle(x,y),radius,color,start,end,aspect参数说明：x,y：指定了圆心位置radius：指定半径Color：指定颜色Start，end：弧的起始位置和终点位置。Aspect：指定圆的长宽比例。1举例：（1）画圆circle(500,500),100circle(500,500),100,RGB(0,0,255)（2）画椭圆circle(500,500),100,0.5（3）画圆弧circle(500,500),100,0,3.1415926（4）画扇形circle(500,500),100,-1,-3.1415926 3Pset方法格式：对象名.pset（x，y），color【实施步骤】1.line方法界面Private Sub Command1_Click()Dim cx, cy, f, f1, f2, iPicture1.ScaleMode = 3cx = Picture1.ScaleWidth / 2cy = Picture1.ScaleHeight / 2Picture1.DrawWidth = 8For i = 50 To 0 Step -2 f = i / 50 f1 = 1 - f f2 = 1 + f Picture1.ForeColor = QBColor(i Mod 15) Picture1.Line (cx * f1, cy * f1)-(cx * f2, cy * f2), , BFNext IIf cy cx Then Picture1.DrawWidth = Picture1.ScaleWidth / 25Else Picture1.DrawWidth = Picture1.ScaleHeight / 25End IfFor i = 0 To 50 Step 2 f = i / 50 f1 = 1 - f f2 = 1 + f Picture1.Line (cx * f1, cy)-(cx, cy * f1) Picture1.Line -(cx * f2, cy) Picture1.Line -(cx, cy * f2) Picture1.Line -(cx * f1, cy) Picture1.ForeColor = QBColor(i Mod 15)Next iEnd Sub2.circle界面Dim aspect As Single, startangle As Single, endangle As SingleConst pi = 3.14159Private Sub Command1_Click()Picture1.ClsIf Option5.Value = True Then If Check1.Value Then startangle = -Val(Text1.Text) / 180 * pi endangle = -Val(Text2.Text) / 180 * pi Else startangle = Val(Text1.Text) / 180 * pi endangle = Val(Text2.Text) / 180 * pi End If Picture1.Circle (0, 0), Val(Text4.Text), , startangle, endangleElse Picture1.Circle (0, 0), Val(Text4.Text), , , , aspectEnd IfEnd SubPrivate Sub Form_Load()Picture1.Scale (-1000, 1000)-(1000, -1000)End SubPrivate Sub Option1_Click()Picture1.FillStyle = 0End SubPrivate Sub Option2_Click()Picture1.FillStyle = 1End SubPrivate Sub Option3_Click()aspect = 1Frame3.Visible = FalseFrame4.Visible = FalseEnd SubPrivate Sub Option4_Click()Frame3.Visible = FalseFrame4.Visible = TrueText3.SetFocusEnd SubPrivate Sub Option5_Click()Frame4.Visible = FalseFrame3.Visible = TrueEnd SubPrivate Sub Text3_LostFocus()aspect = Val(Text3.Text)End Sub3. pset方法界面Private Sub Timer1_Timer()ClsFor i = 1 To 200 PSet (Form4.Width * Rnd, Form4.Height * Rnd)Next iEnd Sub【知识小结】1. line方法中的B参数和BF参数的含义2. circle方法中的start，end，aspect参数的含义自主实践活动用绘图方法在窗体上画出以下图形：项目四 动画设计模块二 图形方法活动二 用算法编程实现动画效果【参考学时】10课时【学习目标】u 学会使用计时器结合所学的控件（标签、图像框等）设计动画u 进一步练习编程技巧，熟练数组与控件数组的使用u 灵活设计程序实现不同的动画效果【活动要求】 设计一个应用程序如图所示，单击命令按钮能进入相应的动画界面，并实现“歌词切换”、“蝴蝶飞”、“月亮的变化”、“红绿灯汽车”动画效果。 【活动分析】 本活动主要完成四个动画效果的制作： 歌词切换：运用标签和计时器控件循环显示歌词。 蝴蝶飞： 两幅图循环显示造成飞舞的效果。 月亮的变换：多幅图循环显示形成变换效果。 红绿灯控制汽车：红黄绿灯按照一定的规律显示从而控制汽车图片的移动。 【知识回顾】一 计时器的使用interval属性的设置 二数组应用 定义：dim a(10) as integer数组赋值：a(0)=10 三变量的使用范围1 局部变量2 窗体级变量3 全局变量 【实施步骤】1 歌词切换 界面设计代码设计Dim a(10) As StringDim i As IntegerPrivate Sub Form_Load()a(1) = 你的泪光 柔弱中带伤a(2) = 惨白的月儿弯弯 固住过往a(3) = 夜太漫长 凝结成了霜a(4) = 是谁在阁楼上冰冷地绝望a(5) = 雨轻轻叹 朱红色的窗a(6) = 我依身在纸上被风吹乱a(7) = 梦在远方 化成一缕香a(8) = *i = 0End SubPrivate Sub Timer1_Timer()i = i + 1Label2.Caption = a(i)If i = 8 Then i = 0End Sub2蝴蝶飞 界面设计 代码设计 Private Sub cmdEnd_Click()frmbutt.HideEnd SubPrivate Sub Timer1_Timer() Static ImaBmp As Integer ImaMain.Move ImaMain.Left + 20, ImaMain.Top - 5 If ImaBmp Then ImaMain.Picture = ImaOpenWings.Picture Else ImaMain.Picture = ImaCloseWings.Picture End If ImaBmp = Not ImaBmpEnd Sub3月亮的变化 界面设计 代码设计Private Sub cmdEnd_Click()frmmoon.HideEnd SubPrivate Sub Form_Load()For i = 0 To 8fn = App.Path + y1 + Trim(Str(i) + .jpgImage2(i).Picture = LoadPicture(fn)Next iEnd SubPrivate Sub Timer1_Timer()Static counter As IntegerImage1.Move Image1.Left + 100counter = counter + 1If counter = 9 Then counter = 1Image1.Picture = Image2(counter - 1).PictureEn