.htm_cmp_sky110_bnr.gif)
|
|
|
|
2018年12月02日 |
|
第二十一章VB .NET繪圖物件及方法介紹 21.5 影像處理
影像處理(Image processing)的影像(Image)，是一個比較抽象的類別，因其屬抽象類別必須藉由其衍生類別如點陣圖(Bitmap)或向量圖(MetaFile)來實作。點陣圖(Bitmap)是一個二維的矩形位元(Byte，1 byte=8 bits)陣列，它與圖像的元素(Pixel簡稱圖素，為英文Pix與Element的組合)一一對應。當真實的物件被掃描成點陣圖圖像檔案以後，圖像被分割成許多縱橫的網格，以每個網格點作為取樣單位。在點陣圖中的每個圖素值代表一個單位網格內圖像顏色的平均值。單色點陣圖每個圖素只需要一個位元(0與1，分別代表黑色及白色)，灰色或彩色點陣圖中每個圖素需要多個位元組數。如果每個像素都是由4個位元構成，則每一個像素可以是 16(2^4 = 16)個不同的色彩之一，如果是8個位元則每一個像素可以是 256(2^8 = 256)個不同的色彩之一。 Windows程式內儲存圖像資訊的方法主要有(a)點陣圖(bitmap)，及(b)向量圖(Metafile)兩種。向量圖儲存的就是產生圖像的描述及繪圖指令，不是將圖像以數位化的圖示代表，其較適合用來描述由人工繪製，或機器產生的圖像，比如建築設計藍圖、機械構造圖等。點陣圖經常用來表示來自真實世界的複雜圖像，例如數位化的照片或是視訊圖像。點陣圖和向量圖都能儲存在電腦記憶體或磁碟機中，並且都能通過剪貼簿在Windows應用程式間傳輸。 點陣圖和向量圖的主要區別在於位元映射圖像和向量圖像之間的差別。位元映射影像藉離散的圖素來處理輸出設備；而向量圖像則使用笛卡爾座標系統來處理輸出設備，其線條和填充物件能被個別處理。現在大多數的影像輸出設備是位元映射設備，這包括視訊顯示、點陣圖印表機、雷射印表機和噴墨印表機。而筆式繪圖機則是向量圖像輸出設備。 當然，點陣圖並非完美無缺點的，其容易受顯示設備或輸出設備的影響，另外對顏色的依賴性較大，因此，在單色設備上顯示彩色點陣圖的效果總是不能令人滿意的，另外點陣圖與電腦顯示解析度和圖像縱橫寬、高比有關。儘管點陣圖能被拉伸和縮小，通常會在伸縮時增加或刪除圖素的某些行和列，這樣會破壞圖像的大小及真實性；而向量圖因儲存的圖像是幾何資訊，在影像放大、縮小後仍然能保持圖形樣式不受改變(如直線放大或縮小，只改變起終點座標位置)。點陣圖的第二個缺點是需要儲存容量空間較大。以一張800×600，16色(4bbp)的影像，需要大於(800×600×4/8/1024)234KB的空間；一幅1024×768，並且每個圖素為24位元顏色的圖像則需要大於(1024×768×24/8/1024)2.34MB 的空間。向量圖則需要儲存容納比點陣圖小很多。點陣圖的儲存空間取決於影圖像的大小，及其代表顏色強度決定，而向量圖的儲存空間則由圖像的複雜程度和它所包含的GDI繪圖指令數量決定
21.5.1影像 影像(Image)為繪製、複製、轉換、物件及展示用圖片(Picture)，其屬抽象類別，必須透過其衍生類別，如點陣圖或向量圖以建立實體物件來實作。如下面片段程式就是建立點陣圖的例子：
Dim bmp As New Bitmap(180, 200) ‘新建寬長大小為180×200像素的Bitmap Using gr As Graphics = Graphics.FromImage(bmp) gr.DrawEllipse(Pens.Blue, 20, 20, 120, 160) End Using
21.5.2點陣圖結構 點陣圖(Bitmap)是以像素資料定義的類別，User可以用這些資料作影像之運算、修正、儲存等處理作業，這些資料可以在表單、圖形方塊、控制項顯示，點陣圖可轉存為Bmp、Gif、Jpeg、Png、Tiff等類型檔案。點陣圖很多重要的屬性、方法多是 繼承自Image抽象類別。 在介紹點陣圖檔案結構及像素、圖元關係前，讓我們先複習一下二進位、十進位與十六進位知關係及如何換算。如十進位的18換算為二進位：
2∟18 -----0 (2^0=1) 2∟9 ----1(2^1=2) 2∟4 ----0 (2^2=4) 2∟2 ----0 (2^3=8) 1 ---- (2^4=16)
二進位記法 一般多採用高冪次至低冪次，即(10010) 18=10010=1×16+0×8+0×4+1×2+0×1 如果是寫電腦程式，您亦可以採用以字串方式，由第低冪次至高低冪次排列 18=”01001”=0×1+1×2+0×4+0×8+1×16 注意！不能使用數值記法，否則電腦會將由第低冪次至高低冪次排列 之「01001」改成「1001」。至於其他十進位換算為八進位及十六進位之算法均與上述作業方式類似。以十進位之6250，十六進位為：
16∟6250-----10(16^0=1) 16∟390 -----6(16^1=16) 16∟24 -----8(16^2=256) 1 -----(16^3=4096)
6250=186A=1×16^3+8×16^2+6×16^1+10×16^0(高羃次至低羃次，以一個字為單位) 6250=6A18=6×16^1+10×16^0+1×16^3+8×16^2(低羃次至高羃次，以兩個字為單位) 6250=A681=10×16^0+6×16^1+8×16^2+1×16^3 (低羃次至高羃次，以一個字為單位)
至於寫電腦程式時，進位冪次及餘數的記法，則隨您高興，就像產品規範及規格，當然可以由生產者自己擬定。此點似可說明點陣圖檔案資料與圖元像素兩者排序方式為何可以不一致，只要最後結果是正確即可。
如上面之8 Pixel×8Pixel大小之黑白點陣圖(上圖中央綠框中白底黑線小圖)與尺寸放大之8×8方格圖對應，如以二維陣列儲存，大小需BmpBits(7,7)共8×8個位元組(8個bits組成1個Byte)。第一列分別為(1,1,1,1,1,1,1,1,1,1)，共8個位元組，即BmpBits(0,0)~ BmpBits(0,7)共用8個Bytes來代表第0列全為白色(為方便比對資料檔案與影像顯示排序不同。因此BmpBits(0,0)為白色非黑色)；第1列則為(1,0,1,1,1,1,1,1)，代表第1列除BmpBits(1,1)為黑色外，其餘均為白色。-----------。如果改以一維陣列儲存(排序如由高至低)，將第0列元素視為: 1×2^7+1×2^6+1×2^5+1×2^4+1×2^3+1×2^2+1×2^1+1×2^0=255=&HFF=ox377 第1列元素視為: 1×2^7+0×2^6+1×2^5+1×2^4+1×2^3+1×2^2+1×2^1+1×2^0=191=&HBF=ox277 則上述8×8陣列可以1×8或8×1陣列取代，不但方便，也可以節省許多記憶體。
下面我們再介紹如何以8×8二維布林(Boolean)值陣列來建立8 Pixel× 8Pixel的點陣圖電腦程序碼編寫。
Private Sub But8_8colorBmp_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles But8_8colorBmp.Click Dim nGrid As Integer nGrid = 8 Dim bmpBoolArray(,) As Boolean ReDim bmpBoolArray(nGrid - 1, nGrid - 1) For i As Integer = 0 To nGrid - 1 For j As Integer = 0 To nGrid - 1 bmpBoolArray(i, j) = True '真值代表白色 '假值代表黑色,bmpBoolArray(2,2),bmpBoolArray(3,3),bmpBoolArray(4,4) ‘,bmpBoolArray(5,5)bmpBoolArray(6,6),bmpBoolArray(7,7) If (i >= 1 And i = j) Then bmpBoolArray(i, j) = False ' Next Next Picshow.Width = nGrid Picshow.Height = nGrid Span = nGrid Picshow.Image = CreateBmpbyBoolArray(bmpBoolArray, nGrid) Call drawGridWB(nGrid, bmpBoolArray) '放大圖示 End Sub
Private Function CreateBmpbyBoolArray(ByRef Matx(,) As Boolean, ByVal bmpWidth As Integer) As Image Dim Height As Integer '點陣圖高度 Height = Matx.Length \ bmpWidth Dim Bmp As New Bitmap(bmpWidth, Height) For jY As Integer = 0 To Height - 1 '水平掃瞄 For iX As Integer = 0 To bmpWidth - 1 If Matx(jY, iX) = True Then Bmp.SetPixel(jY, iX, Color.White) Else Bmp.SetPixel(jY, iX, PickedColor) End If Next Next Return Bmp End Function
Private Sub drawGridWB(ByVal nGrid As Integer, ByVal Matx(,) As Boolean) Dim bmp As New Bitmap(PicEnlarge.Width, PicEnlarge.Height) Dim Xyspace As Single = (PicEnlarge.Width - 1) / nGrid Dim bmpf As New Bitmap(bmp) ReDim Preserve Matx(nGrid - 1, nGrid - 1) Dim i, j As Integer Dim g1 As Graphics = Graphics.FromImage(bmpf) For j = 0 To nGrid - 1 For i = 0 To nGrid - 1 Dim Rect As New RectangleF(i * Xyspace, j * Xyspace, Xyspace, Xyspace) Dim tBrush As Brush If Matx(i, j) = True Then tBrush = New SolidBrush(Color.White) Else tBrush = New SolidBrush(Color.Black) End If
g1.FillRectangle(tBrush, Rect) Next Next Dim penuse As New Pen(Color.Gray) penuse.DashStyle = DashStyle.Solid '.Dash For i = 0 To PicEnlarge.Height Step Xyspace g1.DrawLine(penuse, 0, i, PicEnlarge.Width, i) Next i For i = 0 To PicEnlarge.Width Step Xyspace g1.DrawLine(penuse, i, 0, i, PicEnlarge.Height) Next i PicEnlarge.Image = bmpf bmp = New Bitmap(PicEnlarge.Image) End Sub 利用上述程式，可以將點陣圖儲存成bmp圖檔，然後利用UltraEdit讀出bmp內容如下：
或利用程序讀出像素資料檔案如下所示：
要解讀上述資料，就必須瞭解點陣圖的檔案結構。點陣圖檔案結構包含四個主要部份: (1)Bitmap File Header (點陣圖檔頭) (2)Bitmap Info Header (點陣圖檔頭資訊) (3)Color Table (Palette) (點陣圖調色板) (4)Bitmap Array(點陣圖像素顏色)
對照上述之點陣圖，我們將其整理如下表以方便解說。
(1) 第0及第1個位元組為(42 4D)，第0位元組的十六進位數目為42(十進位為16×4+2=66)，第1個位元組為4D(十進位為16×4+13=77)，對照英文字母的ASCII碼為大寫的B及M，此代表點陣圖類型為「BM」類型。 (2) 第2個及第5位元組為(36 01 00 00)，點陣圖圖檔資料儲存方式是低位元組在前，高位元組在後，要換算為十進位應該為00 00 01 36(以位元組為單位,因此非0163)，換算為十進位為(1*16^2+3*16^1+6=310)310 bytes，此為點陣圖檔案資料大小(包括檔頭在内之所有欄位)。 (3) 第6至到第9位元組共4個位元組(00 00 00 00)均為0，此為保留欄位。 (4) 第10至第13位元組(00 00 36 00)，十進位為54，此為點陣圖資料開始之前的偏移量(指點陣圖像素顏色資料由此欄位起算)。 (5) 第14至第17位元組(28 00 00 00)，十進為40，此為檔頭資料欄位大小。 (6) 第18~21位元組(08 00 00 00)為點陣圖水平方向寬度，十進位為8，為8 pixels。 (7) 第22~25位元組(08 00 00 00)為點陣圖垂直方向寬度，十進位為8，為8 pixels。 (8) 第26~27位元組(01 00)為點陣圖的位元圖層數，十進位為1。 (9) 第28~29位元組(20 00)為點陣圖的bpp，十進位為32，每個像素顏色需要32位元數(4 bytes)。 (10) 第30~33位元組(00 00 00 00)，十進位為0，代表點陣圖不壓縮。 (11) 第34~37位元組(00 0 00 00)，十進位為0，因為不壓縮，故點陣圖像素檔案大小 可以設定為0。 (12) 第38~41位元組(C4 0E 00 00)，十進位為3780 bytes/m，換算後為96 dpi，即水平解析度為96 dpi。 (13) 第42~45位元組(C4 0E 00 00)，十進位為3780 bytes/m，換算後，垂直解析度為96 dpi。 (14) 第46~49位元組(00 00 00 00)，十進位為0，調色盤顏色為0，表示不使用調色盤。 (15) 第50~53位元組(00 00 00 00)，十進位為0，表示任何顏色都重要。 (16) 第54位元組起，每4個位元組代表點陣圖上一個像素顏色，從第54位元組起至第81位元組，共有28個”FF”(每4個FF代表1個白色網格)，後面接1組”00 00 00 FF”(代表1格黑色網格)後，再接28個”FF，………。最後1組”00 00 00 FF”後面，再接56個”FF”(14 pixels)。 (17) 上面說明如果還不清楚，請看下面之圖示就能瞭解一切。
(a)螢幕所顯示之點陣圖(掃瞄方向由56~63,48~55,………,1~7)
(b)點陣圖資料檔案排列方式
上面之圖像像素排列，在螢幕上排列是由左上到右下；在資料檔(記憶體中)是由由左下到右上，即螢幕上最上一列，在記憶體是最下一列(上下對調，左右不變)。以本例題來說，因為是黑白兩色圖檔，只能看出兩者排序之差異，尚不能看出RGB顏色成份是否有變化(00 00 00 或FF FF FF，因為左右對掉，仍然是00 00 00 及FF FF FF)。現在，我們再舉一個8×8彩色圖像，看看點陣圖像素顏色是如何排列？
本例題之彩色檔案與前述黑白檔案除像素顏色有不同外，其餘都不變。由第一個位元組起算，第一個顏色資料(位元組54~57)為(00 00 00 FF)，第四個FF為RGB之A值(顏色通道)，前面三個00不論是RGB或是GBR多沒差別，都代表黑色；所以，我們往下看第二個顏色資料(位元組58~61)為(FF F8 F0 FF)，前面三個位元組十進位為(255 248 240)，比對使用顏色應是AliceBlue(240 248 255)RGB值之逆向排列，即BGR為(255 248 240)。在再檢查第三個網格顏色資料(位元組58~61)為(8B 00 8B FF)十進位為(139 00 139)，因左右對稱暫予保留。再看下一個像素(50 7F FF FF) 十進位為(80 127 255)為Coral的RGB顏色逆向排列，因此我們確定(8B 00 8B FF)應為DarkMagenta顏色逆向排列無誤。點陣圖資料第一個像素對應為顏色陣列第56個網格，同為黑色。其餘亦是一一對應。 21.5.3讀取點陣圖資料 下面我們介紹如何讀寫點陣圖資料？前面我們曾提及，每一掃描列的長度必需是 4 byte 的倍數，有些圖檔，可能就會有不是4 byte的倍數。如下面為9×8 pixels之點陣圖，每一個像素顏色需要三個位元組，寬度為9 pixels共須27個位元數，實際在儲存時需要28個位元組，此多用的一個位元組，都以00填補。有人稱此填補用的位元組為Junkbytes，Junkbytes的數目與掃瞄行(Scaleline或Stride)寬有關，掃瞄行計算公式為： 掃瞄行LineOfBytes=((biWidth*biBitCount+31)And &HFFFFFFE0)\8 以本點陣圖為例，biWidth=9，biHeight=8，biBitCount =24，LineOfBytes=28，Junkbites=1。
至於上述資料如何取得，除依前面所介紹之方式，利用UltraEdit軟體讀取資料後，利用徒手計算方式取得外，尚可以定義點陣圖資料結構，利用檔案流(Filestrem)讀取。 對應前面點陣圖結構，我們可以定義BITMAPFILEHEADER，BITMAPINFOHEADER及RGBQUAD結構如下：
(1）BITMAPFILEHEADER(BMP點陣圖檔頭)的VB NET聲明如下： Private Type BITMAPFILEHEADER bfType As Integer ‘檔案類型 bfSize As Long ‘點陣圖檔的大小 bfReserved1 As Integer ‘目前保留 bfReserved2 As Integer ‘目前保留bfReserved1與bfReserved2可合併 bfOffBits As Long ‘點陣圖資料距離檔頭的偏移位元組數 End Type
（2）BITMAPINFOHEADER(點陣圖檔頭資訊)的VB NET聲明如下： Private Type BITMAPINFOHEADER '40 bytes biSize As Long ‘BITMAPINFOHEADER結構的大小 biWidth As Long ‘點陣圖的寬度(圖元) biHeight As Long ‘點陣圖的高度(圖元) biPlanes As Integer ‘設備的位元平面數 biBitCount As Integer ‘圖像的顏色位元數，可以為1,4,8,16,23,32 中之1 biCompression As Long ‘圖像的壓縮方式 biSizeImage As Long ‘實際的點陣圖資料所占位元組 biXPelsPerMeter As Long ‘顯示設備水平方向解析度(圖元個數/M) biYPelsPerMeter As Long ‘顯示設備垂直方向解析度(圖元個數/M) biClrUsed As Long ‘所使用的顏色數 biClrImportant As Long ‘重要的顏色數 End Type
(3)RGBQUAD(點陣圖調色板) 的VB NET聲明如下： Private Type RGBQUAD rgbBlue As Byte ‘藍色成分數值 rgbGreen As Byte ‘綠色成分數值 rgbRed As Byte 紅色成分數值 rgbReserved As Byte End Type
上述各項參數所代表之意義，請參考前面相關說明。 有關點陣圖資料讀取程序編寫作業，可以歸納成下列幾個要點：
(1) 開啟點陣圖資料資料檔 (2) 建立資料流物件 Dim fs0 As New FileStream(bmpFileName, FileMode.Open, FileAccess.Read) (3) 讀入位元資料並儲存至Buffer() (4) 利用集合(Collection)儲存點陣圖像素顏色資料(以掃瞄線寬為單位，含填充用位元組) (5) 反向排列集合項目 (6) 分離陣圖像素顏色資料(捨去填充用位元組)備用。 (7) 位元影像處理
上述作業係用集合之排列觀念，簡潔不易出錯。為方便讀者瞭解，程式編輯非常直接，沒有花俏，讀者可以在瞭解全部內容後，將其改編更精簡，最後記得釋放集合所使用之記憶體。
Private Sub FileReadOut(ByRef buffer() As Byte, ByRef ImgBGR(,,) As Byte) Form2.Show() Dim bufferP() As Byte Dim bmpFileName As String If OpenFileDialog1.ShowDialog = DialogResult.OK Then bmpFileName = OpenFileDialog1.FileName Try '--------------------------------- Label1.Text = bmpFileName Dim fs0 As New FileStream(bmpFileName, FileMode.Open, FileAccess.Read) Dim hFile As Integer = FreeFile() Dim br As New BinaryReader(fs0) Dim s As String Dim bibmpHeadSize As UInt32 Dim biWidth As UInt32 Dim biHeight As Int32 Dim biPlane As UInt16 Dim BitsPerPix As UInt16 Dim biCompress As UInt32 Dim biImageSize As UInt32 Dim biXpixsPerMeter As UInt32 Dim biYpixsPerMeter As UInt32 Dim biColorused As UInt32 Dim biColorImport As UInt32 '----------------------- Dim bfType As UInt16 Dim bfSize As UInt32 Dim biReserved As UInt32 Dim bfOffsetBits As UInt32 fs0.Seek(0, SeekOrigin.Current) s = br.ReadChars(2) Form2.ListBox1.Items.Add(s) If s <> "BM" Then MsgBox("對不起???非BM類形資料檔,無法判讀?") Exit Sub End If If s = "BM" Then
Label1.Text += " _Bmp類型" '------------------------------------------ fs0.Seek(0, SeekOrigin.Current) bfSize = br.ReadUInt32() biReserved = br.ReadUInt32() bfOffsetBits = br.ReadUInt32() bibmpHeadSize = br.ReadUInt32() biWidth = br.ReadUInt32() biHeight = br.ReadInt32() biPlane = br.ReadUInt16() BitsPerPix = br.ReadUInt16() biCompress = br.ReadInt32() biImageSize = br.ReadUInt32() biXpixsPerMeter = br.ReadUInt32() biYpixsPerMeter = br.ReadUInt32() biColorused = br.ReadUInt32() biColorImport = br.ReadUInt32() '-------------------------- ListBox1.Items.Add("BmpHeadSize =" + bibmpHeadSize.ToString & " bytes") ListBox1.Items.Add("Bmp_with =" + biWidth.ToString & " Pixels") ListBox1.Items.Add("bmp_Height =" + biHeight.ToString & " Pixels") ListBox1.Items.Add("biPlane =" + biPlane.ToString) ListBox1.Items.Add("BitsPerPix =" + BitsPerPix.ToString & " bbp") ListBox1.Items.Add("資料壓縮模式 =" + biCompress.ToString) ListBox1.Items.Add("biImageSize(像素資料數)= " + biImageSize.ToString & " byte") ListBox1.Items.Add("biXpixsPerMeter=" + biXpixsPerMeter.ToString & "(Pixel/m)= " & (biXpixsPerMeter \ 39.37).ToString & " dpi") ListBox1.Items.Add("biYpixsPerMeter =" + biYpixsPerMeter.ToString & "(Pixel/m)= " & (biYpixsPerMeter \ 39.37).ToString & " dpi") ListBox1.Items.Add("UseColrs =" + biColorused.ToString) ListBox1.Items.Add("ImportCols =" + biColorImport.ToString) ListBox1.Items.Add("bfType= " + s) 'bfType.ToString & "bytes" ListBox1.Items.Add("bfSize(檔案總資料數)= " + bfSize.ToString & "bytes") ListBox1.Items.Add("biReserved= " + biReserved.ToString) ListBox1.Items.Add("bfOffsetBit= " + bfOffsetBits.ToString & "bytes")
Select Case biCompress Case 0 Label1.Text += "未壓縮" Case 1 Label1.Text += "RLE-8(8-bit/pixel)" Case 2 Label1.Text += "RLE-4(4-bit/pixel)" Case Else Label1.Text += "Bitfields" End Select End If br.Close() fs0.Close() '---------------------------------------- Dim fs As FileStream = File.Open(bmpFileName, FileMode.Open) ReDim buffer(fs.Length) fs.Read(buffer, 0, fs.Length) For i As Integer = 0 To bfOffsetBits -1 ‘=53 'fs.Length Form2.ListBox1.Items.Add("buffer= " & i.ToString & ":" & Hex(buffer(i))) ReDim Preserve bufferP(i) bufferP(i) = buffer(i) Next i
Dim istep As Integer = BitsPerPix \ 8 MsgBox("istep= " & istep) Dim count As Integer = 0 Dim lineOfBytes = ((biWidth * BitsPerPix + 31) And &HFFFFFFE0) \ 8 'scanline MsgBox("lineOfBytes" & lineOfBytes & "; biheight= " & biHeight) Dim endByte As Integer = lineOfBytes - istep * biWidth MsgBox("endByte = " & endByte) Form2.ListBox1.Items.Add("lineOfBytes" & lineOfBytes & "; biwidth= " & biWidth & ";biheight= " & biHeight) Form2.ListBox1.Items.Add("endByte(Junk byte) " & endByte) Form2.ListBox1.Items.Add("(bfSize-bfOffsetBits)/lineOfBytes-biHeight=0? =" & ((bfSize - bfOffsetBits) / lineOfBytes - biHeight).ToString) '取集合 Dim countI As Integer = 0 Dim bytesColl As New Collection Dim stbyte As String = "" For i = bfOffsetBits To fs.Length If countI < lineOfBytes Then If countI = 0 Then stbyte = buffer(i) Else stbyte = stbyte & "," & buffer(i) End If countI += 1 End If If countI = lineOfBytes Then bytesColl.Add(stbyte) countI = 0 stbyte = "" End If Next For i = 1 To bytesColl.Count Form2.ListBox1.Items.Add(bytesColl.Item(i)) ' Next '
'取逆向集合 Form2.ListBox1.Items.Add("?----------------------------?") Dim bytesCollRev As New Collection For i = bytesColl.Count To 1 Step -1 bytesCollRev.Add(bytesColl.Item(i)) Next For i = 1 To bytesCollRev.Count Form2.ListBox1.Items.Add(bytesCollRev.Item(i)) Next '分離逆向集合取出BGR Dim starray() As String ReDim ImgBGR(biHeight - 1, biWidth - 1, istep - 1)
For i = 1 To bytesCollRev.Count countI = 0 starray = Split(bytesCollRev.Item(i), ",", -1, CompareMethod.Text) If countI < (lineOfBytes - endByte) Then For j = LBound(starray) To UBound(starray) - endByte ImgBGR(i - 1, j \ istep, j Mod istep) = starray(j) Form2.ListBox1.Items.Add("BGR(" & (i - 1).ToString & "," & (j \ istep).ToString & "," & (j Mod istep).ToString & " )= " & ImgBGR(i - 1, j \ istep, j Mod istep)) Next End If countI += 1 Next
'顯示原有圖形 Dim mStream As New MemoryStream(buffer) Dim img As New Bitmap(mStream) picOrg.Width = biWidth picOrg.Height = biHeight picOrg.Image = img Call drawGrid3DCol(picOrgEnlarge, biWidth, biHeight, ImgBGR)
End Sub
21.5.4利用點陣圖資料新建點陣圖 點陣圖資料讀出後，可利用陣列儲存，陣列儲存時可將檔頭資料、色板資料(如果有的話，目前電腦多採用24位元以上，故此部份不擬討論)及像素顏色資料分別儲存。檔頭資料，一般多不會改變，會改變的主要是像素顏色資料。如前述之黑白8×8 pixels之點陣圖，我們可以將顏色資料或(及)位置排列改變後儲存回備份的點陣檔案以建立新點陣圖。下面之程式碼是將點陣圖像素顏色資料之BGR成份，以(255-原有BGR)互餘(Complement)後，將資料寫回原檔案利用PixtureBox顯示成果之片段程式碼。 Sub BmpFileWriteBack(ByRef buffer() As Byte, ByVal biWidth As Integer, ByVal biHeight As Integer, ByVal bfOffsetBits As Byte, ByVal pixPerBits As Integer, ByVal Stride As Integer, ByVal EndByte As Byte, ByRef ImgBGR(,,) As Byte) Dim countI As Integer '相素顏色互餘() Dim pixsPerbyte = pixPerBits / 8 For I As Integer = 0 To biHeight - 1 For J As Integer = 0 To biWidth - 1 For K As Integer = 0 To pixsPerbyte - 1 If K <= 2 Then ImgBGR(I, J, K) = 255 - ImgBGR(I, J, K) End If Next K Next J Next I Dim bytesCollMod As New Collection Dim stTpt As String '正向寫入集合 For I As Integer = 0 To biHeight - 1 countI = 0 For J As Integer = 0 To biWidth - 1 For K As Integer = 0 To pixsPerbyte - 1 If countI = 0 Then stTpt = ImgBGR(I, J, K).ToString If countI >= 1 And countI <= Stride Then stTpt = stTpt & "," & ImgBGR(I, J, K).ToString countI += 1 Next K Next J If EndByte >= 1 Then For k As Integer = 0 To EndByte - 1 stTpt = stTpt & "," & "00" '加入填充用位元組 Next k End If bytesCollMod.Add(stTpt) Form2.ListBox1.Items.Add(Trim(stTpt)) Next I '集合反向 Dim bytescollmodRev As New Collection For i = bytesCollMod.Count To 1 Step -1 bytescollmodRev.Add(bytesCollMod.Item(i)) Next Dim stArray() As String '寫回原buffer countI = bfOffsetBits For i = 1 To bytescollmodRev.Count stArray = Split(bytescollmodRev.Item(i), ",", -1, CompareMethod.Text) For j As Integer = LBound(stArray) To UBound(stArray) buffer(countI) = stArray(j) countI += 1 Next Next Dim mStream As New MemoryStream(buffer) Dim img As Bitmap = New Bitmap(mStream) picMod.Width = biWidth picMod.Height = biHeight Me.picMod.BackgroundImage = img '顯示圖形 Call drawGrid3DCol(picModEnlarge, biWidth, biHeight, ImgBGR) End Sub
(a)儲存圖檔： 點陣圖可以物件儲存成檔案，點陣圖儲存預設檔案格式為Png格式，因此如儲存成Png檔只需要輸入檔名，其餘格式則應另輸入格式名稱。下面之程式碼為先在Bitmap上畫圖後，再利用檔案儲存對話方塊(SaveFileDialog)中輸入欲儲存的圖檔名稱(***)，分別儲存成***.bmp、***.jpg、***.gif格式圖檔。
'建立如圖形方塊Picturebox1大小的點陣圖物件 Dim Filename As String Dim myBmp As New Bitmap(PictureBox1.Width, PictureBox1.Height) ' 建立繪圖物件. Dim gr As Graphics = Graphics.FromImage(myBmp) ' 在繪圖物件上繪圖. gr.FillRectangle( _ New SolidBrush(Color.LightGreen), _ 0, 0, Me.ClientSize.Width, Me.ClientSize.Height) '建立矩形物件 Dim rect As New Rectangle(5, 5, _ myBmp.Width - 10, myBmp.Height - 10) gr.FillEllipse( _ New HatchBrush(HatchStyle.LightDownwardDiagonal, _ Color.Black, Color.Yellow), _ rect) gr.DrawEllipse(New Pen(Color.Blue, 3), rect) ' 顯示結果. PictureBox1.Image = myBmp myBmp = PictureBox1.Image If dlgSaveDigFile.ShowDialog() = DialogResult.OK Then Filename = dlgSaveDigFile.FileName End If ' 儲存成bitmap, JPEG, GIF格式. myBmp.Save(Filename & ".bmp", System.Drawing.Imaging.ImageFormat.Bmp) myBmp.Save(Filename & ".jpg", System.Drawing.Imaging.ImageFormat.Jpeg) myBmp.Save(Filename & ".gif", System.Drawing.Imaging.ImageFormat.Gif) MsgBox("Ok")
(b)載入圖檔：
載入圖檔與儲存圖檔作業方式類似，可以利用檔案開啟對話方塊(OpenFileDialog)載入需要的檔案。有關程式碼的編寫如下所述：
Dim filename As String If dlgOpenDigFile.ShowDialog() = DialogResult.OK Then filename = dlgOpenDigFile.FileName End If '載入點陣圖 Dim mybmp As New Bitmap(filename) ' 顯示成果. PictureBox1.Image = mybmp PictureBox1.SizeMode = PictureBoxSizeMode.Normal
21.5.3像素處理 點陣圖提供兩種像素的處理方法：(1)擷取像素(GetPixel)，及(2)佈設像素(SetPixel)兩種方法作為像素運算處理的作業基礎。GetPixel與SetPixel作業均須在BitMap記憶體中處理，運算處理完成後再藉由Form或PictureBox來顯示作業結果，無法直接在Form或PictureBox上作業。如需直接在Form或PictureBox不透過Form或PictureBox則可以藉Window API來完成。下面之片段程式碼為VB NET典型的GetPixel與SetPixel作業方式。
Dim clr As Integer Dim xmax As Integer Dim ymax As Integer Dim x As Integer Dim y As Integer ' 取得點陣圖及尺寸. Dim yans As Integer = MsgBox("是否取得點陣圖(*.Bmp)?", MsgBoxStyle.YesNo) If yans = 7 Then MsgBox("請載入圖檔後重來") Exit Sub End If Dim mybmp As Bitmap = PictureBox1.Image xmax = mybmp.Width - 1 ymax = mybmp.Height - 1 ' 轉換成灰階圖片. For y = 0 To ymax For x = 0 To xmax With mybmp.GetPixel(x, y) ‘擷取像素 clr = 0.3 * .R + 0.5 * .G + 0.2 * .B End With mybmp.SetPixel(x, y, _ Color.FromArgb(255, clr, clr, clr)) ‘鋪設像素 Next x Next y ' 顯示圖片. PictureBox1.Image = mybmp
上面的 BitMap.GetPixel()及BitMap.SetPixel()方法，都必須在BitMap中作業，無法直接在圖形方塊中直接操作。舉例來說，如User在圖形方塊畫一個閉合多邊形，需要擷取閉合區域像素顏色，則需將圖形暫時儲存成BitMap檔，載入BitMap檔後，再由BitMap影像資料中擷取顏色，在互動式繪圖程式設計作業中不甚方便，下面我們就介紹另外一種不需經過儲存成BitMap檔案的作業方式。
'(1)先將圖元畫在Bitmap上 '(2)在Bitmap上操作GetPixel及SetPixel '(3)在Form或PictureBox上顯示圖元 Dim g As Graphics '設定BitMap 大小如PictureBox1 尺寸150, 150) Dim bmp As New Bitmap(PictureBox1.Width, PictureBox1.Height Dim bmp2 As New Bitmap(PictureBox1.Width, PictureBox1.Height) g = Graphics.FromImage(bmp) '設定Graphics物件以bmp 為畫布 ,即在bmp上畫圖 g.FillRectangle(New SolidBrush(Color.Red), 0, 0, 120, 120) '畫紅色實心矩形方框 g.DrawRectangle(Pens.Red, 0, 0, 120, 120) Dim ptColor As Color 'ptColor = bmp.GetPixel(40, 40) 'GetPixel方法必須在Bitmap上操作 'MsgBox("col= " & ptColor.ToString) PictureBox1.Image = bmp '在PictureBox1上顯示在bmp圖元 'MsgBox("vartype(color.red)= " & VarType(Color)) For i As Integer = 0 To PictureBox1.Width - 1 For j As Integer = 0 To PictureBox1.Height - 1 ptColor = bmp.GetPixel(i, j) '顏色互餘後RGB(0,255,255) Dim setcolor As Color = Color.FromArgb(255, 255 - ptColor.R, 255 - ptColor.G, 255 - ptColor.B) If i = 10 And j = 10 Then MsgBox("color=" & setcolor.ToString) bmp2.SetPixel(i, j, setcolor) Next Next PictureBox2.Visible = True PictureBox2.Image = bmp2 g.Dispose()
下面的片段程式碼為在Form或PictureBox上利用Api函數，直接擷取像素及佈設像素的作業方式。
Private Shared Function GetDC(ByVal hwnd As IntPtr) As IntPtr End Function
Private Declare Function GetPixel Lib "gdi32" Alias "GetPixel" (ByVal hdc As IntPtr, ByVal X As Int32, ByVal Y As Int32) As Int32 Private Declare Function SetPixel Lib "gdi32" Alias "SetPixel" (ByVal hdc As IntPtr, ByVal X As Int32, ByVal Y As Int32, ByVal crColor As Int32) As Int32 Private Shared Function ReleaseDC(ByVal hWnd As IntPtr, ByVal hDC As IntPtr) As Integer Dim lngPtcolor As Long
Dim gp1 As Graphics = PictureBox1.CreateGraphics Dim hdc1 As IntPtr = gp1.GetHdc() Dim lngsetcolor As Integer For i As Integer = 0 To PictureBox1.Width - 1 For j As Integer = 0 To PictureBox1.Height - 1 lngPtcolor = GetPixel(hdc1, i, j) SetPixel(hdc1, i, j, lngPtcolor) Next j Next i ReleaseDC(IntPtr.Zero, hdc1) '將DC 釋放 End sub 21.5.4進階影像處理 影像處理可概分為(a)點像素處理(Point processes)，及(b)面像素處理(Area processes)兩大類。點像素處理，簡單說就是只處理像素點自身的顏色資訊不涉及其他像素點的顏色資訊；相反地，面像素處理則其像素顏色受其鄰近其他像素影響而改變顏色值。有關(1)影像顏色灰階(Gray scale)、(2)顏色互補(餘，Complement)、(3)顏色亮度(Brightness)、(4)顏色平衡(Balance)、(5)顏色對比(Contrast)、(6)影像相減(Image substract)、(7)影像平均(Image averaging)、(8)影像組合(Image composing)、(9)影像旋轉(Image rotation)、(10)影像反射(Image reflection)、(11)影像伸縮(Image resize)等，多屬點像素處理範圍。至於像素空間濾光(Spatial filtering)中諸如所謂(1)低度濾光(Low-pass filters，處理後影像比原來模糊、朦朧)處理、(2)高度濾光(High-pass filters處理後影像比原來尖銳、有層次)處理、(3)影像邊緣偵測(Prewitt gradient edge detection及Laplacian edge diction)等多屬面像素處理。 上述各項作業多包含(a)讀取像素資料，(b)像素顏色資料運算，(c)將處理過後顏色資料寫回原影像檔案，(d)顯示新影像，等四個主要步驟。VB NET雖提供有GetPixel()及SetPixel()之像素處理方法，其處理小圖幅影像是很直接、方便，但如要處理較大圖幅影像就顯得有些力不從心。要處理圖像之運算速度快，則位元資料之運算，就必須採用前面所介紹之Bitmap資料讀寫及運算觀念，進入記憶體中直接操作。VB NET`提供有記憶體位元鎖定方法(LockBits method)，可以在鎖住位元記憶體情況下(如不鎖住，則運算時位元位址會隨時改變，造成錯誤)優先處理程序，直接在記憶體作位元運算，作業完成後，再解除鎖定(UnlockBits)釋放資源，供其他程序使用。下面我們就介紹LockBits與UnlockBits的用法。 ' 鎖住點陣圖資料. Public Sub LockBitmap() '設定矩形Rect結構儲存陣圖資料 Dim Rect As Rectangle = New Rectangle( _ 0, 0, m_Bitmap.Width, m_Bitmap.Height) ' 鎖住點陣圖記憶體. m_BitmapData = m_Bitmap.LockBits(Rect, _ Imaging.ImageLockMode.ReadWrite, _ Imaging.PixelFormat.Format24bppRgb) RowSizeBytes = m_BitmapData.Stride
' 安排資料儲存陣列ImageBytes(). Dim total_size As Integer = m_BitmapData.Stride * m_BitmapData.Height ReDim ImageBytes(total_size)
' 複製點陣體資料至陣列ImageBytes(). Marshal.Copy(m_BitmapData.Scan0, ImageBytes, _ 0, total_size) End Sub
' 複製陣列資料回點陣列體並釋放資源 ' Public Sub UnlockBitmap() ' 複製陣列資料回點陣列. Dim total_size As Integer = m_BitmapData.Stride * m_BitmapData.Height Marshal.Copy(ImageBytes, 0, _ m_BitmapData.Scan0, total_size)
' 解除鎖定. m_Bitmap.UnlockBits(m_BitmapData)
' 釋放資源. ImageBytes = Nothing m_BitmapData = Nothing End Sub 下面為利用VB NET所提供之BitmapData類別，所編寫影像顏色互補(餘)之程序碼，此部份與前面所介紹之點陣圖資料讀寫相當類似。點陣圖資料在記憶體中儲存方式是一維度，而螢幕圖像顯示是二維度。 Public Function ImgComplement1D(ByVal Canvas As PictureBox) As Image Dim start_time As Date = Now Dim R As Byte, G As Byte, B As Byte Dim Width As Integer, Height As Integer Dim mBitmap As Bitmap
If OpenFileDialog1.ShowDialog = DialogResult.OK Then Try picOrg.Image = New Bitmap(OpenFileDialog1.FileName) mBitmap = New Bitmap(picOrg.Image)e) Width = mBitmap.Width '不要使用Canvas.Width Height = mBitmap.Height '不要使用Canvas.Height Dim rect As New Rectangle(0, 0, Width, Height) '以rect區域儲存BitmapData資料 Dim bmpData As BitmapData = mBitmap.LockBits(rect, ImageLockMode.ReadWrite, mBitmap.PixelFormat) Dim ptr As IntPtr = bmpData.Scan0 '得到第一個像素的指標位置 Dim bytes As Integer = bmpData.Stride * Height ListBox1.Items.Add("picbox.width= " & Canvas.Width) ListBox1.Items.Add("picbox.height= " & Canvas.Height) ListBox1.Items.Add("記憶體指標位置hex(scan0 )= " & Hex(CInt(bmpData.Scan0))) With bmpData ListBox1.Items.Add("bmpdata--------------") ListBox1.Items.Add(".Stride= " & .Stride) 'bmpData.Stride 物件分散寬度(掃瞄線寬度) ListBox1.Items.Add(".width= " & .Width) 'bmpData.Width 像素寬度(點陣圖像素寬度) ListBox1.Items.Add(".height= " & .Height) 'bmpData.Height 像素高度(點陣圖像素高度) ListBox1.Items.Add("hex(.PixelFormat)= " & Hex(.PixelFormat)) 'bmpData.PixelFormat 像素資訊格式 ListBox1.Items.Add("Totalbytes = " & bytes) ListBox1.Items.Add("mBitmap.width= " & mBitmap.Width) ListBox1.Items.Add("mBitmap.height= " & mBitmap.Height) ListBox1.Items.Add("mBitmap.HorizontalResolution= " & mBitmap.HorizontalResolution) ListBox1.Items.Add("mBitmap.VerticalResolution= " & mBitmap.VerticalResolution) ListBox1.Items.Add("dpp=(bmpData.Stride \ mBitmap.Width)= " & bmpData.Stride \ mBitmap.Width) ListBox1.Items.Add("JunkByte=(stride-dpp*mBitmap.width= " & (bmpData.Stride - (bmpData.Stride \ mBitmap.Width) * mBitmap.Width)) ListBox1.Items.Add("bmpdata--------------") End With Dim Bpx As Byte = bmpData.Stride \ mBitmap.Width '每一像素的位元組數(3或4) '位元運算 Dim st As String ‘*************************************************************************** ‘*************************************************************************** Dim rgbValues(bytes - 1) As Byte Marshal.Copy(ptr, rgbValues, 0, bytes) '將記憶體塊複製到陣列，這是本程序關鍵 '位元運算结束 Dim rgbA As Byte
For k As Integer = 0 To rgbValues.Length - Bpx Step Bpx '如需要寫出記憶體資料,可使用下列四行陳述句 '?st = "" '? st = st & Hex(rgbValues(k)) & " " & Hex(rgbValues(k + 1)) & " " & Hex(rgbValues(k + 2)) '?If Bpx = 4 Then st = st & " " & Hex(rgbValues(k + 3)) '?ListBox1.Items.Add(st)
B = CByte(255 - rgbValues(k)) G = CByte(255 - rgbValues(k + 1)) R = CByte(255 - rgbValues(k + 2)) rgbValues(k) = B rgbValues(k + 1) = G rgbValues(k + 2) = R If Bpx = 4 Then rgbA = rgbValues(k + 3) End If Next ‘‘*************************************************************************** ‘*************************************************************************** '位元運算结束 '將陣列複製到記憶體塊 Marshal.Copy(rgbValues, 0, ptr, bytes) '
mBitmap.UnlockBits(bmpData) Dim elapsed_time As TimeSpan = Now.Subtract(start_time) 'Lbltime.Text = elapsed_time.TotalSeconds.ToString("0.0000")
Catch ex As SystemException MsgBox(ex.Message, MsgBoxStyle.Critical) End Try
End If
Return mBitmap End Function 上述程式碼，像素顏色位元是一維度。如要改成二維度，或三維度只需將兩行星號(”*”)所包夾部份更改為： ‘‘*************************************************************************** ‘***************************************************************************
Dim rgbBVals(bmpData.Width - 1, bmpData.Height - 1), rgbGVals(bmpData.Width - 1, bmpData.Height - 1), rgbRVals(bmpData.Width - 1, bmpData.Height - 1) Dim rgbAVals(bmpData.Width - 1, bmpData.Height - 1)
For y As Integer = 0 To bmpData.Height - 1 pix = y * bmpData.Stride For x As Integer = 0 To bmpData.Width - 1 ' Blue component. rgbVals1D(pix) = CByte(255) - rgbVals1D(pix) rgbBVals(x, y) = rgbVals1D(pix) pix += 1 ' Green component. rgbVals1D(pix) = CByte(255) - rgbVals1D(pix) rgbGVals(x, y) = rgbVals1D(pix) pix += 1 ' Red component. rgbVals1D(pix) = CByte(255) - rgbVals1D(pix) rgbRVals(x, y) = rgbVals1D(pix) pix += 1 ' Reserved If Bpx = 4 Then 'ListBox1.Items.Add("rgb.reserved : " & Hex(rgbVals1D(pix))) rgbVals1D(pix) = rgbVals1D(pix) rgbAVals(x, y) = rgbVals1D(pix) pix += 1 End If Next x Next y ‘‘*************************************************************************** ‘*************************************************************************** Dim rgbVals3D(3, bmpData.Width - 1, bmpData.Height - 1) As Byte
For y As Integer = 0 To bmpData.Height - 1 pix = y * bmpData.Stride For x As Integer = 0 To bmpData.Width - 1 'If (x = bmpData.Width - 1) Then ListBox1.Items.Add("X,Y,V)" & x & ";" & y & ";" & rgbVals1D(pix)) ' Blue component. rgbVals1D(pix) = CByte(255) - rgbVals1D(pix) rgbVals3D(0, x, y) = rgbVals1D(pix) pix += 1 ' Green component. rgbVals1D(pix) = CByte(255) - rgbVals1D(pix) rgbVals3D(1, x, y) = rgbVals1D(pix) pix += 1 ' Red component. rgbVals1D(pix) = CByte(255) - rgbVals1D(pix) rgbVals3D(2, x, y) = rgbVals1D(pix) pix += 1 ' Reserved rgbVals1D(pix) = rgbVals1D(pix) rgbVals3D(3, x, y) = rgbVals1D(pix) pix += 1 Next x Next y
上述位元運算速度仍然以1D速度最快，2D與3D則速度差別不大。有關其他影像處理，諸如灰階(Grayscale)、亮度(Brightness)、平衡(Balance)等程式碼之編寫，可參本書光碟相關程式碼，或Rod Stephens 所著之Visual Basic(VB 6.0版) Grapics Programming書籍。下面我們再介紹幾個影像處理比較有趣之問題：(1)影像相減，(2)影像平均，(3)影像組合，(4)邊緣偵測(Edge Detection)之基本關觀念。
影像相減： 影像相減主要是利用影像向左、或(及)向右、或(及)向上、或(及)向下移動若干像素點後與原影像相同位置顏色值相減，則顏色值相同者，則其顏色值等於0或接近0；而物體邊緣附近，相減後顏色值絕對值大，因此造成反差效果。
'位元操作 For y As Integer = 1 To bmpData.Height - 2 For x As Integer = 1 To bmpData.Width - 2 Rr = 0 Gg = 0 Bb = 0 For i As Integer = -1 To 1 For j As Integer = -1 To 1 Bb = Bb + Math.Abs(CInt(rgbBVals(x + i, y + j)) - CInt(rgbBVals(x, y))) Gg = Gg + Math.Abs(CInt(rgbGVals(x + i, y + j)) - CInt(rgbGVals(x, y))) Rr = Rr + Math.Abs(CInt(rgbRVals(x + i, y + j)) - CInt(rgbRVals(x, y))) Next j Next i If Rr < 0 Then Rr = 0 If Rr > 255 Then Rr = 255 If Gg < 0 Then Gg = 0 If Gg > 255 Then Gg = 255 If Bb < 0 Then Bb = 0 If Bb > 255 Then Bb = 255
rgbRValsNew(x, y) = CByte(Rr) rgbGValsNew(x, y) = CByte(Gg) rgbBValsNew(x, y) = CByte(Bb) If Bpx = 4 Then rgbAValsNew(x, y) = rgbAVals(x, y) End If
Next x Next y
影像平均： 影像平均主要是在消除或減少圖像之顏色錯雜(Noise)現象，其係利用同一場景之多幅影像，求其顏色平均值。程序碼寫法與點處理之顏色灰階處理相當類似，差別在一個是單幅影像點R、G、B三種顏色綜合平均；一個是多幅影像點R、G、B三顏色各別平均。
影像組合： 影像組合主要是將兩幅不同的影像，各取一部份後組合而成的。影像組合之重點，是如何有效消除前景影像邊緣的像素，儘量使其模糊，讓組合後影像兩者合為一。下面是影像組合的片段程式碼。
'前景圖影像 For Y = 1 To frbmpData.Height - 2 For X = 1 To frbmpData.Width - 2 ' 確認遮罩像素顏色是否透明See if the mask pixel is transparent. is_transparent = ( _ (frrgbRVals(X, Y) = transparent_r) And _ (frrgbGVals(X, Y) = transparent_g) And _ (frrgbBVals(X, Y) = transparent_b))
If is_transparent Then ' The foreground pixel's transparent. ' Just use the background pixel color. '如果"是"則使用背景像素顏色 rtrgbRVals(X, Y) = bkrgbRVals(X, Y) rtrgbGVals(X, Y) = bkrgbGVals(X, Y) rtrgbBVals(X, Y) = bkrgbBVals(X, Y) If frBpx = 4 And bkBpx = 4 Then rtrgbAVals(X, Y) = bkrgbAVals(X, Y) End If
Else ' Use a weighted average of the ' foreground and background pixels.
' See how many adjacent pixels are transparent. '如果"不是"則使用背景及前景像素顏色平均值 num_transparent = 0 For i = -1 To 1 For j = -1 To 1 If (frrgbRVals(X + i, Y + j) = transparent_r) And _ (frrgbGVals(X + i, Y + j) = transparent_g) And _ (frrgbBVals(X + i, Y + j) = transparent_b) _ Then num_transparent = num_transparent + 1 End If Next j Next i
' 選取顏色Pick the color. background_fraction = num_transparent / 9.0# foreground_fraction = 1.0# - background_fraction 'With result_pixels(X, Y) rtrgbRVals(X, Y) = foreground_fraction * frrgbRVals(X, Y) + _ background_fraction * bkrgbRVals(X, Y) rtrgbGVals(X, Y) = foreground_fraction * frrgbGVals(X, Y) + _ background_fraction * bkrgbGVals(X, Y) rtrgbBVals(X, Y) = foreground_fraction * frrgbBVals(X, Y) + _ background_fraction * bkrgbBVals(X, Y) If frBpx = 4 And bkBpx = 4 Then rtrgbAVals(X, Y) = frrgbAVals(X, Y) End If 'End With End If Next X Next Y
' 複製背景邊緣像素Copy the background edge pixels. For Y = 0 To frbmpData.Height - 1 'PicForeground.ScaleHeight - 1 rtrgbRVals(0, Y) = bkrgbRVals(0, Y) rtrgbGVals(0, Y) = bkrgbGVals(0, Y) rtrgbBVals(0, Y) = bkrgbBVals(0, Y) rtrgbRVals(frbmpData.Width - 1, Y) = bkrgbRVals(frbmpData.Width - 1, Y) rtrgbGVals(frbmpData.Width - 1, Y) = bkrgbGVals(frbmpData.Width - 1, Y) rtrgbBVals(frbmpData.Width - 1, Y) = bkrgbBVals(frbmpData.Width - 1, Y) If frBpx = 4 And bkBpx = 4 Then rtrgbAVals(0, Y) = bkrgbAVals(0, Y) rtrgbAVals(frbmpData.Width - 1, Y) = bkrgbAVals(frbmpData.Width - 1, Y) End If Next Y For X = 0 To frbmpData.Width - 1 rtrgbRVals(X, 0) = bkrgbRVals(X, 0) rtrgbGVals(X, 0) = bkrgbGVals(X, 0) rtrgbBVals(X, 0) = bkrgbBVals(X, 0) rtrgbRVals(X, frbmpData.Height - 1) = bkrgbRVals(X, frbmpData.Height - 1) rtrgbGVals(X, frbmpData.Height - 1) = bkrgbGVals(X, frbmpData.Height - 1) rtrgbBVals(X, frbmpData.Height - 1) = bkrgbBVals(X, frbmpData.Height - 1) If frBpx = 4 And bkBpx = 4 Then rtrgbAVals(X, 0) = bkrgbAVals(X, 0) rtrgbAVals(X, frbmpData.Height - 1) = bkrgbAVals(X, frbmpData.Height - 1) End If Next X
空間濾光： 空間濾光主要是以像素點為中心，求其周圍方形像素點顏色的權重平均值。一般方形像素點顏色的權重大小，多以陣列(如Kernel())來表示。如下面之Kernel()為權 值均等者。
使用不同之Kernel陣列值運算，會產生不同的影像成果。如下面之Kernel陣列為低度濾光(Low-pass filters)
而
則屬高度濾光(High-pass filters)者。兩者權重總和均為1，但效果完全不同。前者各相鄰之像素點與中心點顏色權值均為正，且權值差小1；後者則除中心點為正外，權值均為負，權值差絕對值遠大於1。下面兩張圖片為利用濾光處理後之照片，上一張為低度濾光，看起來比較模糊；下一張為高度濾光，看起來比較清清楚、尖銳。
邊緣偵測： Prewitt漸變型邊緣偵測利用特定方向(如由東南至西北，或由東至西)，需要偵測方向之Kernel()權值為正，另一端為負。Lapalcian邊緣偵測則使用對稱型Kernel()權值。下兩張圖中，上面為Prewitt漸變型邊緣偵測(東至西)，下面一張為Lapalcian邊緣偵測後成果影像。有關其他濾光處理之程式碼編寫，請參考本書附贈光諜。
在下面我們另介紹有關影像變形，諸如(1)魚眼(Fish eye)，(2)扭曲(Twist)，(3)上部縮小(Small top)，(4)蠕動(Wiggle)，(5)波浪(Wave)，(6)霜波浪(Double wave) 等特殊效果處理。特效處理係利用線性轉換之技巧，將輸入之像素資料座標經過轉換後，以轉換後反推求原輸入座標。以下面之轉換方程式為例，轉換後x值不變，y座標轉換後為原座標加( 10 * (Sin(ix_in/ 50 * PI) + 1) + 5)。此處( 10 * (Sin(ix_in/ 50 * PI) + 1) + 5)為正弦曲線。 ix_out= x_in iy_out =y_in +(10 * (Sin(ix_in/ 50 * PI) + 1) + 5) 解x_in，y_in後得： x_in = ix_out y_in = iy_out - 10 * (Sin(ix_out / 50 * PI) + 1) + 5 此轉換方程式就可作為原圖像正弦曲線(波浪形曲線)特效處理之基準方程式。圖形像素因轉換所造成之間隙空白像素，則以內插法填補。
影像旋轉： 影像旋轉主要是在讀取影像資料後，將各像素點座標以影像中心作旋轉轉換，然後由旋轉座標計算出各點之顏色值，如旋轉後座標點超出原有影像界限，則將其設定為白色或原有影像之背景色。下面為影像旋轉之片刻程式碼：
For iyInput = 0 To bmpData.Height - 1 For ixInput = 0 To bmpData.Width – 1 ' 計算旋轉後像素座標 dx = ixInput - CxOut dy = iyInput - CyOut radius = Sqrt(dx * dx + dy * dy) theta = Atan2(dy, dx) xOutput = CxIn + radius * Cos(theta + angle * 3.14159 / 180) yOutput = CyIn + radius * Sin(theta + angle * 3.14159 / 180) ixOutput = Int(xOutput) iyOutput = Int(yOutput) ' 計算是否超出界限 If (ixOutput >= 0) And (ixOutput < xmaxOutput) And _ (iyOutput >= 0) And (iyOutput < ymaxOutput) _ Then '計算界限內像素顏色值 dx1 = xOutput - ixOutput dy1 = yOutput - iyOutput dx2 = 1.0# - dx1 dy2 = 1.0# - dy1 ' '紅色成份 v11 = inputRgbRvals(ixOutput, iyOutput) v12 = inputRgbRvals(ixOutput, iyOutput + 1) v21 = inputRgbRvals(ixOutput + 1, iyOutput) v22 = inputRgbRvals(ixOutput + 1, iyOutput + 1) tpt = v11 * dx2 * dy2 + v12 * dx2 * dy1 + _ v21 * dx1 * dy2 + v22 * dx1 * dy1 If tpt >= 255 Then tpt = 255 If tpt <= 0 Then tpt = 0 outputRgbRvals(ixInput, iyInput) = CByte(tpt) '綠色成份 v11 = inputRgbGvals(ixOutput, iyOutput) v12 = inputRgbGvals(ixOutput, iyOutput + 1) v21 = inputRgbGvals(ixOutput + 1, iyOutput) v22 = inputRgbGvals(ixOutput + 1, iyOutput + 1) tpt = v11 * dx2 * dy2 + v12 * dx2 * dy1 + _ v21 * dx1 * dy2 + v22 * dx1 * dy1 If tpt >= 255 Then tpt = 255 If tpt <= 0 Then tpt = 0 outputRgbGvals(ixInput, iyInput) = CByte(tpt) '籃色成份 v11 = inputRgbBvals(ixOutput, iyOutput) v12 = inputRgbBvals(ixOutput, iyOutput + 1) v21 = inputRgbBvals(ixOutput + 1, iyOutput) v22 = inputRgbBvals(ixOutput + 1, iyOutput + 1) tpt = v11 * dx2 * dy2 + v12 * dx2 * dy1 + _ v21 * dx1 * dy2 + v22 * dx1 * dy1 If tpt >= 255 Then tpt = 255 If tpt <= 0 Then tpt = 0 outputRgbBvals(ixInput, iyInput) = CByte(tpt) If bpx = 4 Then outputRgbAvals(ixInput, iyInput) = 255 End If Else '界限外設定為白色或背景色 outputRgbRvals(ixInput, iyInput) = whiteRgbRVals outputRgbGvals(ixInput, iyInput) = whiteRgbGVals outputRgbBvals(ixInput, iyInput) = whiteRgbBVals If bpx = 4 Then outputRgbAvals(ixInput, iyInput) = whiteRgbAVals End If End If Next ixInput Next iyInput
影像反射： 影像反射主要是在讀取影像資料後，將各像素點座標依以任意直線為基準作反(鏡)射轉換，然後由反射座標計算出各點之顏色值，如反射後座標點超出原有影像界限，則將其設定為白色或原有影像之背景色。有關影像反射旋轉之程式碼因與影像旋轉非常相似，有興趣讀者，請參閱附贈光碟。
影像伸縮： 影像伸縮主要是利用調整圖形方塊的尺寸大小將原有影像放大或縮小，然後利用DrawImage複製影像。
' 取得原有影像點陣圖Get the source Bitmap. Dim tscale As Single = Val(txtResizescale.Text) Dim anti_alias As Boolean = True Dim mbitmap As Bitmap If OpenFileDialog1.ShowDialog = DialogResult.OK Then mbitmap = New Bitmap(OpenFileDialog1.FileName) PicInput.Image = mbitmap End If ' 設定伸縮影像圖形方塊尺寸大小 Dim wid As Integer = CInt(PicInput.Width * tScale) Dim hgt As Integer = CInt(PicInput.Height * tScale) Dim rBitmap As New Bitmap(wid, hgt) '複製影像 Dim gr As Graphics = Graphics.FromImage(rBitmap) If anti_alias Then gr.InterpolationMode = Drawing2D.InterpolationMode.HighQualityBilinear gr.SmoothingMode = Drawing2D.SmoothingMode.AntiAlias gr.DrawImage(mbitmap, 0, 0, wid - 1, hgt - 1) ' 顯示影像 PicOutput.Image = rBitmap
局部像素操作: 局部像素操作，係利用在讀取點陣圖資料後，擷取部份像素顏色資料，然後針對此部份像素顏色資料作像素運算(如灰階、互補、平均、對比、亮度等處理)，或任意形狀挖空、局部擷取及剪貼等處理。上述像素運算只需在記憶體直接作業，舉例來說，我們希望在影像座標位置(50,50)處，半徑30範圍內作灰階處理灰階，則利用下面之片段程式碼就能做到。
For Y = 0 To bmpData.Height - 1 pix = Y * bmpData.Stride For X = 0 To bmpData.Width - 1
' Blue component. If ((CSng(X) - xcen) ^ 2 + (CSng(Y) - ycen) ^ 2 - Rad ^ 2) >= 0.1 Then outputRgbBvals(X, Y) = inputrgbVals1D(pix) Else outputRgbBvals(X, Y) = 255 - inputrgbVals1D(pix) End If pix += 1 ' Green component. If ((CSng(X) - xcen) ^ 2 + (CSng(Y) - ycen) ^ 2 - Rad ^ 2) >= 0.1 Then outputRgbGvals(X, Y) = inputrgbVals1D(pix) Else outputRgbGvals(X, Y) = 255 - inputrgbVals1D(pix) End If pix += 1 ' Red component. If ((CSng(X) - xcen) ^ 2 + (CSng(Y) - ycen) ^ 2 - Rad ^ 2) >= 0.1 Then outputRgbRvals(X, Y) = inputrgbVals1D(pix) Else outputRgbRvals(X, Y) = 255 - inputrgbVals1D(pix) End If pix += 1 ' Reserved If bpx = 4 Then outputRgbAvals(X, Y) = inputrgbVals1D(pix) pix += 1 End If
Next X Next Y End If
至於任意形狀挖空、局部擷取及剪帖等處理，則須將計畫處理之範圍內像素資 料座標位置及顏色資料，另外儲存備用。然後再對此座標位置及顏色資料作運算處理。下圖為局部擷取及灰階後，複製至另外一個圖形方塊的成果圖示。
VB.NET中可使用Graphics類別的DrawImage局部方法顯示圖形檔，在不同時間間隔，不同的位置顯示同一圖形檔會產生視覺上的動畫效果。DrawImage方法可指定目的繪圖區，也可指定來源圖片的顯示範圍，故具備有自動縮放功能，會自動將圖片放大或縮小以填充指定的整個繪圖區域，下面為30種中較用之幾種語法：
DrawImage(Image物件，x,y) DrawImage(Image物件，Point結構) DrawImage(Image物件，目的Rectangle結構) DrawImage(Image物件，x,y，來源Rectangle結構，圖形單位) DrawImage(Image物件，目的Rectangle結構，來源Rectangle結構，圖形單位)
下面為利用DrawImage方法所製作的簡單動畫小精靈，藉四個有不同的開口橢圓，二個小圓代表小精靈口中小虫及眼睛，利用計時器每100毫秒以改變小精靈位置(x.y值)產生動畫效果。
'首先在Form1類中定義變數，程序螞如下。 Dim iRepeat As Integer Dim x, y, wid, ht As Integer Dim angBeg(3) As Integer Dim angEnd(3) As Integer Dim gp As Graphics Dim ncount As Integer = 0
'Form1的Load事件編寫程序螞，設置初始值，程序螞如下所示。 Private Sub Form1_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load gp = PicCanvas.CreateGraphics x = PicCanvas.Width - 10 : y = 10 : wid = 55 : ht = 50 '開始時小精靈位置 angBeg(0) = 130 '第一個圖的起始角度 angEnd(0) = -250 '第一個圖的結束角度 angBeg(1) = 150 '第二個圖的起始角度 angEnd(1) = -280 '第三個圖的結束角度 angBeg(2) = 180 '第三個圖的起始角度 angEnd(2) = -315 '第三個圖的結束角度 angBeg(3) = 200 '第四個圖的起始角度 angEnd(3) = -350 '第四個圖的結束角度 iRepeat = 0 Timer1.Enabled = False End Sub
'為Timer控制項的Tick事件編寫程序碼，在不同的時間間隔裏於不會位置繪製不同缺口的扇形，並且一直從右往左迴圈運動直到停止運行
Private Sub Timer1_Tick(ByVal sender As Object, ByVal e As System.EventArgs) Handles Timer1.Tick gp.Clear(PicCanvas.BackColor) gp.FillEllipse(Brushes.Red, x + 10, y + 15, 10, 10) '小精靈口中飛行小虫 gp.FillPie(Brushes.Green, x, y, wid, ht, angBeg(iRepeat), angEnd(iRepeat)) gp.FillEllipse(Brushes.White, x + 35, y + 18, 10, 10) '小精靈眼睛 iRepeat = iRepeat + 1 If iRepeat > 3 Then iRepeat = 0 x = x - 10 '變化座標位置 y = y + ncount * 2 If x < 10 Then x = PicCanvas.Width - 10 ncount = ncount + 1 End If If y > PicCanvas.Height - 30 Then y = 10 ncount = 0 End If End Sub
21.5.4線性轉換 我們在本書第一章就介紹過線性方程組及矩陣的觀念，如您對數學不怎麼感興趣，也沒關係。在GDI+程式中，您可以把它當作是一般物件，可以像其他物件一樣使用它們的屬性和方法。VB .NET提供有Multiply、Rotate、RotateAt、Scale、Shear 和 Translate等矩陣方法。VB .NET用來表示仿射轉換的矩陣第三個資料行(Column)永遠為 (0, 0, 1)，因此在建立 Matrix 物件時，您只需要指定前兩個資料行中的六個數字。使用Matrix物件第一件事就是建立Matrix物件後方能作線性轉換，有時候，在真實的程式世界裡，我們可能需要計算轉換矩陣中各別元素。如下面的片段程式：
Dim
myMatrix As Matrix = New Matrix(1, 0, 0, 2, 0, 0)
‘六個數字所代表的矩陣
’建立一個畫圖物件，及一個黑色矩形 Dim Rect As Rectangle = New Rectangle(20, 20, 40, 60) Gp.DrawRectangle(Pens.Black, Rect) ’以myMatrix為引數，作為矩陣之線性轉換 Gp.MultiplyTransform(myMatrix, MatrixOrder.Append) Gp.DrawRectangle(Pens.Orange, Rect)
我們必須再考慮座標系統的觀念，在GDI+畫圖作業中，世界系統座標(world coordinates)必須轉換成頁面座標(page coordinates)，然後轉換成設備座標(device coordinates)。上述的MultiplyTransform矩陣方法只是對畫圖物件進行轉換而非對矩形作轉換。另一方面，我們必須考慮到，矩陣轉換次序，在一般數學運算A *B與B *A是相等的。但對矩陣之運算，次序是很重要，如下面之運算
gp.TranslateTransform(-70, 35, MatrixOrder.Append) gp.RotateTransform(30, MatrixOrder.Append) gp.TranslateTransform(186, 75, MatrixOrder.Append) gp.ScaleTransform(2.25F, 0.5F, MatrixOrder.Append)
與
gp.TranslateTransform(-70, 35, MatrixOrder.Prepend) gp.RotateTransform(30, MatrixOrder.Prepend) gp.TranslateTransform(186, 75, MatrixOrder.Prepend) gp.ScaleTransform(2.25F, 0.5F, MatrixOrder.Prepend)
矩陣轉換有所謂區域轉換及全域轉換兩種，全域轉換會套用至特定Graphics物件繪製的所有項目；相對地，區域轉換只套用至要繪製的特定項目。 如果要建立全域轉換，應先建構Graphics物件，然後管理Transform屬性。Transform 屬性是一個 Matrix 物件，因此它可以存放仿射轉換的任何序列。儲存在Transform屬性的轉換又稱為全局轉換。Graphics類別提供幾個方法，用來建置複合的全局轉換：MultiplyTransform、RotateTransform、ScaleTransform和TranslateTransform。下列範例會繪製兩次橢圓形：一次是在建立全局轉換之前，一次是在建立之後。轉換會先在Y方向縮放0.75個單位，然後在X方向平移40個單位，然後再旋轉45度。
Dim gp As Graphics = PictureBox1.CreateGraphics '建立畫圖物件 gp.DrawEllipse(myPen, 0, 0, 100, 50) '畫橢圓 gp.ScaleTransform(1, 0.75F) '比例縮放 gp.TranslateTransform(40, 0, MatrixOrder.Append) '平移 gp.RotateTransform(45, MatrixOrder.Append) '旋轉 gp.DrawEllipse(myPen, 0, 0, 100, 50) '線性轉換後畫橢圓
區域轉換會套用至要繪製的特定項目，如GraphicsPath物件的Transform方法可用來轉換該路徑的資料點 (Data Point)。下列範例繪製未轉換的矩形和經過旋轉和轉換的路徑(假設沒有全局轉換)。
Dim gp As Graphics = PictureBox1.CreateGraphics '建立畫圖物件 Dim myGraphicsPath As New GraphicsPath '建立畫圖路徑 Dim myMatrix As New Matrix() '建立矩陣物件 gp.DrawRectangle(Pens.Blue, 50, 50, 100, 150) myGraphicsPath.AddLine(150, 200, 250, 250) gp.DrawPath(Pens.Green, myGraphicsPath) myMatrix.Rotate(30) gp.Transform = myMatrix '繞座標原點旋轉 myGraphicsPath.Transform(myMatrix) '觀察有無加本列後圖形變化 gp.DrawRectangle(Pens.Red, 50, 50, 100, 150) myGraphicsPath.AddLine(150, 200, 250, 250) gp.DrawPath(Pens.Gray, myGraphicsPath)
您可以使用全局轉換來改變座標系統，並可使用區域轉換來旋轉和縮放新座標系統所繪製的物件。假設您想要使用一個座標系統，其原點距離工作區左邊緣200像素和工作區頂端100像素處。現在您想使用像素做為度量單位，其x軸指向右方為正，y軸朝上為正(預設座標系統的y軸朝下)，因此您必須在水平軸執行反射。下面為座標反射的矩陣片段程式碼。
Dim gp As Graphics = PictureBox1.CreateGraphics '建立畫圖物件 '全局轉換 Dim myMatrix As New Matrix(1, 0, 0, -1, 0, 0) '反射矩陣係數 gp.Transform = myMatrix ' gp.TranslateTransform(100, 150, MatrixOrder.Append) '平移 ListBox1.Items.Add("反射及平移後矩陣係數myMatrix") For Each TransformElement As Single In gp.Transform.Elements ListBox1.Items.Add(TransformElement) ‘輸出轉換矩陣係數 Next '建立路徑. Dim myGraphicsPath As New GraphicsPath() Dim myRectangle As New Rectangle(0, 0, 80, 60) myGraphicsPath.AddRectangle(myRectangle) ' 填充路徑(反射新座標系統),無區域轉換 Dim mySolidBrush = New SolidBrush(Color.Green) gp.FillPath(mySolidBrush, myGraphicsPath) ' 在GraphicsPath物件設定區域轉換. Dim myPathMatrix As New Matrix() myPathMatrix.Scale(2, 1) myPathMatrix.Rotate(30, MatrixOrder.Append) myGraphicsPath.Transform(myPathMatrix) ' 填充路徑(反射新座標系統),有區域轉換. gp.FillPath(New SolidBrush(Color.Blue), myGraphicsPath) gp.Transform.Reset() '線性轉換歸零 gp.Dispose() Dim gp1 As Graphics = PictureBox1.CreateGraphics '建立畫圖物件 gp1.TranslateTransform(100, 150, MatrixOrder.Append) '平移 ListBox1.Items.Add("") ListBox1.Items.Add("僅平移後矩陣係數myMatrix") For Each TransformElement As Single In gp1.Transform.Elements ListBox1.Items.Add(TransformElement) ‘輸出轉換矩陣係數 Next Dim myGraphicsPath1 As New GraphicsPath() Dim myRectangle1 As New Rectangle(0, 0, 80, 60) myGraphicsPath1.AddRectangle(myRectangle1) ' 填充路徑(無反射,原座標系統),無區域轉換 Dim mySolidBrush2 = New SolidBrush(Color.Yellow) gp1.FillPath(mySolidBrush2, myGraphicsPath) '未反射 gp1.Dispose()
下圖為執行後之成果畫面，圖中黃色為座標未作反射僅平移之原圖形，籃色部份為使用新座標系統且有區域轉換者；綠色部份則為使用新座標系統但無有區域轉換者。
如果需要寫出矩陣資料可以使用類似下列程式碼：
For Each TransformElement As Single In GraphicObj.Transform.Elements Debug.WriteLine(TransformElement) ‘輸出轉換矩陣係數 Next
21.6橡皮筋線製作 在Vb .0及更早版本，繪製橡皮筋線是相當簡單及直接的，您可以將DrawMode設定等於6(DrawMode=6，即DrawMode=vbInvert)畫一條線，然後在原位置再重畫一次就可以將原來直線塗抹掉。此利用一個像素顏色之反向再反向為原來顏色之觀念。基於某些理由VB .Net並沒有反向模式概念，因此畫橡皮筋線，您需要建立一個Bitmap陣列圖物件(一個虛擬緩衝暫存區)來代表及儲存圖像(image)。在表單(Form)或圖形方塊(PicctureBox)上畫線然後塗抹掉，複製儲存在Bitmap 陣列圖物件中的圖像至表單(圖形方塊)上。
MouseDown()程序事件中，其主要工作有： (1)呼叫副程式SaveSnapshot(儲存快照)儲存變數m_X1、m_Y1、 m_X2及m_Y2的位置座標，SaveSnapshot建立一個新Bitmap陣列圖並用它來建立一個附著於此Bitmap之畫圖物件。為了讓讀者能瞭解電腦實際運作方式，特別將其編寫成比較直接易懂方式，並額外安排LblMDxy1及LblMDxy2兩個標籤控制項分別記錄m_X1、m_Y1及 m_X2、m_Y2座標位置變化。 (2)開始處理程序時，按下滑鼠左鈕時將m_Drawing布林值設定為真(True)，在m_Drawing=False時，自動跳出MouseDown事件程序。在此也安排Lbldrawing控制項以觀察m_Drawing變化情況。 (3)儲存上一階段已完成之舊圖元(如果有的話)
MouseMove()程序事件，主要功能為： (1) 當user按下滑鼠左鈕並移動滑鼠時，儲存移動新點座標m_X2、m_Y2位置，MouseMove事件物件識別碼(MouseMove event handler)。 (2) 呼叫副程式DrawForm(或DrawPic)以塗抹掉畫在表單(或圖形方塊)上前畫好之直線塗抹掉 (3) 然後利用DrawLine方法在表單上(或圖形方塊)畫線(不是在Bitmap上直接畫線)，因此Bitmap上並無此直線。下一回User移動滑鼠，MouseMove事件物件識別碼呼叫DrawForm(或DrawPic)，則Bitmap顯示並無此新線。副程式DrawForm(或DrawPic)只用DrawImage將其儲存在Bitmap的已畫好的圖元在表單(或圖形方塊)上顯示。
MouseUp()程序事件，主要功能為：
當User放開滑鼠左鈕時，通知電腦m_Drawing變更為False，MouseUp事件物件識別碼，儲存Bitmap中最後一條直線(以DrawLine方法所畫出者)，再呼叫DrawForm 顯示畫有新線的bitmap。 Pic_Paint()事件程序中Pic_Paint event handle，因為VB .NET沒有AutoRedraw屬性，因此user想在表單或圖形方塊被全部或部份覆蓋再恢復出露時，User必須自行處理，此Pic_Paint event handler呼叫DrawPictureBox顯示儲存在bitmap上點陣圖。
' 畫新線時m_Drawing 布林值為真True Private m_Drawing As Boolean ' 暫存緩衝區Buffer以抹掉橡皮筋線. Private m_BufferBitmap As Bitmap '暫存緩衝區Bitmap Private m_BufferGraphics As Graphics '暫存緩衝區畫圖物件 ' 滑鼠位置座標. Private m_X1 As Integer Private m_Y1 As Integer Private m_X2 As Integer Private m_Y2 As Integer '儲存檔案 Dim Filename As String
'開始畫橡皮筋線. Private Sub picDraw_MouseDown(ByVal sender As Object, ByVal e _ As System.Windows.Forms.MouseEventArgs) Handles _ PicDraw.MouseDown ' 儲存圖形方塊快照 SavePicSnapshot() '儲存快照,無此陳述句不會塗抹掉舊橡皮筋線 m_Drawing = True '開始畫圖 ' 如果非使用到滑鼠左鈕就退出. If e.Button <> MouseButtons.Left Then Exit Sub If e.Button = MouseButtons.Left Then m_Drawing = True '相當於m_Drawing = True ' 儲存滑鼠目前位置. m_X1 = e.X '在 picDraw_MouseDown中直線起終點保持不變 m_X2 = e.X m_Y1 = e.Y m_Y2 = e.Y LblMDxy1.Text = "x= " & m_X1 & "y= " & m_Y1 '多餘控制項可移除 LblMDxy2.Text = "x= " & m_X2 & "y= " & m_Y2 '多餘控制項可移除 LblMD_m_Drawing.Text = m_Drawing '多餘控制項可移除 End Sub
Private Sub SavePicSnapshot() Dim new_bitmap As Bitmap
' 建立等於圖形方塊尺寸的點陣圖. new_bitmap = New Bitmap(PicDraw.Size.Width, PicDraw.Size.Height, _ PicDraw.CreateGraphics()) m_BufferGraphics = Graphics.FromImage(new_bitmap)
' 清理新點陣圖. m_BufferGraphics.Clear(PicDraw.BackColor) ' 複製現存點陣圖內容到新點陣圖 If Not (m_BufferBitmap Is Nothing) Then m_BufferGraphics.DrawImage(m_BufferBitmap, 0, 0) End If
' 儲存新點陣圖及畫圖物件. m_BufferBitmap = new_bitmap ' PicDraw.Image = new_bitmap '將緩衝區圖檔寫入圖形方塊,如無此指令,儲存圖檔再載入時,另繪新圖元時,載入圖元消失 End Sub ' 繼續繪製橡皮筋線. Private Sub picDraw_MouseMove(ByVal sender As Object, ByVal e _ As System.Windows.Forms.MouseEventArgs) Handles _ PicDraw.MouseMove lblxy.Text = " 現在滑鼠x = " & e.X & ";y = " & e.Y If m_Drawing = False Then Exit Sub 'm_Drawing=false跳出 If e.Button = MouseButtons.Left Then '多餘指令 ' 儲存新點. m_X2 = e.X m_Y2 = e.Y
' 塗抹掉前一條線. DrawPictureBox(PicDraw.CreateGraphics())
'在圖形方塊上直接繪製新線 PicDraw.CreateGraphics().DrawLine( _ Pens.Gray, m_X1, m_Y1, m_X2, m_Y2) LblMMxy1.Text = "x= " & m_X1 & "y= " & m_Y1 '多餘控制項可移除 LblMMxy2.Text = "x= " & m_X2 & "y= " & m_Y2 '多餘控制項可移除 LblMM_m_Drawing.Text = m_Drawing '多餘控制項可移除 End If '多餘指令 End Sub
'完成新直線. Private Sub picDraw_MouseUp(ByVal sender As Object, ByVal e _ As System.Windows.Forms.MouseEventArgs) Handles _ PicDraw.MouseUp 'm_Drawing=Fales退出 If m_Drawing = False Then Exit Sub 'm_Drawing=Fales退出 If e.Button = Windows.Forms.MouseButtons.Left Then m_Drawing = False '鬆開左鈕時m_Drawing = False; 相當於m_Drawing = false ' 儲存新點. m_X2 = e.X m_Y2 = e.Y
' 在緩衝區繪永久直線. m_BufferGraphics.DrawLine( _ Pens.Red, m_X1, m_Y1, m_X2, m_Y2)
' 在圖形方塊上重繪新線Redraw to show the new line. DrawPictureBox(PicDraw.CreateGraphics()) '請測試無此指令時,有否變化 LblMuxy1.Text = "x= " & m_X1 & "y= " & m_Y1 '多餘控制項可移除 LblMuxy2.Text = "x= " & m_X2 & "y= " & m_Y2 '多餘控制項可移除 LblMU_m_Drawing.Text = m_Drawing '多餘控制項可移除 End Sub
' 重繪圖形方塊Redraw the PictureBox Private Sub picDraw_Paint(ByVal sender As Object, ByVal e As _ System.Windows.Forms.PaintEventArgs) Handles _ PicDraw.Paint DrawPictureBox(e.Graphics) End Sub ' 重繪已儲存在緩衝區的圖形至圖形方塊. Private Sub DrawPictureBox(ByVal gr As Graphics) If Not (m_BufferBitmap Is Nothing) Then 'm_BufferBitmap有圖元時,重繪已儲存在緩衝區的圖形至圖形方塊 Dim gp As Graphics = PicDraw.CreateGraphics gp.DrawImage(m_BufferBitmap, 0, 0) '無此陳述句舊橡皮筋線不會塗抹掉
End If End Sub
上面所介面的僅是一般直線橡皮筋線畫法，其他諸如圓、圓弧、橢圓、橢圓弧、多重線、多邊形、矩形等橡皮筋線畫法，則另闢專章討論。
Dim bmp As Bitmap ‘FormLoad 中 Dim gp As Graphics = Graphics.FromImage(PicDraw.Image) gp.Clear(PicDraw.BackColor) bmp = New Bitmap(PicDraw.Image) End sub
Mouse_Move程序中 Case "Move", "Copy" Select Case npt Case 0 tLine.pt0 = visPoint tLine.pt1 = visPoint
Case 1 tLine.pt1 = visPoint dx = tLine.pt1.X - tLine.pt0.X dy = tLine.pt1.Y - tLine.pt0.Y tLine.mPen = defaultCadpen Dim bmpf As New Bitmap(bmp) DrawMoveSelection(bmpf, PicDraw, DrawGeo, cView, Selection, dx, dy, False) PicDraw.Image = bmpf End Select End Sub
Mouse_Up程序中
Case "Move", "Copy" '新加 If e.Button = Windows.Forms.MouseButtons.Left Then Dim bmpf As New Bitmap(bmp) Select Case npt Case 0 'DrawCadLine(picdraw, tptLine, glPenDr) tLine.pt0 = visPoint 'PtsKM(NptsKM).x tLine.pt1 = visPoint 'tline.pt0 npt = npt + 1 DrawCadline(PicDraw, tLine) '此部份會影響直線是否由0,0畫起
Case 1 tLine.pt1 = visPoint dx = tLine.pt1.X - tLine.pt0.X dy = tLine.pt1.Y - tLine.pt0.Y
npt = 0 '停止佈點 isDraw = False '停止佈點 'For i As Integer = 0 To UBound(Selection) 'MsgBox("selection.type= " & Selection(i).Type) ' Next For i = 0 To UBound(DrawGeo) Call DrawMoveSelection(bmpf, PicDraw, DrawGeo, i, Selection, dx, dy, True) '上面陳述句僅畫圖未改變記憶體內容 If tCommand = "Copy" Then MoveSelection(DrawGeo(i), Selection, dx, dy, True) '改變記憶體內容 Else MoveSelection(DrawGeo(i), Selection, dx, dy, False) End If Next i RedrawBoth(bmpf, PicDraw) SelectionReStart() bmp = New Bitmap(PicDraw.Image) '更新底圖 End Select End If End sub VB_VB NET: chday169
|
上次修改此網站的日期： 2018年11月25日
.files/image001.gif){kind=small}
.files/image003.jpg)
.files/image005.jpg)
.files/image007.jpg)
.files/image009.jpg)
.files/image011.jpg)
.files/image013.jpg)
.files/image015.jpg)
.files/image017.jpg)
.files/image019.jpg)
.files/image020.gif)
.files/image022.jpg)
.files/image025.jpg)
.files/image027.jpg)
.files/image029.jpg)
.files/image031.jpg)
.files/image033.jpg)
.files/image035.jpg)
.files/image037.jpg)
.files/image039.jpg)
.files/image041.jpg)
.files/image043.jpg)
.files/image045.jpg)
.files/image047.jpg)
.files/image049.jpg)
.files/image051.jpg)