《Visual Basic程序設計》課件項目九

項目九圖形與圖像設計任務9.1繪制圖形任務9.2常用繪圖方法任務9.3顯示圖片

任務9.1繪制圖形

任務導入

使用繪圖控件可以直接在窗體上繪制簡單的圖形，不需

要編寫代碼，使用非常簡單。本任務學習使用Shape(形狀)控件和Line(直線)控件繪制圖形的方法以及與圖形和顏色有關(guān)的屬性。學習目標

(1)會使用常用的繪圖控件繪制圖形。

(2)了解與圖形有關(guān)的屬性。

(3)了解顏色屬性和顏色函數(shù)的使用方法。任務實施

1．了解Shape控件

Shape控件預定義了6種形狀的圖形，可通過設置Shape屬性來顯示所需的圖形，見表9-1。

圖9.1所示為當Shape屬性分別為0、1～5時，用Shape控件畫圖的效果?？梢哉{(diào)整這些形狀的大小，也可以設置其顏色、邊框樣式、邊框?qū)挾鹊取１?-2列出了Shape控件的常用屬性。圖9.1用Shape控件畫出的圖形

BorderStyle屬性產(chǎn)生的效果取決于BorderWidth屬性的設置。如果BorderWidth不是1，并且BorderStyle不是0或6，則將BorderStyle設置為1。圖9.2所示為設計時用Shape控件畫的圖形。也可以在程序運行時修改屬性以動態(tài)地顯示圖形。圖9.2設計時通過設置屬性顯示不同圖形

【課堂演練】

【實例9-1】編寫程序顯示Shape控件的6種形狀，并設置不同的填充樣式。

【實現(xiàn)步驟】

(1)在窗體上建立Shape控件數(shù)組Shape1(0)～Shape1(5)。

(2)編寫事件代碼。

PrivateSubForm_Activate()

DimiAsInteger

Print

Print“012345”

Shape1(0).Shape=0

Shape1(0).FillStyle=2

Fori=1To5

Shape1(i).Left=Shape1(i–1).Left+1000‘確定控件位置

Shape1(i).Shape=i’通過Shape屬性改變控件形狀

Shape1(i).FillStyle=i+2‘通過FillStyle屬性改變填充樣式

Shape1(i).Visible=True

Nexti

EndSub

(3)運行程序，結(jié)果如圖9.3所示。圖9.3在程序運行中改變Shape控件的屬性

2．了解Line控件

Line控件與Shape控件相似，但僅用于畫線。Line控件用于在窗體、圖片框或框架中畫各種直線段，既可以在設計時通過設置線的端點坐標屬性來畫出直線，也可以在程序運行時動態(tài)地改變直線的各種屬性。在設計時，可以使用Line控件在窗體上可視化地安排直線的位置、長度、顏色、寬度、實虛線等屬性。運行時不能使用Move方法移動Line控件，但是可以通過改變X1、X2、Y1和Y2屬性來移動它或者調(diào)整它的大小。

BorderStyle屬性的效果取決于BorderWidth屬性的設置。如果BorderWidth的值不是1，并且BorderStyle的值不是0或6，則將BorderStyle的值自動設置為1。可以在運行時修改其屬性，語句如下：

Line.BorderWidth=3‘將直線寬度設置為3個像素(Pixel)

用Line控件畫直線時，系統(tǒng)將每一根直線(即一個Line控件)都看成是一個對象，如圖9.4所示。圖9.4設計時用Line控件所畫的直線

3.了解與圖形有關(guān)的屬性

在VB中，窗體、圖片框或Printer對象都有一些與圖形有關(guān)的屬性，使用這些屬性能夠設置顏色、線型和填充樣式，可以繪制出豐富多彩的圖形。表9-3中列出了這些圖形屬性。

4．了解DrawMode屬性

DrawMode屬性用來決定由圖形方法或Shape控件及Line控件所繪制線條的真實顏色。在一個黑色或純白色的背景上，或者在未定義顏色的背景上繪圖時，DrawMode屬性將不起作用。用DrawMode屬性繪圖時，系統(tǒng)將當前的ForeColor、BackColor和DrawMode屬性所確定的方式組合起來，其結(jié)果為最后繪圖的顏色。DrawMode屬性的語法為

[〈對象〉.]DrawMode[=〈值〉]

其中，〈值〉的范圍為1～16，按其復雜程度可分為表9-4所示的四類。在這四種變化中，DrawMode屬性不考慮前景色(ForeColor)，只設置像素的當前顏色，具體功能見表9-5。在這兩種變化中，像素顏色只與ForeColor屬性有關(guān)，而與BackColor屬性及當前顏色無關(guān)，具體功能見表9-6。

DrawMode屬性的這種功能與ForeColor和當前顏色有關(guān)。在繪圖和動畫中，DrawMode=7是一個很有用的設置值，它利用Xor方式，在同一地點繪圖兩次，從而消除第一次繪畫的痕跡，精確地還原出繪圖之前的顯示內(nèi)容，從而實現(xiàn)動畫效果。

任何顏色與其自身進行Xor操作將產(chǎn)生黑色，進行NotXor操作將產(chǎn)生白色，見表9-7。由上表可以看出，這些組合的結(jié)果是難以預測的。

使用Mask類操作可以為CopyPen建立圖像的陰影，見表

9-8。

在DrawMode的16種設置中，只有值1、6、7、11、13、16的結(jié)果是能預測的。

5．了解DrawWidth屬性和DrawStyle屬性

1)?DrawWidth屬性

DrawWidth屬性的語法格式為

[〈對象〉.]DrawWidth[=〈值〉]

窗體、圖片框的DrawWidth屬性可以用來設置繪圖線的寬度?！粗怠狄韵袼貫閱挝?，設置后影響Pset、Line和Circle方法。〈值〉的范圍是1～32767，默認值為1，也就是說，畫出的線為1個像素寬。

2)?DrawStyle屬性

DrawStyle屬性的語法格式為

[〈對象〉.]DrawStyle[=〈值〉]

DrawStyle屬性用于指定用圖形方式創(chuàng)建的線是實線還是虛線。〈值〉的取值范圍為0～6，用來產(chǎn)生不同間隔的實、虛線，默認值為0(實線)。

不同設置值的效果如圖9.5所示。

6．了解FillColor屬性和FillStyle屬性

利用FillColor和FillStyle屬性，可以為已繪制好的封閉圖形(如正方形、矩形、圓形等)和Shape控件設置填充圖案。當需填充圖案時，填充的顏色由FillColor屬性確定，填充的圖案樣式由FillStyle屬性確定。

1)?FillColor屬性

FillColor的語法格式為

[〈對象〉.]FillColor[=〈值〉]圖9.6FillStyle屬性不同設置值的效果

其中，〈值〉為可選的長整型數(shù)，為該點指定的RGB顏色。如果省略，則默認值為0。可用RGB函數(shù)或QBColor函數(shù)指定顏色。

2)?FillStyle屬性

FillStyle的語法格式為

[〈對象〉.]FillStyle[=〈值〉]

其中，〈值〉的取值范圍為0～7共八種選擇：純色、橫條紋、豎條紋、正網(wǎng)格、斜網(wǎng)格等。不同設置值的效果如圖9.6所示。圖9.6FillStyle屬性不同設置值的效果

7．了解顏色屬性

窗體和圖片框都有兩個關(guān)于顏色的屬性BackColor和ForeColor。BackColor屬性用于定義繪畫區(qū)的背景顏色，若BackColor設置為灰色，則清除后整個區(qū)域為灰色。ForeColor屬性決定對象上繪制的文本或圖形的顏色，改變ForeColor屬性不影響已創(chuàng)建的文本或圖形。在設計時指定顏色屬性的操作比較簡單，只要在屬性窗口中單擊相應的屬性就可以直接利用調(diào)色板進行顏色的選擇了。而在程序運行中要設置顏色就沒有這么直觀了，程序員可以使用VB預先定義好的顏色常量指定顏色，也可以使用RGB函數(shù)生成一個顏色。

VB預先定義好的顏色常量可以用對象瀏覽器列出，當使用這些內(nèi)部常數(shù)時，無需了解這些常數(shù)是如何產(chǎn)生的，也無需聲明。例如，無論什么時候想指定紅色作為顏色參數(shù)或顏色屬性的設置值，都可以使用常數(shù)vbRed：

BackColor=vbRed

而顏色函數(shù)則提供了更大的選擇余地。

8．了解顏色函數(shù)

1)?RGB函數(shù)

在這兩個顏色函數(shù)中，RGB是最常用的一個，其語法格式為

RGB(red，green，blue)

其中，red、green、blue分別表示顏色的紅色成分、綠色成分、藍色成分，取值的范圍都是0～255。RGB函數(shù)采用紅、綠、藍三原色原理，返回一個長整型數(shù)，用來表示一個RGB顏色值。表9-9中列出了一些常見的標準顏色，以及這些顏色的紅、綠、藍三原色的成分值。

2)?QBColor函數(shù)

QBColor函數(shù)沿用于早期的BASIC版本QBasic，它返回一個用來表示所對應顏色值的RGB顏色碼，其語法格式為

QBColor(color)

其中，color參數(shù)是一個介于0～15的整型值，如表9-10所示。任務9.2常用繪圖方法

任務導入

前面介紹的繪圖控件雖然使用簡單，但它提供的繪圖樣式選擇有限，只能實現(xiàn)簡單功能。因此，如果我們要實現(xiàn)更高級的繪圖功能，就需要使用VB提供的繪圖方法。本任務學習使用VB繪圖方法來繪制圖形。學習目標

(1)會使用PSet方法、Line方法、Circle方法繪制點、線、圓等。

(2)會使用Cls方法清除圖形。任務實施

1．掌握畫點方法(PSet)的用法

PSet方法可以在對象的指定位置(x,y)，按確定的像素顏色畫點，其語法格式為

[〈對象〉.]PSet[Step](x,y),[〈顏色〉]

【說明】

(1)〈對象〉為可選的對象表達式，如果省略〈對象〉，則將具有焦點的窗體作為〈對象〉。

(2)?Step為可選的關(guān)鍵字，指定相對于由CurrentX和CurrentY屬性提供的當前圖形位置的坐標。

(3)?(x,y)為必需的一對單精度浮點數(shù)，用來設置點的水平和垂直坐標。

(4)〈顏色〉為可選的長整型數(shù)，為該點指定顏色。如果省略，則使用當前的ForeColor屬性值。可用RGB函數(shù)或QBColor函數(shù)指定顏色。

【課堂演練】

【實例9-2】如圖9.7所示，利用Pset方法在窗體上畫出“滿天星”。

【實現(xiàn)步驟】

(1)問題分析。將窗體的背景色改為白色，直接在窗體上產(chǎn)生“滿天星”，以便清晰顯示。圖9.7滿天星

(2)編寫的事件代碼如下：

PrivateSubForm_load()

Show

DrawWidth=3‘控制畫出點的大小

Randomize

Fori=1To1000

x=Form1.ScaleWidth*Rnd'隨機定位

y=Form1.ScaleHeight*Rnd‘隨機定位

r=Int(255*Rnd)’顏色值為隨機數(shù)

g=Int(255*Rnd)

b=Int(255*Rnd)

Form1.PSet(x,y),RGB(r,g,b)‘畫點

Forn=1To50000:Nextn’用空循環(huán)實現(xiàn)延時效果

Nexti

EndSub

(3)運行程序，在窗體上隨機產(chǎn)生各種顏色的點，結(jié)果如圖9.8所示。

【實例9-3】用PSet方法繪制Cos(x)數(shù)學函數(shù)曲線。

【實現(xiàn)步驟】

(1)提示。在VB中運用Cos(x)數(shù)學函數(shù)時，應將角度轉(zhuǎn)換成弧度。

(2)輸入下面的窗體事件代碼：

PrivateSubForm_Paint()

DimxAsInteger

Fori=0To10000‘用Pset畫直線

PSet(i,1200),vbRed

Nexti

Forx=0To10000’畫曲線

PSet(x,1000*Cos(x*3.1415926/1800)+1200),vbBlue

Nextx

EndSub

(3)運行程序，結(jié)果如圖9.8所示。圖9.8用PSet方法繪制的數(shù)學曲線

2．掌握畫直線、矩形方法(Line)的用法

Line方法可以在對象上的兩點之間畫直線或矩形，其語法格式為

〈對象〉.Line[Step][(x1,y1)]-[Step](x2,y2)[,〈顏色〉][,B[F]]

【說明】

(1)?x1、y1為可選項，是直線或矩形的起點坐標。如果省略，則起點位于由CurrentX和CurrentY屬性指定的位置。ScaleMode屬性決定了使用的度量單位。

(2)?x2、y2為必需的，是直線或矩形的終點坐標。

(3)〈顏色〉為可選的長整型數(shù)，用來設置直線或矩形的顏色。如果省略，則使用ForeColor屬性值?？捎肦GB函數(shù)或QBColor函數(shù)指定顏色。

(4)?B為可選的，如果選擇B，則以(x1,y1)為左上角坐標，(x2,y2)為右下角坐標畫出矩形。F選項用來規(guī)定矩形以矩形邊框的顏色填充。不能不用B而用F。如果不用F僅用B，則矩形用當前的FillColor和FillStyle填充。FillStyle的默認值為Transparent。

(5)畫連接的線時，前一條線的終點就是后一條線的起點。線的寬度取決于DrawWidth屬性值。在背景上畫線和矩形的方法取決于DrawMode和DrawStyle屬性值。

(6)執(zhí)行Line方法后，CurrentX和CurrentY屬性被參數(shù)設置為終點。

【課堂演練】

【實例9-4】下面用Line方法的不同參數(shù)畫出圖形，如圖9.9所示。圖9.9用Line方法的不同參數(shù)畫出的圖形

【實現(xiàn)步驟】

窗體事件代碼如下：

PrivateSubForm_Paint()

Cls

Scale(0,0)-(13,11) ‘設置用戶坐標系統(tǒng)

Line(1,1)-(4,4),4’畫直線

Line(5,1)-(8,4),4,B ‘畫矩形框

Line(9,1)-(12,4),4,BF’畫矩形塊

Fori=1To3 ‘畫三個嵌套的方形框

Line(i,4+i)-(7-i,11-i),,B

Nexti

EndSub

【說明】

在使用PSset和Line方法時，在每個坐標點(x,y)之前可加上Step關(guān)鍵字，用來指出將要畫出的點和當前坐標點的相對位置，如上例中的第4、5、6行語句可以用以下語句代替：

Line(1,1)-Step(3,3),4 ‘畫直線

Line(5,1)-Step(3,3),4,B ’畫矩形框

Line(9,1)-Step(3,3),4,BF '畫矩形塊

3．掌握畫圓方法(Circle)的用法

Circle方法可以在對象上畫圓、橢圓或弧。其語法格式為

[〈對象〉.]Circle[Step](x,y),〈半徑〉,[color,start,end,aspect]

【說明】

(1)?(x,y)指定圓、橢圓或弧的中心坐標。

(2)〈半徑〉指定圓、橢圓或弧的半徑。

(3)?color可選，如果被省略，則使用ForeColor屬性值。

(4)?start和end指定弧或扇形的起點和終點位置(以弧度為單位)，其范圍為?－2

～2

。起點的默認值是0，終點的默認值是2

。正數(shù)畫弧，負數(shù)畫扇形。

(5)?aspect為垂直半徑與水平半徑之比，不能為負數(shù)。當aspect>1時，橢圓沿垂直方向拉長；當aspect<1時，橢圓沿水平方向拉長。aspect的默認值為1.0，此時在屏幕上產(chǎn)生一個標準正圓(非橢圓)。

(6)可以省略語法中間的某個參數(shù)，但不能省略分隔參數(shù)的逗號。指定的最后一個參數(shù)后面的逗號是可以省略的。

【課堂演練】

【實例9-5】在圖片框中畫出如圖9.10所示的圓弧、扇形。圖9.10利用Circle方法繪圖

【實現(xiàn)步驟】

(1)在窗體添加一個圖片框控件Picture1和一個命令按鈕Command1。

(2)編寫“輸出圖形”命令按鈕的單擊事件代碼如下：

PrivateSubCommand1_Click()

pi=4*Atn(1)

Picture1.Scale(0,0)-(100,100)

Picture1.Circle(50,50),10,QBColor(1),0,pi/2

Picture1.Circle(50,50),20,QBColor(2),pi/3,1.5*pi

Picture1.Circle(50,50),30,QBColor(3),-pi/2,-pi/6

Picture1.Circle(50,50),40,QBColor(4),-pi/4,-pi/3

EndSub

4．掌握清除圖形方法(Cls)的用法

Cls方法可以清除Form或PictureBox控件中由圖形和打印語句在運行時所生成的圖形和文本，清除后的區(qū)域以背景色填充。設計時使用Picture屬性設置的背景位圖和放置的控件不受Cls方法影響。其語法格式為

[〈對象〉.]Cls

調(diào)用Cls方法之后，〈對象〉的CurrentX和CurrentY屬性復位為0。

5.了解繪圖語句與Paint事件

如果在程序代碼中有圖形方法的繪圖語句，則使用Paint事件將很有用。在設計多媒體應用程序時，最有效的方法是將所有的繪圖方法(Pset、Line、PaintPicture等)都放在Paint事件中，否則可能會發(fā)生一些不希望發(fā)生的事情，如圖形控件(Label、Line、Shape等)可能會重疊、丟失或以錯誤的順序

排列。窗體和PictureBox圖片框控件都有Paint事件，通過使用Paint事件過程，可以保證必要的圖形都得以重現(xiàn)。例如，窗體最小化后，恢復到正常大小時，窗體內(nèi)所有圖形都得

重畫。

當AutoRedraw屬性為True時，將自動重畫，Paint事件不起作用。

在Resize事件過程中使用Refresh方法時，可在每次調(diào)整窗體大小時強制對所有對象通過Paint事件進行重畫。

【課堂演練】

【實例9-6】本例是一個Paint事件在Resize事件中所起作用的示例。運行時將畫出一個與一個窗體各邊的中點相交的菱形，當隨意調(diào)整窗體的大小時，窗體中的菱型也隨著自動調(diào)整，圖9.11(a)為調(diào)整窗體前的顯示效果，圖9.11(b)為調(diào)整窗體后的顯示效果。

【實現(xiàn)步驟】

窗體事件代碼如下：

PrivateSubForm_Paint()

DimHalfX,HalfY‘聲明變量

HalfX=ScaleLeft+ScaleWidth/2’設置到寬度的一半

HalfY=ScaleTop+ScaleHeight/2‘設置到高度的一半

'畫一個菱形

Line(ScaleLeft,HalfY)-(HalfX,ScaleTop)

Line-(ScaleWidth+ScaleLeft,HalfY)

Line-(HalfX,ScaleHeight+ScaleTop)

Line-(ScaleLeft,HalfY)

EndSub

PrivateSubForm_Resize()

Refresh

EndSub圖9.11Paint事件示例任務9.3顯示圖片

任務導入

在VB應用程序中，圖片可以顯示的三個位置是：窗體(Form)上、圖像(Image)控件內(nèi)和圖片框(Picture)控件內(nèi)。圖片可以是任何格式的圖形圖像文件：位圖文件(.bmp,.dib,.cur)、圖標文件(.ico)、圖元文件(.wmf)、增強型圖元文件(.emf)、JPEG或GIF文件等。圖片可來自Windows的各種繪圖程序，如隨同各種版本W(wǎng)indows一同提供的繪圖程序、其他圖形應用程序或剪貼畫庫。可以在設計或運行時，采用不同途徑把圖片添加到窗體、圖片框或圖像控件中。學習目標

(1)會在窗體上加載圖片。

(2)會在圖像(Image)控件內(nèi)顯示圖形。

(3)會在圖片框(Picture)控件內(nèi)顯示圖形。任務實施

1.直接加載圖片到窗體

使用窗體的Picture屬性，可以很方便地把圖片加載到窗

體上。

在運行時要顯示或替換圖片，可利用LoadPicture函數(shù)設

置Picture屬性。Picture屬性包括被顯示圖片的文件名和可選路徑名。

LoadPicture函數(shù)的語法格式為

LoadPicture([〈文件名〉])

其中，〈文件名〉是一個字符串表達式，包括路徑和文件的名稱。如果省略〈文件名〉，則LoadPicture函數(shù)將清除圖像。

【課堂演練】

【實例9-7】在窗體上加載圖片。

【實現(xiàn)步驟】

(1)選中窗體。

(2)單擊屬性窗口中的Picture屬性，這時該屬性出現(xiàn)“…”，單擊之則打開“加載圖片”對話框。

(3)從“搜尋”中查找需加載圖片的位置，在列表中選中文件名，單擊“打開”按鈕。如C:\ProgramFiles\MicrosoftVisualStudio\Common\Graphics\Metafile\Business\coins.wmf，加載后的效果如圖9.12所示。圖9.12直接在窗體上加載圖片

2.使用圖像控件

圖像控件具有Stretch屬性，其取值有以下兩個：