Transcript 課程投影片2(102.2.18)

第 6 章 多媒體
ScrollBar
 屬性





Value
Maximum (defalut=100)
Minimum (defalut=0)
SmallChange(default=1) ‘微動鈕
LargeChange(default=10) ‘快動區
Private Sub HScrollBar1_Scroll(ByVal……..) Handles HScrollBar1.Scroll
Dim temp As Integer
temp = 376
PictureBox10.Width = temp * HScrollBar1.Value / 100
End Sub
Private Sub VScrollBar1_Scroll(ByVal………) Handles VScrollBar1.Scroll
Dim temp As Integer
temp = 261
PictureBox10.Height = temp * VScrollBar1.Value / 100
End Sub
TrackBar
 屬性








Value
Maximum (defalut=10)
Minimum (defalut=0)
SmallChange(default=1) ‘微動鈕
LargeChange(default=5) ‘快動區
Orientation ‘水平或垂直
TickFrequency ‘刻度距離
TickStyle ‘設定外形
Private Sub TrackBar1_Scroll(ByVal……) Handles TrackBar1.Scroll
Dim speed As Integer
speed = TrackBar1.Value
If speed <> 0 Then
Timer2.Enabled = True
Timer2.Interval = 100 / speed
Else
Timer2.Enabled = False
End If
End Sub
Color
 Color.FromArgb([A], R, G, B)


A:透明度(0:透明, 255:不透明)
R(紅)、G(綠)、B(藍)：0~255
 Color.顏色


Color.pink
Color.blue
 使用方法：


button1.backcolor=color.blue 或
button1.backcolor=color.fromargb(0,0,255)
調色盤
Private Sub NumericUpDown_ValueChanged(ByVal….) Handles NumericUpDown1.ValueChanged, NumericUpDown2.ValueChanged,
NumericUpDown3.ValueChanged
PictureBox11.BackColor = Color.FromArgb(NumericUpDown1.Value, NumericUpDown2.Value,NumericUpDown3.Value)
End Sub
聲音(參考P.222~225)
 My.Computer.audio(聲音檔, 播放方式)

播放方式



audioPlayMode.Background
audioPlayMode.WaittoComplete
audioPlayMode.BackgroundLoop
 My.Computer.audio.stop()
 使用方法：

My.Computer.audio.play(“c:\ding.wav”,audioPlayMode.Background)
 只能播放WAV及系統音效
Windows Media Player
 工具箱按滑鼠右鍵選擇項目com元件Windows Media
Player
 控制撥放





AxWindowsMediaPlayer1.Ctlcontrols.play()
AxWindowsMediaPlayer1.Ctlcontrols.pause()
AxWindowsMediaPlayer1.Ctlcontrols.stop()
AxWindowsMediaPlayer1.Ctlcontrols.previous()
AxWindowsMediaPlayer1.Ctlcontrols.next()
Private Sub 影片ToolStripMenuItem_Click(ByVal) Handles 影片ToolStripMenuItem.Click
AxWindowsMediaPlayer1.Visible = True
AxWindowsMediaPlayer1.URL = path & "5.wmv"
AxWindowsMediaPlayer1.Ctlcontrols.play()
End Sub
LinkLable
 Process.start

網址：Process.start(“tw.yahoo.com”)
檔案：Process.start(“c:\windows\system32\mspaint.exe”)

信箱：Process.start(“mailto:[email protected]”)

Private Sub LinkLabel1_LinkClicked(ByVal ….) Handles LinkLabel1.LinkClicked
Process.Start("www.youtube.com/watch?v=4zpqgq1ixRM")
End Sub
一、繪圖控制項
 繪圖控制項是指可使用繪圖方法來繪製幾何
圖形或圖案的控制項，例如：



表單（Form）
圖片方塊（PictureBox）
群組方塊（GroupBox）
二、繪圖區域（1/2）
 繪圖區域（工作區）是指繪圖控制項上可繪
製圖形的區域，由Size屬性決定
表單工作區寬度為300
表
單
工
作
區
高
度
為
300
在繪圖區域範圍內所繪製的圓形
超出繪圖區域範圍所繪製的圓形
二、繪圖區域（2/2）
 變更繪圖區域的大小


在屬性視窗修改Size屬性設定值
撰寫程式碼


語法：
繪圖控制項名稱.Size = New System.Drawing.Size(寬度, 高度)
例：
Me.Size = New System.Drawing.Size(550, 400) 或
Me.Size=New Size(Width,Height)
三、座標系統（1/2）
 繪圖區域的座標系統可用來表示圖形的位置

以繪圖區域的左上角為原點，水平方向為橫座標，
垂直方向為縱座標，並以像素為座標單位
(0, 0)
(0, 100)
(100, 0)
(200, 0)
X軸
繪圖區域
(200, 200)
Y軸
三、座標系統（2/2）
 每一個繪圖區域都有其獨立的座標系統
表單原點
(0, 0)
圖片方塊
原點(0, 0)
120
起始點座
標(50, 50)
120
120
120
起始點座
標(50, 50)
四、容器內控制項的位置表示
 設定控制項的Location屬性，可調整其在容
器中的座標位置
設定控制項
與其它控制
項間的上、
下、左、右
最小間距
五、繪圖的事件（1/2）
 Windows作業系統每隔一段時間只會重繪視窗及視窗
元件，而不會重繪使用繪圖方法所繪製的圖案
 對表單進行相關操作時，所繪製的圖案可能會因此消
失
Step2：按此鈕，
縮小表單
Step1：在表單上
按一下，
即會顯示
蝴蝶圖案
Step3：還原表單；蝴
蝶圖案消失了
五、繪圖的事件（2/2）
 繪圖控制項的Paint事件是一種系統事件，會
在作業系統重新繪製繪圖控制項時發生
 我們應儘量將繪圖敘述撰寫在繪圖控制項的
Paint事件程序中
六、線段與文字的繪製（1/7）
 DrawLine( )方法可用來繪製直線

語法：
Graphics物件.DrawLine(線條色彩, 線段起始點X座標值X1, 線段起始點Y座標值Y1,
線段終點X座標值X2, 線段終點Y座標值Y2)

說明：



在起始座標 (X1, Y1) 到終點座標 (X2, Y2) 間繪製一條直線
「線條色彩」參數是使用Pens類別提供的線條色彩屬性，來作為畫筆的色彩
範例：表單上繪製兩條相交的直線
Private Sub Form1_Paint(ByVal sender……) Handles Me.Paint
'建立一個Graphics物件並將表單的繪圖介面指定給該物件graph
Dim graph As Graphics = Me.CreateGraphics
'繪製由左往右斜的直線，顏色為藍色
graph.DrawLine(Pens.Blue, 15, 20, 270, 250)
'繪製由右往左斜的直線，顏色為深綠色
graph.DrawLine(Pens.DarkGreen, 270, 20, 15, 250)
End Sub
六、線段與文字的繪製（2/7）
 DrawCurve( )方法可用來繪製曲線

語法：
Graphics物件.DrawCurve(線條色彩, 座標陣列)

說明：


依照座標陣列中的座標，來繪製一條曲線
「線條色彩」參數是使用Pens類別提供的線條色彩屬性，來作為畫筆的色彩
 「座標陣列」參數是用來存放所要繪製曲線的路徑座標值。它必須宣
告為Point（點）結構


語法：
Dim 座標陣列名稱( ) As Point = {Point1, Point2, Point3, …}
例：
Dim Point1 As New Point(10, 10)
Dim Point2 As New Point(40, 60)
Dim Point3 As New Point(60, 30)
Dim Point4 As New Point(80, 10)
'宣告1個含有4個點座標的座標陣列
Dim Points( ) As Point = {point1, point2, point3, point4}
六、線段與文字的繪製（3/7）

範例：
在表單上繪製一個打勾的曲線
Private Sub Form1_Paint(ByVal sender……) Handles Me.Paint
Dim graph As Graphics = Me.CreateGraphics
'建立三個Point物件並設定其座標值
Dim point1 As New Point(75, 150)
Dim point2 As New Point(120, 200)
Dim point3 As New Point(240, 40)
'建立一個座標陣列並設定其包含Poin1～Point3
Dim points() As Point = {point1, point2, point3}
'繪製一個打勾的曲線圖案
graph.DrawCurve(Pens.Purple, points)
End Sub
Pen類別
 為了繪製出不同線條粗細的圖形，可宣告一
個Pen類別的物件來指定線條粗細

語法：
Dim Pen物件名稱 As New Pen(色彩常數[, 線條粗細])

例：
Dim graph As Graphics = Me.CreateGraphics
'宣告一個藍色畫筆且畫筆寬度為2
Dim bluepen As New Pen(Color.Blue, 2)
graph.DrawLine(bluepen, 50, 50, 150, 100)
bluepen.Width = 5
'重新定義畫筆的寬度為5
Color Pen
 Color.FromArgb([A], R, G, B)


A:透明度(0:透明, 255:不透明)
R(紅)、G(綠)、B(藍)：0~255
 Color.顏色


Color.pink
Color.blue
 使用方法：


Dim bluepen As New Pen(Color.Blue, 2) 或
Dim bluepen As New Pen(color.fromargb(0,0,255), 2)
六、線段與文字的繪製（4/7）
 DrawString( )方法可用來繪製文字

語法：
Graphics物件.DrawString(繪製的文字, 字型, 筆刷色彩, 繪製起始點X座
標值X1, 繪製起始點Y座標值Y1)

說明：





在起始座標(X1, Y1)繪製文字
在「繪製的文字」參數前後必須加上雙引號（“），標示所要繪製
文字的範圍
「字型」參數是用來設定所要繪製文字的字型、字型樣式、及大小
「筆刷色彩」參數是用來設定所要繪製文字的色彩
範例：
Private Sub Button1_Click(ByVal sender……) Handles Button1.Click
Dim graph As Graphics = Me.CreateGraphics
Me.Refresh()
'清除表單上所繪製的圖形
graph.DrawString("眼睛", Me.Font, Brushes.Blue, 280, 100)
End Sub
七、Font類別
 為了使繪製文字的字型樣式更富變化，可宣告一個
Font類別的物件來指定文字字型

語法：
Dim Font物件名稱 As New Font("字型"[, 大小, 字型樣式])

例：
Dim graph As Graphics = Me.CreateGraphics
Dim font1 As New Font("標楷體", 16, FontStyle.Bold)
graph.DrawString("程式", font1, Brushes.Black, 80, 60)
八、幾何圖形的繪製（1/7）
 DrawRectangle( )方法可用來繪製矩形

語法：
Graphics物件.DrawRectangle(線條色彩, 矩形左上角的X座標值X1,矩形
左上角的Y座標值Y1, 矩形的寬度W, 矩形的高度H)

說明：



以座標(X1, Y1)為起始點，繪製一個寬為W、高為H的無填色矩形
「線條色彩」參數是使用Pens類別提供的線條色彩屬性，來作為畫
筆的色彩
範例：
在表單上繪製兩個矩形
Private Sub Form1_Paint(ByVal sender……) Handles Me.Paint
Dim graph As Graphics = Me.CreateGraphics
'繪製兩個矩形
graph.DrawRectangle(Pens.Coral, 50, 50, 120, 120)
graph.DrawRectangle(Pens.DarkGreen, 100, 100, 120, 120)
End Sub
八、幾何圖形的繪製（2/7）
 DrawEllipse( )方法可用來繪製圓形或橢圓形

語法：
Graphics物件.DrawEllipse(線條色彩, 繪圖範圍)

說明：


在定義的繪圖範圍內，繪製一個無填色橢圓形或圓形
「繪圖範圍」參數必須宣告為Rectangle（矩形）資料型別
 語法：
Dim 繪圖範圍名稱 As New Rectangle(矩形左上角的X座標值X1,
矩形左上角的Y座標值Y1, 矩形的寬度W, 矩形的高度H)
 例：
Dim rect As New Rectangle(35, 35, 150, 200)

「線條色彩」參數是使用System.Drawing類別下的Pens類別，
來作為畫筆的色彩
八、幾何圖形的繪製（3/7）

範例：
在表單上繪製一個圓形及橢圓形
Private Sub Form1_Paint(ByVal sender……) Handles Me.Paint
Dim graph As Graphics = Me.CreateGraphics
Dim rect1 As New Rectangle(30, 100, 220, 50)
'宣告一個橘色畫筆且畫筆寬度為3
Dim drawpen As New Pen(Color.SandyBrown, 3)
'繪製一個橘色的橢圓形
graph.DrawEllipse(drawpen, rect1)
Dim rect2 As New Rectangle(75, 60, 130, 130)
'繪製一個咖啡色的圓形
graph.DrawEllipse(Pens.Brown, rect2)
End Sub
八、幾何圖形的繪製（4/7）
 DrawPolygon( )方法可用來繪製多邊形

語法：
Graphics物件.DrawPolygon(線條色彩, 座標陣列)

說明：



依照座標陣列的座標，來繪製一個多邊形
「線條色彩」參數是使用Pens類別提供的線條色彩屬性，來
作為畫筆的色彩
「座標陣列」參數是用來存放所要繪製多邊形的路徑座標
值；須宣告為Point（點）結構
八、幾何圖形的繪製（5/7）

範例：
在表單上繪製一個五邊形
Private Sub Form1_Paint(ByVal sender……) Handles Me.Paint
Dim graph As Graphics = Me.CreateGraphics
Dim point1 As New Point(150, 40)
Dim point2 As New Point(60, 105)
Dim point3 As New Point(95, 195)
Dim point4 As New Point(205, 195)
Dim point5 As New Point(240, 105)
Dim points() As Point = {point1, point2, point3, _
point4, point5}
graph.DrawPolygon(Pens.Green, points)
'繪製五邊形
End Sub
九、繪製填色圖案
 Fillrectangle( )方法可用來繪製填色矩形

語法：
Graphics物件.FillRectangle(筆刷色彩, 矩形左上角的X座標值X1, 矩形左上角的Y座標值Y1,
矩形的寬度W, 矩形的高度H)
 FillEllipse( )方法可用來繪製填色圓形或橢圓形

語法：
Graphics物件.FillEllipse(筆刷色彩, 繪圖範圍)
 FillPolygon( )方法可用來繪製填色多邊形

語法：
Graphics物件.FillPolygon(筆刷色彩, 座標陣列)

例：
graph.DrawRectangle(Brushes.Coral, 50, 50, 120, 120)
Brush類別

語法：

Dim brush物件名稱 As New SolidBrush (色彩常數)
Dim brush物件名稱 As New TextureBrush (bitmap)

例：

Dim c As New SolidBrush(Color.FromArgb(255,0, 0))
Dim d As New TextureBrush(New Bitmap("C:\Documents and
Settings\user\桌面\dog pic\dog1.gif"))
Color Brush
 Color.FromArgb([A], R, G, B)


A:透明度(0:透明, 255:不透明)
R(紅)、G(綠)、B(藍)：0~255
 Color.顏色


Color.pink
Color.blue
 使用方法：

Dim b As New SolidBrush(Color.blue))或

Dim b As New SolidBrush (color.fromargb(0,0,255))
十、點陣影像的建立
 Bitmap類別可用來建立相當於畫布的物件，
以處理點陣影像
這是一個利用Bitmap物件
來顯示楓葉點陣影像
十一、建立Bitmap物件（1/4）
 將點陣影像指定作為Bitmap物件的內容
 將控制項所顯示的圖案指定給Bitmap物件


語法：Dim Bitmap物件名稱 As New Bitmap(控制項名.Image)
例：Dim bmpA As New Bitmap(PictureBox1.Image)
PictureBox1
所顯示的花
朵圖案
bmpA
十一、建立Bitmap物件（2/4）

將儲存在磁碟機中的影像圖檔指定給Bitmap物件


語法：Dim Bitmap物件名稱 As New Bitmap("影像圖檔的路徑")
例：Dim bmpB As New Bitmap("C:\我的圖片\flowers.jpg")
儲存在 "C:\我的圖片"
資料夾下的花朵圖案
Ｃ磁碟機
bmpB
十一、建立Bitmap物件（3/4）
 設定Bitmap物件的大小


語法：Dim Bitmap物件名稱 As New Bitmap(寬度大小, 高度大小)
例：Dim bmpC As New Bitmap(800, 600)
bmpC物件的大小為
800 pixels x 600 pixels
bmpC
十一、建立Bitmap物件（4/4）
 如何在表單上顯示Bitmap物件的內容


利用圖片方塊來顯示Bitmap物件中的點陣影像
例：
Dim bmpD As New Bitmap("C:\Bird.jpg")
PictureBox1.Image = bmpD
Q：上 V.S. 下有何不同???
• 載入圖片的方法
•PictureBox1.Load(“c:\ch12\pig.fig”)
•PictureBox1.Image=Image.FormFile(“c:\ch12\pig.fig”)
•PictureBox1.Image=new Bitmap(“c:\ch12\pig.fig”)
十二、DrawImage( )方法
 可用來繪製存放在Bitmap物件中的影像

語法：
Graphics物件名稱.DrawImage(Bitmap物件, 繪製影像的起始點X
座標值X1, 繪製影像的起始點Y座標值Y1)

例：
Dim graph As Graphics = Me.Creategraphics
Dim bmpE As New Bitmap("C:\我的電腦\Tower.jpg")
graph.DrawImage(bmpE, 280, 100)
十三、擷取影像（1/2）
 Clone( )方法可用來取得畫布上的部分影像


語法：Bitmap物件2 = Bitmap物件1.Clone(擷取範圍,
影像格式)
說明：



將在Bitmap物件1中擷取到的局部影像，設定給Bitmap物件2
「擷取範圍」參數是用來設定要在Bitmap物件1中擷取的影
像範圍大小；須宣告為Rectangle結構
「影像格式」參數是用來設定所要取得影像資料的格式； 一
般設為 "PixelFormat"（即像素資料）
十三、擷取影像（2/2）

例：
Dim rect As New Rectangel(30, 10, 70, 70)
bmpB = bmpA.Clone(rect, bmpa.PixelFormat)
70
座標值為
(30, 10)
70
使用Clone( )方法
bmpA的內容
bmpB的內容
十四、去背處理（1/2）
 MakeTransparent( )方法可用來去除畫布中之
影像的背景色彩

語法：
Bitmap物件名稱.MakeTransparent(色彩常數)

說明：



依據色彩常數所代表的色彩，將畫布物件中之影像含有該色
彩的像素部分設為透明
「色彩常數」參數是用來指定要去除的背景色彩
只能去除單一的背景色彩
十四、去背處理（2/2）

例：
bmp.MakeTransparent(Color.Black)
背景色
為黑色
去背處理
原bmp的內容