圖形圖像編程

第5章圖形圖像編程1本章學(xué)習(xí)目標(biāo)了解.NET框架提供的的圖形類庫(kù)掌握基本圖形繪制方法初步了解VisualBasic.NET語(yǔ)言處理位圖圖像功能GDI+坐標(biāo)系統(tǒng)，顏色、Paint事件等。最后重點(diǎn)介紹五子棋、人物拼圖案例。2目錄5.1圖形圖像繪制基礎(chǔ)知識(shí)5.2繪制基本圖形5.3創(chuàng)建畫刷填充圖形5.4圖像處理5.5文字處理5.6五子棋游戲設(shè)計(jì)5.7人物拼圖游戲設(shè)計(jì)35.1圖形圖像繪制基礎(chǔ)知識(shí)5.1.1GDI+概述

GDI是GraphicsDeviceInterface的縮寫，含義是圖形設(shè)備接口，它的主要任務(wù)是負(fù)責(zé)系統(tǒng)與繪圖程序之間的信息交換，處理所有Windows程序的圖形輸出。GDI+技術(shù)是由GDI技術(shù)“進(jìn)化”而來(lái)，出于兼容性考慮，WindowsXP仍然支持以前版本的GDI，但是在開發(fā)新應(yīng)用程序的時(shí)候，開發(fā)人員為了滿足圖形輸出需要應(yīng)該使用GDI+，因?yàn)镚DI+對(duì)以前的Windows版本中GDI進(jìn)行了優(yōu)化，并添加了許多新的功能。45.1圖形圖像繪制基礎(chǔ)知識(shí)圖5-1展示了GDI+在應(yīng)用程序與上述設(shè)備之間起著重要的中介作用。其中，GDI+為我們“包辦”了幾乎一切——從把一個(gè)簡(jiǎn)單的字符串“HelloWorld”打印到控制臺(tái)到繪制直線、矩形甚至是打印一個(gè)完整的表單等。55.1圖形圖像繪制基礎(chǔ)知識(shí)在VisualBasic.NET中，所有圖形圖像處理功能都在以下命名空間下：1.System.Drawing命名空間提供了對(duì)GDI+基本圖形功能的訪問(wèn)，主要有Graphics類、Bitmap類、從Brush類繼承的類、Font類、Icon類、Image類、Pen類、Color類等。2.System.Drawing.Drawing2D命名空間VisualBasic.NET中沒(méi)有3D命名空間，這是因?yàn)槿S（3D）的效果實(shí)際上是通過(guò)二維（2D）的圖案體現(xiàn)的。System.Drawing.Drawing2D命名空間提供了高級(jí)的二維和矢量圖形功能。主要有梯度型畫刷、Matrix類（用于定義幾何變換）和GraphicsPath類等。3.System.Drawing.Imaging命名空間提供了高級(jí)GDI+圖像處理功能。4.System.Drawing.Text命名空間提供了高級(jí)GDI+字體和文本排版功能。65.1圖形圖像繪制基礎(chǔ)知識(shí)5.1.2Graphics類要進(jìn)行圖形處理，必須首先創(chuàng)建Graphics對(duì)象，然后才能利用它進(jìn)行各種畫圖操作。創(chuàng)建Graphics對(duì)象的形式有：（1）在窗體或控件的Paint事件中直接引用Graphics對(duì)象每一個(gè)窗體或控件都有一個(gè)Paint事件，該事件的參數(shù)中包含了當(dāng)前窗體或控件的Graphics對(duì)象，在為窗體或控件創(chuàng)建繪制代碼時(shí)，一般使用此方法來(lái)獲取對(duì)圖形對(duì)象的引用。

PrivateSubForm1_Paint(ByValsenderAsSystem.Object,ByValeAsSystem.Windows.Forms.PaintEventArgs)HandlesMyBase.Paint

DimgAsGraphics=e.Graphics……EndSub75.1圖形圖像繪制基礎(chǔ)知識(shí)（2）從當(dāng)前窗體或控件獲取對(duì)Graphics對(duì)象的引用把當(dāng)前窗體的畫刷、字體、顏色作為缺省值獲取對(duì)Graphics對(duì)象的引用，注意這種對(duì)象只有在處理當(dāng)前Windows窗口消息的過(guò)程中有效。如果想在已存在的窗體或控件上繪圖，可以使用此方法。例如：DimgAsGraphics=Me.PictureBox1.CreateGraphics()……85.1圖形圖像繪制基礎(chǔ)知識(shí)（3）從繼承自圖像的任何對(duì)象創(chuàng)建Graphics對(duì)象。此方法在需要更改已存在的圖像時(shí)十分有用。例如：DimbitmapAsNewBitmap("C:\test\a1.bmp")DimgAsGraphics=Graphics.FromImage(bitmap)在圖形編程中，默認(rèn)的圖形度量單位是像素。不過(guò)，可以通過(guò)修改PageUnit屬性來(lái)修改圖形的度量單位，可以是英寸或是毫米等。實(shí)現(xiàn)方法如下：

DimgAsGraphics=e.Graphics

g.PageUnit=GraphicsUnit.Inch95.1圖形圖像繪制基礎(chǔ)知識(shí)5.1.3顏色GDI+中的許多繪圖操作都涉及到顏色。例如，在繪制線條或矩形時(shí)都需要指定使用什么顏色。在自然界中，顏色大都由透明度（A）和三基色（R,G,B）所組成。在GDI+中，顏色封裝在Color結(jié)構(gòu)中.105.1圖形圖像繪制基礎(chǔ)知識(shí)Color結(jié)構(gòu)中，除了提供（A,R,G,B）以外，還提供許多系統(tǒng)定義的顏色如Pink（粉顏色），也就說(shuō)用戶可以通過(guò)Color結(jié)構(gòu)就可以使用系統(tǒng)定義的顏色。Color結(jié)構(gòu)的基本屬性如表1所示。表1顏色的基本屬性名稱說(shuō)明A獲取此Color結(jié)構(gòu)的alpha分量值，取值（0～255）。B獲取此Color結(jié)構(gòu)的藍(lán)色分量值，取值（0～255）。G獲取此Color結(jié)構(gòu)的綠色分量值，取值（0～255）。R獲取此Color結(jié)構(gòu)的紅色分量值，取值（0～255）。Name獲取此Color結(jié)構(gòu)的名稱，這將返回用戶定義的顏色的名稱或已知顏色的名稱（如果該顏色是從某個(gè)名稱創(chuàng)建的），對(duì)于自定義的顏色，將返回RGB值。115.1圖形圖像繪制基礎(chǔ)知識(shí)在圖像處理中一般需要獲取或設(shè)置像素的顏色值，獲取一幅圖像的某個(gè)像素顏色值的具體步驟如下：（1）定義BitmapBitmapmyBitmap=newBitmap("c:\MyImages\TestImage.bmp")（2）定義一個(gè)顏色變量把在指定位置所取得的像素值存入顏色變量中Colorc=newColor()c=myBitmap.GetPixel(10,10)//獲取此Bitmap中指定像素的顏色。（3）將顏色值分解出單色分量值intr,g,b;r=c.R;//紅色分量g=c.G;//綠色分量b=c.B;//藍(lán)色分量125.1圖形圖像繪制基礎(chǔ)知識(shí)5.1.4坐標(biāo)在實(shí)際的繪圖中，我們所關(guān)注的一般都是指設(shè)備坐標(biāo)系，此坐標(biāo)系以像素為單位，像素指的是屏幕上的亮點(diǎn)。每個(gè)像素都有一個(gè)坐標(biāo)點(diǎn)與之對(duì)應(yīng)，左上角的坐標(biāo)設(shè)為（0，0），向右為正，向下為正。一般情況下以（x，y）代表屏幕上某個(gè)像素的坐標(biāo)點(diǎn)，其中水平以X坐標(biāo)值表示，垂直以Y坐標(biāo)值表示。例如，在圖8-2所示的坐標(biāo)系統(tǒng)中畫一個(gè)點(diǎn)，該點(diǎn)的坐標(biāo)（x,y）是（4,3）。135.1圖形圖像繪制基礎(chǔ)知識(shí)5.1.5Paint事件在屏幕上進(jìn)行繪制的操作稱為“繪畫”。窗體和控件都有一個(gè)Paint事件。每當(dāng)需要重新繪制窗體和控件（例如，首次顯示窗體或窗體由另一個(gè)窗口覆蓋）時(shí)就會(huì)發(fā)生該事件。用戶所編寫的用于顯示圖形的任何代碼通常都包含在Paint事件處理程序中。145.2繪制基本圖形5.2.1創(chuàng)建畫筆在GDI+中，可使用畫筆（Pen）對(duì)象于繪制具有指定寬度和樣式的線條、曲線以及勾勒形狀輪廓。畫筆Pen類的構(gòu)造函數(shù)有四種，使用方法如下。（1）創(chuàng)建某一顏色的Pen對(duì)象：PublicSubNew(ByValcolorAsColor)（2）創(chuàng)建某一刷子樣式的Pen對(duì)象：PublicSubNew(ByValbrushAsBrush)（3）創(chuàng)建某—刷子樣式并具有相應(yīng)寬度的Pen對(duì)象：PublicSubNew(ByValbrushAsBrush,ByValwidthAsSingle)（4）創(chuàng)建某一顏色和相應(yīng)寬度的Pen對(duì)象：PublicSubNew(ByValcolorAsColor,ByValwidthAsSingle)155.2.2繪制直線有兩種繪制直線的方法：DrawLine()方法和DrawLines()方法。DrawLine()用于繪制一條直線，DrawLines()用于繪制多條直線。常用形式有：[格式1]：OverloadsPublicSubDrawLine(ByValpenAsPen,ByValx1AsInteger,ByValy1AsInteger,ByValx2AsInteger,ByValy2AsInteger)其中x1,y1為起點(diǎn)坐標(biāo)，x2,y2為終點(diǎn)坐標(biāo)。例如：

e.Graphics.DrawLine(blackPen,100,100,200,100)[格式2]：OverloadsPublicSubDrawLine(ByValpenAsPen,ByValpt1AsPoint,ByValpt2AsPoint)其中Pen對(duì)象確定線條的顏色、寬度和樣式。Point結(jié)構(gòu)確定起點(diǎn)和終點(diǎn)。165.2.3繪制矩形使用DrawRectangle()方法可以繪制矩形，常用形式有：[格式1]：OverloadsPublicSubDrawRectangle(ByValpenAsPen,ByValrectAsRectangle)其中rect表示要繪制的矩形的Rectangle結(jié)構(gòu)。[格式2]：OverloadsPublicSubDrawRectangle(ByValpenAsPen,ByValxAsSingle,ByValyAsSingle,ByValwidthAsSingle,ByValheightAsSingle)其中x,y為矩形左上角坐標(biāo)值。參數(shù)width是要繪制矩形的寬度，參數(shù)height是要繪制矩形的高度。175.2.4繪制多邊形多邊形分為空心多邊形和填充多邊形。（1）繪制空心多邊形

PublicSubDrawPolygon(ByValpenAsPen,ByValpointAsPoint())（2）繪制填充多邊形

PublicSubFillPolygon(ByValbrushAsBrush,ByValpointAsPoint())其中Point數(shù)組是由一組Point結(jié)構(gòu)對(duì)象定義的多邊形。Pen對(duì)象指出畫線的畫筆。注意填充多邊形需用畫刷而不是畫筆。185.2.5繪制曲線曲線有空心曲線和填充曲線之分。Graphics.DrawClosedCurve可以畫出一個(gè)平滑封閉的曲線（1）繪制空心閉合曲線PublicSubDrawClosedCurve(ByValpenAsPen,ByValpointsAsPoint())（2）繪制填充閉合曲線PublicSubFillClosedCurve(ByValpenAsPen,ByValpointsAsPoint())points表示曲線經(jīng)過(guò)點(diǎn)的數(shù)組，其中必須包含至少4個(gè)點(diǎn)。195.2.6繪制橢圓和弧線橢圓是一種特殊的封閉曲線，Graphics類專門提供了繪制橢圓的兩種方法：DrawEllipse()方法和FillEllipse()方法。常用形式有：[格式1]：

PublicSubDrawEllipse(ByValpenAsPen,ByValrectAsRectangle)其中rect為Rectangle結(jié)構(gòu)，用于確定橢圓的邊界。[格式2]：PublicSubDrawEllipse(ByValpenAsPen,ByValxAsInteger,ByValyAsInteger,ByValwidthAsInteger,ByValheightAsInteger)其中x,y為橢圓左上角的坐標(biāo)，width定義橢圓的邊框的寬度,height定義橢圓的邊框的高度。[格式3]：PublicSubFillEllipse(ByValbrushAsBrush,ByValrectAsRectangle)填充橢圓的內(nèi)部區(qū)域。其中rect為Rectangle結(jié)構(gòu)，用于確定橢圓的邊界。205.3創(chuàng)建畫刷填充圖形畫刷是可與Graphics對(duì)象一起使用來(lái)創(chuàng)建實(shí)心形狀和呈現(xiàn)文本的對(duì)象?？梢杂卯嬎⑻畛涓鞣N圖形形狀，如矩形、橢圓、扇形、多邊形和封閉路徑等。畫刷（Brush）類是一個(gè)抽象類，本身不能實(shí)例化。一般使用它的派生類。主要有以下幾種不同類型的畫刷Brush派生類：（1）SolidBrush畫刷SolidBrush類用來(lái)定義單一顏色的Brush，用純色進(jìn)行繪制。215.3創(chuàng)建畫刷填充圖形（2）HatchBrush畫刷類似于SolidBrush，但是可以利用該類從大量預(yù)設(shè)的圖案中選擇繪制時(shí)要使用的圖案，而不是純色。HatchBrush畫刷具有三個(gè)屬性，分別如下：1）HatchStyle屬性：獲取此HatchBrush對(duì)象的陰影樣式。2）BackgroundColor屬性：獲取此HatchBrush對(duì)象的背景色。3）ForegroundColor屬性：獲取此HatchBrush對(duì)象的前景色。225.3創(chuàng)建畫刷填充圖形（3）LinearGradientBrush畫刷使用兩種顏色漸變混合的進(jìn)行繪制。LinearGradientBrush類的構(gòu)造函數(shù)有多種格式，最常用的格式如下。

PublicSubNew(ByValpoint1AsPoint,ByValpoint2AsPoint,ByValcolor1AsColor,ByValcolor2AsColor)該構(gòu)造函數(shù)有四個(gè)參數(shù)，其中Point1是表示漸變的起始點(diǎn)，Point2是表示漸變的終結(jié)點(diǎn)，Color1表示的漸變的起始色，Color2表示的是漸變的終止色。此處的Point1和Point2是Point結(jié)構(gòu)型的變量，Point結(jié)構(gòu)表示一個(gè)點(diǎn)，有兩個(gè)成員x和y，分別表示點(diǎn)的橫坐標(biāo)和縱坐標(biāo)。235.3創(chuàng)建畫刷填充圖形（4）TextureBrush畫刷使用紋理（如圖像）進(jìn)行繪制。TextureBrush類允許使用一幅圖像作為填充的樣式。245.4圖像處理5.4.1顯示圖像可以使用GDI+顯示以文件形式存在的圖像文件。圖像文件可以是BMP、JPEG、GIF、TIFF、PNG等。實(shí)現(xiàn)步驟為：（1）創(chuàng)建一個(gè)Bitmap對(duì)象，指明要顯示的圖像文件；創(chuàng)建Bitmap對(duì)象，Bitmap類有很多重載的構(gòu)造函數(shù)，其中之一是：

PublicSubNew(ByValAsString)

是位圖文件的名稱?？梢岳迷摌?gòu)造函數(shù)創(chuàng)建Bitmap對(duì)象，例如：

DimbitmapAsNewBitmap("tu1.jpg");（2）創(chuàng)建一個(gè)Graphics對(duì)象，表示要使用的繪圖平面；

DimgAsGraphics=窗體或圖片框控件.CreateGraphics()（3）調(diào)用Graphics對(duì)象的DrawImage方法顯示圖像。255.4圖像處理5.4.2圖像的平移、旋轉(zhuǎn)和縮放Graphics類提供了三種對(duì)圖像進(jìn)行幾何變換的方法，分別用于圖形圖像的平移、旋轉(zhuǎn)和縮放。TranslateTransform()方法的形式為：PublicSubTranslateTransform(ByValdxAsSingle,ByValdyAsSingle)圖形平移指定的尺寸。其中，dx表示平移的x分量，dy表示平移的y分量。RotateTransform()方法的形式為：PublicSubRotateTransform(ByValangleAsSingle)圖形旋轉(zhuǎn)指定角度。其中，angle表示旋轉(zhuǎn)角度。ScaleTransform()方法的形式為：PublicSubScaleTransform(ByValsxAsSingle,ByValsyAsSingle)圖形縮放指定數(shù)量。其中，sx表示x方向的縮放比例，sy表示y方向的縮放比例。265.4圖像處理5.4.4彩色圖像變換灰度圖像彩色圖像像素的顏色是由三種基本色顏色，即紅（R）、綠（G）、藍(lán)（B）有機(jī)組合而成的，稱為三基色。每種基色可取0～255的值，因此由三基色可組合成（256*256*256）1677萬(wàn)種顏色，每種顏色都有其對(duì)應(yīng)的R、G、B值。（1）彩色圖像顏色值的獲取在使用C#系統(tǒng)處理彩色圖像時(shí)，使用Bitmap類的GetPixel方法獲取圖像上指定像素的顏色值。275.4圖像處理（2）彩色位圖顏色值分解像素顏色值c是一個(gè)長(zhǎng)整型的數(shù)值，占4個(gè)字節(jié)，最上位字節(jié)的值為“0”，其它3個(gè)下位字節(jié)依次為B、G、R，值為0～255。從Color值分解出R、G、B值可直接使用：DimcAsNewColor()c=box1.GetPixel(i,j)r=c.Rg=c.Gb=c.B285.4圖像處理（3）圖像像素顏色的設(shè)定設(shè)置像素顏色可使用SetPixel方法。用法如下：Dimc1AsColor=Color.FromArgb(rr,gg,bb)Box2.SetPixel(i,j,c1)'指定圖片框Box2位置(i,j)的顏色值為c1【例5-6】彩色圖像生成灰度圖像。295.5文字處理5.5.1創(chuàng)建字體Font類定義了文字的格式，如字體、大小和樣式等。創(chuàng)建字體對(duì)象的語(yǔ)法格式如下：

Font字體對(duì)象=newFont(字體名,字號(hào),字體樣式)其中，“字體樣式”為FontStyle枚舉類型，包括Bold,Italic，Regular，Strikeout（刪除線）和Underline等。表示該字體是否為粗體，斜體，常規(guī)，黑體，刪除線或下劃線。還可以通過(guò)or運(yùn)算符來(lái)組合樣式，例如，F(xiàn)ontstyle.ItalicOrFontStyle.Bold將字體變成傾斜和加粗。例如，以下語(yǔ)句創(chuàng)建一個(gè)字體為“宋體”，大小為20，樣式為粗體的Font對(duì)象f：

DimfAsFontf=NewFont("宋體",20,FontStyle.Bold)305.5文字處理字體常用屬性如表4所示。名稱說(shuō)明Bold是否為粗體。FontFamily字體成員。Height字體高。Italic是否為斜體。Name字體名稱。Size字體尺寸。SizeInPoints獲取此

Font對(duì)象的字號(hào)，以磅為單位。Strikeout是否有刪除線。Style字體類型。Underline是否有下劃線。Unit字體尺寸單位。315.5文字處理5.5.2繪制文本Graphics對(duì)象提供了文本輸出的Dr