ScaleLeftScaleTopHeightScaleHeightScaleWidth111图形设计基础课件.ppt

1、LOGO第第1111章章 图形设计图形设计本章要点本章要点: : 图形设计基础图形设计基础 图形控件图形控件 绘图方法绘图方法 与绘图有关的常用属性、事件和方法与绘图有关的常用属性、事件和方法211.1 11.1 图形设计基础图形设计基础v11.1.1 11.1.1 坐标系统坐标系统 缺省坐标系统缺省坐标系统: x x轴轴y y轴轴(0,0)(0,0)3v 1. 刻度单位刻度单位 缺省刻度单位缺省刻度单位: 缇缇(Twip) 改变刻度单位改变刻度单位: 对象名对象名.ScaleMode = 属性值属性值厘米厘米毫米毫米英寸英寸字符字符, ,水平单位水平单位:120 :120 缇；垂直单位缇；垂

2、直单位:240:240缇缇像素，表示分辩率的最小单位像素，表示分辩率的最小单位 点，点，72点等于一英寸点等于一英寸缇缇( (缺省值缺省值) )，14401440缇等于一英寸缇等于一英寸 用 户 自 定 义 。 可 以 设 置用 户 自 定 义 。 可 以 设 置 S c a l e H e i g h t ，ScaleWidth， ScaleTop ，ScaleLeft属性属性说明说明 7 7 CentimeterCentimeter 6 - 6 - MillimeterMillimeter 5 5 Inch Inch 4 - 4 - CharacterCharacter 3 - 3 - P

3、ixelPixel 2 - 2 - PointPoint 1 1 TwipTwip 0 User属性值属性值 11.1 图形设计基础图形设计基础4v 2. 改变坐标系改变坐标系 (1) ScaleLeft、ScaleTop属性属性 改变坐标系的原点位置。改变坐标系的原点位置。 【例【例11-1】Private Sub Command1_Click() Label1.Left = 0 Label1.Top = 0 End Sub (0,0)11.1 图形设计基础图形设计基础5Private Sub Command1_Click() Form1.ScaleLeft = 200 Form1.Scal

4、eTop = 300 Label1.Left = 0 Label1.Top = 0End Sub (200,300)11.1 图形设计基础图形设计基础6(2) ScaleWidth和和ScaleHeight属性属性 表示容器对象的内部宽度与高度。表示容器对象的内部宽度与高度。 用于自定义一个刻度单位。用于自定义一个刻度单位。例例:使用使用ScaleWidth和和ScaleHeight改变窗体刻度单位改变窗体刻度单位 设窗体高度是设窗体高度是2000Twips，宽度是宽度是3000Twips。 此时水平和垂直刻度单位均为此时水平和垂直刻度单位均为1Twips。 如果设置如果设置: ScaleHe

5、ight=500 则将窗体的高度划分为则将窗体的高度划分为500个单位个单位, 每个单位为每个单位为2000/500，即，即4Twips 如果设置如果设置: ScaleWidth=1000 则将窗体的宽度划分为则将窗体的宽度划分为1000个单位，个单位， 每个单位为每个单位为3000/1000，即，即3Twips 将将 ScaleHeight、ScaleWidth、ScaleLeft 与与 ScaleTop 属性属性设置为任何值都自动将设置为任何值都自动将 ScaleMode 设置为设置为 0。11.1 图形设计基础图形设计基础7v【例【例11-2】将一个图形】将一个图形(Shape1)的左上

6、角移动到窗体的左上角移动到窗体的中央位置。的中央位置。Private Sub Command1_Click() Form1.ScaleHeight = 2 Form1.ScaleWidth = 2 Shape1.Left = 1 Shape1.Top = 1End Sub(1,1)11.1 图形设计基础图形设计基础8【例【例11-3】定义窗体的左下角为原点】定义窗体的左下角为原点(0，0)，y坐标轴正方向坐标轴正方向向上。向上。Private Sub Form_Load()ScaleHeight = -4ScaleWidth = 4ScaleTop = 4End Sub Private Sub

7、 Command1_Click()Shape1.Left = 1Shape1.Top = 1End Sub(0,0)(1,1)11.1 图形设计基础图形设计基础9【例【例11-4】定义窗体的中央位置为原点】定义窗体的中央位置为原点(0，0)，y坐标轴正坐标轴正方向向上。方向向上。Private Sub Form_Load() ScaleHeight = -4 ScaleWidth = 4 ScaleTop = 2 ScaleLeft = -2End SubPrivate Sub Command1_Click() Shape1.Left = 1 Shape1.Top = 1End Sub(0,0

8、)(1,1)11.1 图形设计基础图形设计基础10(3) Scale方法方法 格式格式: .Scale (x1,y1)-(x2,y2)【例【例11-5】在图片框】在图片框Picture1中打印中打印5行行5列的单位矩阵。列的单位矩阵。 Private Sub Picture1_Click() Dim a(5, 5) As Integer Picture1.Scale (0, 0)-(6, 6) For i = 1 To 5 Picture1.CurrentY = i For j = 1 To 5 If i = j Then a(i, j) = 1 Else a(i, j) = 0 Pictur

9、e1.CurrentX = j Picture1.Print a(i, j); Next j,i End Sub11.1 图形设计基础图形设计基础11v 3. 当前坐标当前坐标v CurrentX属性属性: 设置或返回的当前坐标的水平坐标设置或返回的当前坐标的水平坐标v CurrentY属性属性: 设置或返回的当前坐标的垂直坐标设置或返回的当前坐标的垂直坐标例如例如: 在点在点(200,200)处显示处显示“当前坐标为当前坐标为(200,200)” Form1.CurrentX = 200 Form1.CurrentY = 200 Form1.Print 当前坐标为当前坐标为(200,200)

10、11.1 图形设计基础图形设计基础12v 4. 与位置和大小有关的属性与位置和大小有关的属性(Left,Top)Width(ScaleLeft,ScaleTop)HeightScaleHeightScaleWidth11.1 图形设计基础图形设计基础1311.1.2 颜色颜色 颜色值颜色值: 四字节、长整型。四字节、长整型。 最低的三个字节最低的三个字节: 红色、绿色、蓝色。红色、绿色、蓝色。 每个字节取值每个字节取值: 00FF(或或0255)1. 在设计阶段设置颜色在设计阶段设置颜色: 在属性窗口设置在属性窗口设置2. 在运行阶段设置颜色在运行阶段设置颜色:(1) RGB函数函数: RGB

11、(red，green，blue) 获取一个长整型获取一个长整型(Long)的的RGB颜色值。颜色值。 例例: Form1.BackColor = RGB(255,0,0) 设置窗体的背景色为红色设置窗体的背景色为红色(2) QBColor函数函数: QBColor(value) value: 07、815(为为07颜色加亮颜色加亮) 0黑色黑色 1蓝色蓝色 2绿色绿色 3青色青色4红色红色 5紫红色紫红色 6黄色黄色 7浅灰色浅灰色 例例: Form1.BackColor = QBColor(4)11.1 图形设计基础图形设计基础14(3) 使用颜色常量使用颜色常量vbBlack黑色黑色vbR

12、ed 红色红色vbGreen绿色绿色vbYellow黄色黄色vbBlue蓝色蓝色vbMagenta洋红色洋红色vbCyan青色青色vbWhite白色白色(4) 使用颜色的十六进制值使用颜色的十六进制值 & &H00H00BBBBGGGGRRRR& &(5) (5) 使用系统颜色使用系统颜色 例例: vbScrollBars &H80000000 滚动条颜色滚动条颜色 vbDesktop &H80000001 桌面颜色桌面颜色 11.1 图形设计基础图形设计基础15v11.2.1 Shape控件控件v 1. 属性属性: Shapev BorderStyle、BorderColor、BorderW

13、idthv BackStyle 、 BackColorv FillStyle、FillColorv 例如例如: BackColorShapeFillStyleFillColor11.2 图形控件图形控件16v2. 方法方法v Movev object.Move left, top, width, height【例【例11-6】在窗体上移动一正方形，每次移动时使正方形的】在窗体上移动一正方形，每次移动时使正方形的长和宽增加长和宽增加100缇。缇。Private Sub Command1_Click() Shape1.Move Shape1.Left + 100, Shape1.Top + 100

14、, _ Shape1.Width + 100, Shape1.Height + 100End Sub11.2 图形控件图形控件17 11.2.2 Line控件控件 1. 作用作用: 设计时在窗体上绘制直线。设计时在窗体上绘制直线。 2. 属性属性: BorderStyle、 BorderWidth X1、X2、Y1 、Y2 注意注意: 运行时可以通过改变运行时可以通过改变 X1、X2、Y1 和和 Y2 属性来移动它或者调整它的大小。而不能属性来移动它或者调整它的大小。而不能 使用使用Move方法方法11.2 图形控件图形控件1811.3 绘图方法绘图方法11.3.1 画点方法画点方法(Pset

15、)格式格式: .PSet Step (x, y) , 功能功能: 在对象的指定位置，用一定的颜色画点在对象的指定位置，用一定的颜色画点说明说明: 窗体、图片框、缺省为当前窗体。窗体、图片框、缺省为当前窗体。 Step 可选的，指定相对于由可选的，指定相对于由 CurrentX 和和 CurrentY 属性提供的当前图形位置的坐属性提供的当前图形位置的坐标。标。 (x, y) 点的水平和垂直坐标。点的水平和垂直坐标。 绘制该点的绘制该点的 RGB 颜色。颜色。 省略时使用省略时使用 的的 ForeColor 属性值。属性值。19【例【例11-711-7】 用用PSetPSet方法在窗体上绘制一条

16、方法在窗体上绘制一条000 0,360,3600 0 的正的正弦曲线。弦曲线。Private Sub Form_Click() DrawWidth = 2 Scale (0, 1)-(360, -1) For x = 0 To 360 y = Sin(x * 3.1415926 / 180) PSet (x, y), vbRed Next xEnd Sub11.3 绘图方法绘图方法20v【例【例11-8】 用用PSet方法在窗体上绘制一条如下图所示方法在窗体上绘制一条如下图所示的星形曲线的星形曲线,曲线由以下参数方程决定曲线由以下参数方程决定:v x=sin2t*costv y=sin2t*s

17、intv 其中其中t的取值范围为的取值范围为0t211.3 绘图方法绘图方法21Private Sub Form_Click() Scale (-1, 1)-(1, -1) DrawWidth = 2 ForeColor = vbRed For t = 0 To 2 * 3.1415926 Step 0.001 x = Sin(2 * t) * Cos(t) y = Sin(2 * t) * Sin(t) PSet (x, y) Next tEnd Sub11.3 绘图方法绘图方法2211.3.2 画线、矩形方法画线、矩形方法(Line)格式格式: .Line Step(x1, y1)Step

18、(x2, y2) , ,BF功能功能: 在指定两点之间用指定的颜色画线或矩形在指定两点之间用指定的颜色画线或矩形说明说明: 窗体、图片框，缺省为当前窗体。窗体、图片框，缺省为当前窗体。 Step可选的，指定相对于由可选的，指定相对于由 CurrentX 和和 CurrentY属性提供的当前位置的坐标。属性提供的当前位置的坐标。 (x1, y1)直线或矩形的起点坐标。如果省略，线起始于直线或矩形的起点坐标。如果省略，线起始于由由 CurrentX 和和 CurrentY 指示的位置。指示的位置。 Step可选的，指定相对于起点的终点坐标。可选的，指定相对于起点的终点坐标。 (x2, y2)直线或

19、矩形的终点坐标。直线或矩形的终点坐标。 画线时用的画线时用的 RGB 颜色。颜色。 B利用对角坐标画出矩形。利用对角坐标画出矩形。 F规定矩形以矩形边框的颜色填充规定矩形以矩形边框的颜色填充。11.3 绘图方法绘图方法23v 【例【例11-9】单击窗体在窗体上绘制直线、矩形。】单击窗体在窗体上绘制直线、矩形。Private Sub Form_Click() ScaleWidth = 100 ScaleHeight = 100 DrawWidth = 5 画三角形画三角形 Line (10, 30)-(10, 80), vbRed Line -(30, 80), vbGreen Line -(1

20、0, 30), vbBlue 画矩形画矩形 CurrentX = 40: CurrentY = 30 Line -(60, 80), vbRed, B 画实心矩形画实心矩形 CurrentX = 70: CurrentY = 30 Line -Step(20, 50), vbMagenta, BFEnd Sub11.3 绘图方法绘图方法24v 【例【例11-10】给星形曲线绘制坐标线。】给星形曲线绘制坐标线。Private Sub Form_Click()Scale (-1, 1)-(1, -1)DrawWidth = 3Line (-1, 0)-(1, 0), vbBlueLine (0,

21、1)-(0, -1), vbBlueDrawWidth = 1For i = -1 To 1 Step 0.1 Line (i, 0.05)-(i, 0) 画垂直刻度画垂直刻度Next iDrawWidth = 2ForeColor = vbRedFor t = 0 To 2 * 3.1415926 Step 0.001 x = Sin(2 * t) * Cos(t) y = Sin(2 * t) * Sin(t) PSet (x, y)Next t:End Sub11.3 绘图方法绘图方法25v【例【例11-1111-11】在窗体上以随机的颜色从外向里画矩形，每】在窗体上以随机的颜色从外向里

22、画矩形，每隔一秒画一个。隔一秒画一个。 Dim X1, Y1, X2, Y2, DX, DY Private Sub Form_Load() X1 = 0 Y1 = 0 X2 = ScaleWidth Y2 = ScaleHeight DX = ScaleWidth / 20 DY = ScaleHeight / 20 DrawWidth = 8 Randomize End Sub11.3 绘图方法绘图方法26Private Sub Timer1_Timer() If X1 X2 And Y1 Y2 Then Line (X1, Y1)-(X2, Y2), QBColor(Int(Rnd *

23、15), B X1 = X1 + DX Y1 = Y1 + DY X2 = X2 - DX Y2 = Y2 - DY Else Timer1.Enabled = False MsgBox 绘制完毕绘制完毕 End If End Sub11.3 绘图方法绘图方法27v 11.3.3 画圆方法画圆方法(Circle)v 格式格式: .Circle Step(x, y), , , v , , v 功能功能: 在对象上画圆、椭圆或弧。在对象上画圆、椭圆或弧。v 窗体、图片框。缺省为当前窗体。窗体、图片框。缺省为当前窗体。v Step指定圆、椭圆或弧的中心相对坐标。指定圆、椭圆或弧的中心相对坐标。 v

24、(x, y)圆、椭圆或弧的中心坐标。圆、椭圆或弧的中心坐标。v 圆、椭圆或弧的半径。为最长轴的尺寸。圆、椭圆或弧的半径。为最长轴的尺寸。v 圆的轮廓颜色。省略则使用圆的轮廓颜色。省略则使用 ForeColor 值。值。 v , 以弧度为单位，范围以弧度为单位，范围 -2 , 2 。 指定弧或扇形的起点和终点位置。指定弧或扇形的起点和终点位置。 起点的缺省值是起点的缺省值是0; 终点的缺省值是终点的缺省值是2 。 若为负数，在画弧的同时画圆心到弧端点的连线。若为负数，在画弧的同时画圆心到弧端点的连线。 v 圆的纵横尺寸比。缺省值为圆的纵横尺寸比。缺省值为 1.0(标准圆标准圆)11.3 绘图方法

25、绘图方法28v 注意注意: Circle 方法总是沿逆时针方向绘图。方法总是沿逆时针方向绘图。v 【例【例11-12】 在窗体上绘制以下图形在窗体上绘制以下图形: Const pi = 3.14159265 ScaleWidth = 100 ScaleHeight = 100 Circle (30, 30), 10 Circle (70, 30), 10, vbGreen, , , 0.5 Circle (70, 30), 10, vbRed, , , 2 Circle (30, 75), 10, , -0.75 * pi, -0.25 * pi Circle (70, 75), 10, ,

26、-0.25 * pi, -0.75 * pi Circle (70, 75), 10, , 1.25 * pi, 1.75 * pi11.3 绘图方法绘图方法29【例【例11-13】在窗体上绘制以下图形】在窗体上绘制以下图形: x轴轴y轴轴45045011.3 绘图方法绘图方法30Private Sub Form_Click() FillStyle = 0 定义填充风格定义填充风格Solid Scale (0, 100)-(100, 0) cx = 50 圆心圆心X坐标坐标 cy = 0 圆心圆心Y坐标坐标 r = 60 半径半径 For i = 45 To 130 Step 5 If i M

27、od 10 0 Then FillColor = vbRed Else FillColor = vbYellow End If Circle (cx, cy), r, , -i * 3.1416 / 180, -(i + 5) * 3.1416 / 180 Next iEnd Sub11.3 绘图方法绘图方法3111.4 与绘图有关的常用属性、事件和方法与绘图有关的常用属性、事件和方法v11.4.1 清除图形方法清除图形方法(Cls)v .Clsv功能功能: 清除运行时清除运行时 Form 或或 PictureBox 所生成的图所生成的图形和文本形和文本v 窗体、图片框。窗体、图片框。 v注意

28、注意: (1) Cls 的功能受的功能受AutoRedraw 的影响。的影响。(2) 调用调用 Cls 之后，对象的之后，对象的 CurrentX 和和 CurrentY 属属性复位为性复位为 0。32v11.4.2 线宽线宽(DrawWidth)属性和线型属性和线型(DrawStyle)属性属性v1. DrawWidth属性属性v 设置图形方法输出的线宽。设置图形方法输出的线宽。v 线宽的取值范围从线宽的取值范围从1到到32767。v 该值以像素为单位表示线宽。缺省值为该值以像素为单位表示线宽。缺省值为1，即一，即一个像素宽。个像素宽。v 如果如果DrawWidth属性值大于属性值大于1，画

29、出的图形是，画出的图形是实线；如果实线；如果DrawWidth属性值等于属性值等于1，可以通过，可以通过DrawStyle属性画出各种线型。属性画出各种线型。v2. DrawStyle属性属性v 设置图形方法输出的线型设置图形方法输出的线型。11.4 与绘图有关的常用属性、事件和方法与绘图有关的常用属性、事件和方法33DrawStyle = 0DrawStyle = 1DrawStyle = 2DrawStyle = 3DrawStyle = 4DrawStyle = 5DrawStyle = 6透明透明11.4 与绘图有关的常用属性、事件和方法与绘图有关的常用属性、事件和方法34v 11.4

30、.3 填充颜色填充颜色(FillColor)属性和填充样式属性和填充样式(FillStyle)属性属性v 1. FillColor属性属性v 改变填充图形的颜色。改变填充图形的颜色。v 2. FillStyle属性属性v 设置封闭图形的填充样式。设置封闭图形的填充样式。11.4 与绘图有关的常用属性、事件和方法与绘图有关的常用属性、事件和方法35v11.4.4 自动重画自动重画(AutoRedraw)属性属性v 使用如使用如Print 、PSet 、Line 和和Circle 方法，在改方法，在改变对象大小或隐藏在另一个对象后又重新显示的情况下，设变对象大小或隐藏在另一个对象后又重新显示的情况

31、下，设置置 AutoRedraw 为为 True，将在将在 Form 或或 PictureBox 控件中自动重绘输出。控件中自动重绘输出。 v 运行时运行时 在程序中设置在程序中设置 AutoRedraw，可以在画持久可以在画持久图形图形(如背景色或网格如背景色或网格)和临时图形之间切换。如果设置和临时图形之间切换。如果设置 AutoRedraw 为为 True，以前的输出成为背景屏幕的一部以前的输出成为背景屏幕的一部分。将分。将AutoRedraw 设置为设置为 False后，用后，用 Cls 方法清除方法清除绘图区时不会删除背景图形。把绘图区时不会删除背景图形。把 AutoRedraw 改

32、回改回 True 后，再用后，再用 Cls 将清除背景图形。将清除背景图形。11.4 与绘图有关的常用属性、事件和方法与绘图有关的常用属性、事件和方法36v【例【例11-14】v 单击单击Command1在图片框中绘制一系列背景线在图片框中绘制一系列背景线,v 单击单击Command2在图片框中随机绘制一系列圆在图片框中随机绘制一系列圆,v 单击单击Command3清除图片框中绘制的圆清除图片框中绘制的圆,v 单击单击Command4清除图片框中的所有图形。清除图片框中的所有图形。11.4 与绘图有关的常用属性、事件和方法与绘图有关的常用属性、事件和方法37Private Sub Comman

33、d1_Click() P1.AutoRedraw = True dx = P1.ScaleWidth / 20 P1.ForeColor = vbYellow For i = 1 To 19 P1.Line (i * dx, 0)-(i * dx, P1. ScaleHeight) Next iEnd SubPrivate Sub Command2_Click() P1.AutoRedraw = False P1.ForeColor = vbRed Randomize11.4 与绘图有关的常用属性、事件和方法与绘图有关的常用属性、事件和方法38 For i = 1 To 20 cx = Int

34、(Rnd * P1. ScaleWidth) cy = Int(Rnd * P1. ScaleHeight) P1.Circle (cx, cy), 200 Next IEnd SubPrivate Sub Command3_Click() P1.AutoRedraw = False P1.ClsEnd SubPrivate Sub Command4_Click() P1.AutoRedraw = True P1.ClsEnd Sub11.4 与绘图有关的常用属性、事件和方法与绘图有关的常用属性、事件和方法39v11.4.5 Paint事件事件v 在应用程序运行时，当一个对象被移动或改变大小在

35、应用程序运行时，当一个对象被移动或改变大小之后；或当一个覆盖该对象的窗体被移开之后，如果要保持之后；或当一个覆盖该对象的窗体被移开之后，如果要保持该对象上所画图形的完整性该对象上所画图形的完整性(重现原来的图形重现原来的图形)，可以选择触，可以选择触发发Paint事件来完成图形的重画工作。事件来完成图形的重画工作。v 如果如果 AutoRedraw 属性被设置为属性被设置为 True，重新绘图重新绘图将会自动进行，此时将会自动进行，此时Paint 事件无效。事件无效。v 使用使用 Refresh 方法时，方法时，Paint 事件即被自动调用。事件即被自动调用。v 在在Resize事件过程中调用

36、事件过程中调用Refresh方法，强制使用方法，强制使用Paint 事件重画图形。事件重画图形。11.4 与绘图有关的常用属性、事件和方法与绘图有关的常用属性、事件和方法40Private Sub Form_Paint() Dim HalfX, HalfY 设置到宽度的一半。设置到宽度的一半。 HalfX = ScaleLeft + ScaleWidth / 2 设置到高度的一半。设置到高度的一半。 HalfY = ScaleTop + ScaleHeight / 2v【例【例11-15】在窗体中画一个米字形。当窗体的大小改】在窗体中画一个米字形。当窗体的大小改变时，米字形也随着自动调整。变时

37、，米字形也随着自动调整。11.4 与绘图有关的常用属性、事件和方法与绘图有关的常用属性、事件和方法41 画一个米字形。先画对角线画一个米字形。先画对角线 Line (ScaleLeft, ScaleTop)-(ScaleWidth, ScaleHeight) Line (ScaleLeft, ScaleHeight)- (ScaleWidth, ScaleLeft) 再画十字再画十字 Line (HalfX, ScaleTop)-(HalfX, ScaleHeight) Line (ScaleLeft, HalfY)-(ScaleWidth, HalfY)End SubPrivate Sub

38、Form_Resize() RefreshEnd Sub11.4 与绘图有关的常用属性、事件和方法与绘图有关的常用属性、事件和方法42本本 章章 小小 结结: : 1. 坐标系统坐标系统 改变坐标系统的方法改变坐标系统的方法: ScaleLeft和和ScaleTop属性属性 ScaleWidth和和ScaleHeight属性属性 Scale方法方法 2. Left、Top、Width、Height属性和属性和ScaleLeft、ScaleTop、ScaleHeight、ScaleWidth属性的区别。属性的区别。3. 颜色颜色 RGB函数函数 QBColor函数函数434. 图形控件图形控件 Shape控件控件 Line控件控件5. 绘图方法绘图方法 画点方法画点方法PSet 画直线、矩形方法画直线、矩形方法Line 画圆方法画圆方法Circle6. 与绘图有关的常用属性、事件和方法与绘图有关的常用属性、事件和方法 清除图形方法清除图形方法(Cls) 线宽线宽(DrawWidth)属性和线型属性和线型(DrawStyle)属性属性 填充颜色填充颜色(FillColor)属性和填充样式属性和填充样式(FillStyle)属性属性 自动重画自动重画(AutoRedraw)属性属性 Paint事件事件本本 章章 小小 结结: :