《图形控件与图形方法.ppt》由会员分享，可在线阅读，更多相关《图形控件与图形方法.ppt（47页珍藏版）》请在taowenge.com淘文阁网|工程机械CAD图纸|机械工程制图|CAD装配图下载|SolidWorks_CaTia_CAD_UG_PROE_设计图分享下载上搜索。
1、第第1010章章图形控件与图形方法图形控件与图形方法主讲教师主讲教师:夏其表夏其表第第10章章图形操作与图形操作与图形控件图形控件10.1坐标系统坐标系统10.2图形控件图形控件10.3绘制图形的方法绘制图形的方法10.4综合举例综合举例本章本章重点和难点重点和难点 重点：重点：绘制图形的方法、图形控件绘制图形的方法、图形控件难点：难点：坐标系统坐标系统10.1 10.1 坐标系统坐标系统在在VisualBasic中，通常以中，通常以leftleft、toptop和和WidthWidth、HeightHeight四四个参数来衡量控件在容器中的位置和大小。个参数来衡量控件在容器中的位置和大小。坐
2、标系统的三要素坐标系统的三要素原点原点刻度刻度方向和大小方向和大小默认情况下，窗体的坐标原点在左上角顶点处，窗体的坐标方向为向右默认情况下，窗体的坐标原点在左上角顶点处，窗体的坐标方向为向右和向下，坐标刻度为缇和向下，坐标刻度为缇(twiptwip)。(一）默认坐标系统一）默认坐标系统widthheight(left，top）在在VisualBasic中中，每每个个容容器器都都有有一一个个自自身身的的坐坐标标系系统统，坐坐标标系系中中的的X轴轴向向右右、Y轴轴向向下下延延伸伸，如如上上图图所所示示为为缺缺省的窗体坐标系统、图片控件的坐标系统。省的窗体坐标系统、图片控件的坐标系统。(二）容器自定
3、义坐标系统二）容器自定义坐标系统(1)ScaleLeft属性(2)ScaleTop属性(3)ScaleWidth属性(4)ScaleHeight属性(5)CurrentX、CurrentY属性 容器（窗体、图片框）的坐标属性容器（窗体、图片框）的坐标属性Form1.ScaleLeft=-100Form1.ScaleTop=150Form1.ScaleWidth=200Form1.ScaleHeight=-300用用Scaleleft、Scaletop、Scalewidth、Scaleheight属性设置自定义坐标系统属性设置自定义坐标系统(x1,y1)(x2,y2)格式：格式：对象对象.Sca
4、le(x1,y1)-(x2,y2)对象的左上角坐标值对象的左上角坐标值对象的右下角坐标值对象的右下角坐标值（三）改变容器坐标系（三）改变容器坐标系的的ScaleScale方法方法 利用Scale方法可以改变原点的坐标并随之改变最大坐标值，容器的左上角坐标为(x1，y1)，右下角坐标为(x2，y2)将容器在X轴方向分为x2-x1等份、Y轴方向分为y2-y1等份综综合合例例题题：单单击击“坐坐标标系系”按按纽纽(commnand1)，把把图图片片框框的的坐坐标标系系统统设设置置在在中中央央，并并画画出出该该坐坐标标系系统统的的示示意意图图。界面设计如下：界面设计如下：(0,0)代码设计代码设计Pr
5、ivateSubCommand1_Click()Picture1.Scale(-Picture1.ScaleWidth/2,-Picture1.ScaleHeight/2)_(Picture1.ScaleWidth/2,Picture1.ScaleHeight/2)Picture1.Line(-Picture1.ScaleWidth/2,0)-(Picture1.ScaleWidth/2,0)Picture1.Line(0,-Picture1.ScaleHeight/2)-(0,Picture1.ScaleHeight/2)EndSub思考：有否有更简单的方法进行设置？思考：有否有更简单的方法
6、进行设置？PrivateSubCommand1_Click()Picture1.Scale(-10,10)-(10,-10)Picture1.Line(-10,0)-(10,0)Picture1.Line(0,10)-(0,-10)EndSub给给图片框自定义大小和方向图片框自定义大小和方向(-10,10)(10,-10)(0,0)（四）（四）坐标刻度坐标刻度默认刻度默认刻度:缇 通过设置容器的ScaleMode属性可以选择改变坐标系统的单位。设置容器的设置容器的ScaleModeScaleMode属性属性 ScaleMode属性为 1:缇 ScaleMode属性值为2:磅 ScaleMode
7、属性值为3:像素 ScaleMode属性值为4:字符ScaleMode属性值为5:英寸 ScaleMode属性值为6:毫米 ScaleMode属性值为7:厘米 1 1缇缇0.017640.01764毫米毫米0.050.05磅磅 14401440缇缇=1=1英寸英寸 7272磅磅=1=1英寸英寸 自定义刻度自定义刻度将ScaleMode值设置为0，则采用自定义刻度。用Scale方法设置坐标系后，ScaleMode值自动变为0。反之，ScaleLeft、ScaleTop、ScaleHeight、ScaleWidth属性被改变，ScaleMode值自动变为0，单位长度根据变化后的上述属性重新确定。1
8、0.2 10.2 图形控件图形控件图片框控件（图片框控件（Picture1）影像框控件（影像框控件（Image1）直线控件（直线控件（Line1）形状控件（形状控件（Shape1）图片框控件（图片框控件（picture1 picture1）n工具箱中图片框控件的图标为工具箱中图片框控件的图标为。n图图片片框框控控件件名名称称的的缺缺省省值值为为：Picture1、Picture2、n图图片片框框控控件件用用以以显显示示图图片片，也也可可以以作作为为其其他他对对象象的的容容器器、显示图形方法的输出结果和显示图形方法的输出结果和Print方法输出的文本。方法输出的文本。图片框控件（图片框控件（pi
9、cture1 picture1）（一）图片框的常用属性（一）图片框的常用属性Picture属性（字符串类型）属性（字符串类型）图片框控件的图片框控件的Picture属性返回或设置图片框中的图片。属性返回或设置图片框中的图片。在图片框中加载图像有下列两种方式：在图片框中加载图像有下列两种方式：在属性窗口中设置在属性窗口中设置界界面面设设计计时时，在在该该图图片片框框控控件件属属性性窗窗口口中中点点击击“Picture”属属性性，选选择所择所需要加载的图片。需要加载的图片。在代码窗口中设置在代码窗口中设置格式：图片框控件名格式：图片框控件名.Picture=.Picture=LoadPicture
10、(filenameLoadPicture(filename$)$)图片框控件（图片框控件（picture1 picture1）（一）图片框的常用属性（一）图片框的常用属性2.AutoSize属性（逻辑型）属性（逻辑型）AutoSize属性值为属性值为True时，图片框的边界会随着所装入时，图片框的边界会随着所装入图片的大小变化而变化。图片的大小变化而变化。AutoSize属性值为属性值为False时，时，图片框显示不下的图片将被图片框显示不下的图片将被截去。截去。图片框控件（图片框控件（picture1 picture1）（二）图片框的常用方法（二）图片框的常用方法Print方法：打印输出方法
11、：打印输出Cls方法：擦除方法：擦除图形方法（图形方法（Pset、Point、Line、Circle等）等）图片框控件（图片框控件（picture1 picture1）（三）图片框的常用事件（三）图片框的常用事件图图片片框框的的主主要要事事件件有有：Click、MouseDown、MouseUp、MouseMove等。等。例如：例如：MouseDown事件（事件（效果图效果图）PrivateSubPicture1_MouseDown(ButtonAsInteger,Shift_AsInteger,XAsSingle,YAsSingle)Picture1.ClsPicture1.CurrentX
12、XPicture1.CurrentY=YPicture1.Print“你好！你好！”EndSub影像框控件影像框控件(Image1)(Image1)工具箱中影像框控件的图标为工具箱中影像框控件的图标为。影像框控件名称的缺省值为：影像框控件名称的缺省值为：Image1、Image2、影影像像框框控控件件只只能能用用于于显显示示图图像像，不不支支持持图图形形方方法法，也也不不能当作容器来使用。能当作容器来使用。影像框控件影像框控件(Image1)(Image1)（一）影像框控件的常用属性（一）影像框控件的常用属性Picture属性（字符串类型）属性（字符串类型）与图片框控件的与图片框控件的Pict
13、ure属性一样，可以在设计时设置，也可属性一样，可以在设计时设置，也可 在程序运行时用在程序运行时用LoadPicture函数装入。函数装入。影像框控件名影像框控件名.Picture=.Picture=LoadPicture(filenameLoadPicture(filename$)$)Stretch属性（逻辑类型）属性（逻辑类型）当当Stretch为为True时，根据影像框的大小自动调整图片的大小，时，根据影像框的大小自动调整图片的大小，当当Stretch为为False时，影像框调整大小来适应图片的大小。时，影像框调整大小来适应图片的大小。影像框控件影像框控件(Image1)(Image1
14、)（二）影像框控件的常用事件（二）影像框控件的常用事件 影像框控件与图片框控件可以响应的事件过程大体相同，如Change、Click、MouseDown、MouseUp、MouseMove等常用事件。思考：图片框控件和影像框控件有何区别？思考：图片框控件和影像框控件有何区别？1、图片框是容器，而影像框不是。、图片框是容器，而影像框不是。2、加载速度影像框比较快。、加载速度影像框比较快。3、调整图片大小的属性不同。、调整图片大小的属性不同。图片框：图片框：AutoSize影像框：影像框：Stretch直线控件（直线控件（Line1Line1）工具箱中直线控件的图标为工具箱中直线控件的图标为 。直
15、线控件缺省的控件名称为：直线控件缺省的控件名称为：Line1、Line2、属性：属性：1、起点和终点的位置属性、起点和终点的位置属性x1y1和和x2y22、BoderStyle属性属性形状控件形状控件 （Shape1Shape1）工具箱中形状控件的图标为工具箱中形状控件的图标为。形形状状控控件件缺缺省省的的控控件件名名称称为为：Shape1、Shape2、形状控件形状控件 （Shape1Shape1）（一）形状控件的常用属性：（一）形状控件的常用属性：Shape属性（整数属性（整数05）BoderStyle属性（整数属性（整数06）(3)BorderColor：设置边框颜色。设置边框颜色。(4
16、)BorderWidth：设置边框宽度。设置边框宽度。(5)backcolor(6)backstyle(7)fillcolor(8)FillStyle属性（整数属性（整数07）例如：例如：Shape1.fillstyle=0设置填充色设置填充色Shape1.fillcolor=rgb(255,0,0)形状控件形状控件 （Shape1Shape1）（二）综合举例（二）综合举例（效果图效果图）10.3 10.3 图形方法图形方法颜色设置颜色设置画点方法画点方法Pset颜色取样函数颜色取样函数Point画直线、矩形方法画直线、矩形方法Line画圆、圆弧、扇形、椭圆方法画圆、圆弧、扇形、椭圆方法Cir
17、Cle（一）颜色设置（一）颜色设置（1）RGB函数函数格式：格式：RGB(Red,Green,Blue)RGB(Red,Green,Blue)其中其中Red、Green、Blue取值范围都是取值范围都是0到到255。（2）QBColor函数函数 格式：格式：QBColor(colorQBColor(color)其中其中color参数的取值为参数的取值为0-15范围内的整数。范围内的整数。（3）使用预定义常量使用预定义常量例：例：Form1.ForeColor=vbRedvbRed（4）直接赋值直接赋值例：例：Form1.ForeColor&HFF&设置为红色设置为红色（二）画点方法（二）画点方
18、法PSetPSet格式：格式：容器容器.Psetstep(x,y),color 该该方方法法在在容容器器上上(x,y)处处以以值值为为color的的颜颜色色画画点点；缺缺省省容容器器则指当前窗体，缺省则指当前窗体，缺省color则为容器前景色（则为容器前景色（ForeColor）。）。该方法所画点的大小，取决于容器的该方法所画点的大小，取决于容器的DrawWidth属性值。属性值。DrawWidth用来设置绘图线的宽度。用来设置绘图线的宽度。举例：举例：用用Pset方法在窗体上画五彩碎纸方法在窗体上画五彩碎纸五彩碎纸效果图五彩碎纸效果图（三）颜色取样函数（三）颜色取样函数Point格式：格式：
19、Point(x,y)该函数的返回值为点(x,y)的颜色值。举例：图片复制效果图（四）画线、矩形方法（四）画线、矩形方法LineLine1画线方法画线方法Lineq格式：格式：容器名容器名.Line(x1,y1)-step(x2,y2),ColorColorColor：表示线段的颜色，可以省略，省略时线段的颜色为容器的前景色，即Forecolor颜色。x1,y1x1,y1：表示线段的起点坐标，可省略，省略时表示直线从当前打印坐标开始。x2,y2x2,y2：表示线段的终点坐标。Step参参数数：加上Step参数，表示所绘制直线的两个端点位置为(x1,y1)和(x1+x2,y1+y2)。思考：思考：
20、1、在图片框上绘制直线时，能否省略对象名？、在图片框上绘制直线时，能否省略对象名？2、在画直线时，若省略起始点坐标，则直线将如何画出？、在画直线时，若省略起始点坐标，则直线将如何画出？不能省略图片框的对象名。因为系统默认的对象名为窗体。不能省略图片框的对象名。因为系统默认的对象名为窗体。将从上将从上一条直线的终点处开始画。一条直线的终点处开始画。若画第一条直线时就省略起始点，则直线从左上角顶点处若画第一条直线时就省略起始点，则直线从左上角顶点处开始画。开始画。多点折线情况：多点折线情况：例如：下列语句在窗体上所绘折线如下图所示。（100，200）（150，150）（100，100）（50，10
21、0）（0，150）（50，200）Line(50,100)-(100,100)Line-(150,150)Line-(100,200)Line-(50,200),RGBLine-(0,150),RGBLine-(50,100)画线方法画线方法LineLine（四）画线、矩形方法（四）画线、矩形方法LineLineq2.画画矩形矩形LineLine方法方法格式：格式：容器名容器名.Line(x1,y1)-Step(x2,y2),Color,B,FB B：表示将两个坐标点作为一对对角顶点画出矩形。表示将两个坐标点作为一对对角顶点画出矩形。F F：可选，只有可选，只有B B出现后才能出现出现后才能出
22、现。有有B B没有没有F F：矩形用当前的矩形用当前的fillcolorfillcolor和和fillstylefillstyle填充。填充。有有B B也有也有F F：矩形用边框的颜色填充矩形用边框的颜色填充。注意：各参数可根据实际要求进行取舍，但如果舍去的是中间各参数可根据实际要求进行取舍，但如果舍去的是中间参数，参数的位置参数，参数的位置分隔符不能舍去分隔符不能舍去。q2.画画矩形矩形LineLine方法方法例如：执行下列语句后，判断在窗体上的输出结果。Form1.FillStyle=0Form1.FillColor=vbBlueForm1.ForeColor=vbGreenLine(10
23、0,100)-(1500,1000),vbRed,B 红色外框，兰色填充Line(1600,100)-(2500,1000),B 绿色外框，兰色填充Line(2800,100)-(3800,1000),vbRed,BF 红色实心矩形（五）画圆、圆弧与椭圆方法五）画圆、圆弧与椭圆方法CircleCircleq1.画圆画圆q格式：格式：容器名容器名.CircleStep(x,y),radius,Color 以(x,y)为圆心为圆心、以radius为半径画颜色值为Color的圆。（有Step关键字则以(CurrentX+x,CurrentY+y)q2.画圆弧画圆弧q格格式式：容容器器名名.Circl
24、eStep(x,y),radius,Color,start,end start、end为Single类型表达式，该方法以start弧度为起点按逆时针方向到end弧度为止画一段圆弧。若start为负值，该方法还画出1条从圆心到圆弧相应端点的连线，参数end也同样。（画出扇形）（五）画圆、圆弧与椭圆方法五）画圆、圆弧与椭圆方法CircleCircleq3.画椭圆（椭圆弧）画椭圆（椭圆弧）q格格式式：容容器器名名.CircleStep(x,y),radius,Color,start,end,aspect （1）aspect是取正值的是取正值的single类型表达式，为椭圆纵轴与横轴之比。类型表达式，
25、为椭圆纵轴与横轴之比。（2）r是长轴的半径是长轴的半径。（3）可以省略语法中间的某个参数，但不能省略中间分隔参数的逗号。）可以省略语法中间的某个参数，但不能省略中间分隔参数的逗号。Circle方法的使用方法的使用综合例题综合例题 绿色红边的扇形绿色红边的扇形要求画出如下图形式的扇形（从要求画出如下图形式的扇形（从/5画到5/6）。代码v例10.10 新建一个工程，完成“作图”程序设计。具体要求如下：v（1）窗体的标题为“作图”，固定边框。v（2）窗体的右边是一个图片框Picture1，用于显示图形。v（3）单击“坐标系”按钮（Command1），将图片框的坐标系统设置为原点在中央，X轴-10，
26、10，Y轴-10，10，并在图片框中画出该坐标系统示意图。v（4）单击“扇形”按钮（Command2），在图片框中画一个圆心在原点，半径为5，圆周为红色，线宽为2，内部为绿色，起始角为/6，终止角为5/6的扇形。v（5）单击“结束”按钮（Command3），程序结束运行。10.4综合举例综合举例v新建一个工程，完成“反弹球”程序的设计。具体要求如下：v（1）窗体的标题为“反弹球”，固定边框。v（2）设计两个菜单项，start的标题为“启动”，stop的标题为“停止”。v（3）在窗体中引入一个形状控件Shapel，形状为圆，圆半径为500Twios,填充色为红色。v（4）定时器（timerl）的
27、时间间隔为0.1秒。v（5）第一次单击菜单“启动”，圆球先向右上角方向运动，碰壁后改变方向。每个时间间隔水平方向改变量dx和垂直方向改变量dy都是100Twips。v（6）单击菜单“停止”，圆球停止运动。再单击菜单“启动”，圆球继续运动。10.4综合举例综合举例本章主要介绍本章主要介绍VisualBasic的图形控件和图形方法。的图形控件和图形方法。图形控件包括图片框、影像框、形状控件和直线控件。图形控件包括图片框、影像框、形状控件和直线控件。熟熟悉悉VisualBasic的的坐坐标标系系统统，是是利利用用VisualBasic画画图图和和进进行行图图形形处处理理的的基基础础。每每个个容容器器对对象象都都有有一一套套自自己己的的坐坐标标系统，对象定位都是相对于容器的坐标系的。系统，对象定位都是相对于容器的坐标系的。利利用用图图形形方方法法可可以以画画出出更更多多、更更高高级级的的图图形形。使使用用图图形形方方法法一一定定要要熟熟悉悉方方法法使使用用的的格格式式，以以及及在在画画图图时时经经常常用用到到的一些对象属性的用法，如的一些对象属性的用法，如FillStyle、FillColor等。等。总结总结作业集第10章的程序阅读2、3题程序填空题程序设计题作业作业