350 likes | 567 Views
Ch07 流程控制應用 - 動畫. 視窗程式設計. PictureBox 圖片控制項. 要加入圖片,可用 PictureBox 圖片控制項載入指定 圖片檔。 圖片控制項允許使用的圖形檔格式有: 點陣圖 (.bmp) 、 GIF 格式圖檔 ( 包括 Gif 動畫及背景 透空的靜態圖 ) 、 jpeg 圖形檔、中繼檔 (.wmf) 、 可攜式網路圖檔 (.png) 或圖示格式 (.ico) 的圖形。 PictureBox 圖片控制項中的圖片可在設計階段先 載入或在程式執行時才讀取檔案。. 圖片控制項的常用屬性.
E N D
Ch07 流程控制應用-動畫 視窗程式設計
PictureBox 圖片控制項 • 要加入圖片,可用 PictureBox 圖片控制項載入指定圖片檔。 • 圖片控制項允許使用的圖形檔格式有:點陣圖(.bmp)、GIF格式圖檔(包括Gif動畫及背景透空的靜態圖)、jpeg圖形檔、中繼檔(.wmf) 、可攜式網路圖檔(.png)或圖示格式(.ico)的圖形。 • PictureBox 圖片控制項中的圖片可在設計階段先載入或在程式執行時才讀取檔案。
圖片控制項的常用屬性 1. Image屬性:是圖片控制項最重要屬性,用來設定要顯示的圖檔。 2. SizeMode屬性 (預設值Normal)設定圖片在圖片控制項中顯示方式,有五個屬性值: Normal-圖片以正常大小顯示在圖片方塊的左上角。 StretchImage-圖片自動調整成和圖片控制項一樣大小。 AutoSize-圖片控制項自動調整成和圖片一樣大小。 CenterImage-圖片以正常大小顯示在圖片控制項的中央。 Zoom -圖片維持等比例依圖片控制項大小自動調整。 • 在程式執行階段設定 SizeMode 屬性值的語法如下: PictureBox1.SizeMode = PictureBoxSizeMode.Normal
圖片控制項的常用屬性 3. BorderStyle屬性:設定圖片控制項的外框樣式,屬性值: None - 沒有框線(預設值) FixedSingle - 單線固定 Fixed3D- 立體固定 4. Location.X、Location.Y屬性 :設定圖片控制項左上角相對於容器(通常為表單)的位置。Location.X和 Location.Y兩屬性,分別設定圖片控制項的水平距離 和 垂直距離。
圖片控制項的常用屬性 5. Left、Top屬性Left屬性相當於Location.X屬性Top屬性相當於Location.Y屬性Left和 Top屬性只能在程式執行階段使用。 6. Size.Width、Size.Height屬性設定圖片控制項的大小。Size.Width和 Size.Height兩個屬性,分別設定圖片控制項寬度(可縮寫為Width) 和高度(可縮寫為Height)。
圖片的載入及清除 1. 設計階段載入圖片
2. 設計階段清除圖片 選取 Image 屬性欄後按 鍵,或直接在屬性視窗的Image 屬性值上按右鍵,選取 即可。
3. 在執行階段載入圖片 • 使用 Image 類別的 FromFile 方法設定 Image 屬性。 語法: PictureBox1.Image = Image.FromFile(包含路徑的圖檔名稱) • 將 D :\ch05\飛碟.gif 圖形檔載入 pic1 圖片控制項中:pic1.Image = Image.FromFile("d:\ch05\飛碟.gif") • 也可用 New 建立 Bitmap 物件來載入圖檔: pic1.Image = New Bitmap("d:\ch05\飛碟.gif") 4. 執行階段清除圖片 PictureBox.Image = Nothing
圖片位置和尺寸的調整 • 程式執行階段調整圖片控制項位置和尺寸,可產生動畫效果。 1. Point 物件 改變圖片控制項的 Location 屬性可用 Point 物件,語法: Object.Location = New Point(X,Y) 例 將 pic1 圖片控制項移動到 X 座標 66、Y 座標 88 位置。 pic1.Location = New Point(66,88) 不用 Point 物件,也可直接改變 Left(=Location.X)和Top(= Location.Y)屬性,寫法: pic1.Left = 66 pic1.Top = 88
2. Size物件 • 程式執行階段,可用 Size 物件來設定圖片大小。 • SizeMode屬性設為 StretchImage 或 Zoom(等比例)圖片自動調整成和圖片控制項一樣大小。 • 使用 Size 物件語法: PictureBox.Size = New Size(Width,Height) 例 將 pic1 圖片控制項的寬度和高度各縮小一半。 pic1.Size = New Size(pic1.Width/2,pic1.Height/2) • 如不用 Size 物件,也可直接改變 Size 的 Width 和 Height 屬性值,寫法: pic1.Width = pic1.Width / 2pic1.Height = pic1.Height / 2
FileName: poker.sln 01 Dim num1, num2 As Integer 02 Private Sub Form1_Load(ByVal sender …) Handles MyBase.Load 03 pic1.Enabled = False 04 pic2.Enabled = False 05 pic1.SizeMode = PictureBoxSizeMode.AutoSize 06 pic2.SizeMode = PictureBoxSizeMode.AutoSize 07 pic1.Image = New Bitmap("c:/vb2008/ch05/image/Pokerbk.jpg") 08 pic2.Image = New Bitmap("c:/vb2008/ch05/image/Pokerbk.jpg") 09 lblMsg.Text = "按洗牌鈕遊戲開始.." 10 End Sub
01 Private Sub btnShuffle_Click(ByVal sender …) Handles btnShuffle.Click 02 pic1.Enabled = True 03 pic2.Enabled = True 04 btnShuffle.Enabled = False 05 pic1.Image = New Bitmap("c:/vb2008/ch05/image/Pokerbk.jpg") 06 pic2.Image = New Bitmap("c:/vb2008/ch05/image/Pokerbk.jpg") 07 Randomize() 08 num1 = Int(Rnd() * 13) + 1 09 num2 = Int(Rnd() * 13) + 1 10 lblMsg.Text = "請在撲克牌上按一下選取 .." 11 End Sub
01 Private Sub pic1_Click(ByVal sender …) Handles pic1.Click 02pic1.Image = New Bitmap("c:/vb2008/ch05/image/Poker" & num1 & ".jpg") 03pic2.Image = New Bitmap("c:/vb2008/ch05/image/Poker" & num2 & ".jpg") 04 If num1 > num2 Then 05 lblMsg.Text = " 你贏了 ! 按洗牌鈕 重玩 ...." 06 Else 07 If num1 = num2 Then 08 lblMsg.Text = " 平 手 ! 按洗牌鈕 重玩 ...." 09 Else 10 lblMsg.Text = " 你輸了 ! 按洗牌鈕 重玩 ...." 11 End If 12 End If 13 pic1.Enabled = False 14 pic2.Enabled = False 15 btnShuffle.Enabled = True 16 End Sub
01 Private Sub pic2_Click(ByVal sender …) Handles pic2.Click 02pic1.Image = New Bitmap("c:/vb2008/ch05/image/Poker" & num1 & ".jpg") 03pic2.Image = New Bitmap("c:/vb2008/ch05/image/Poker" & num2 & ".jpg") 04 If num2 > num1 Then 05 lblMsg.Text = " 你贏了 ! 按洗牌鈕 重玩 ...." 06 Else 07 If num2 = num1 Then 08 lblMsg.Text = " 平 手 ! 按洗牌鈕 重玩 ...." 09 Else 10 lblMsg.Text = " 你輸了 ! 按洗牌鈕 重玩 ...." 11 End If 12 End If 13 pic1.Enabled = False 14 pic2.Enabled = False 15 btnShuffle.Enabled = True 16 End Sub 17 18 Private Sub btnQuit_Click(ByVal sender …) Handles btnQuit.Click 19 End 20 End Sub
Image List影像列示控制項 • ImageList 影像列示控制項屬幕後執行控制項,程式執行時表單上看不到,編輯階段顯示在表單正下方。 • 無法直接在表單上顯示圖形,可同時載入多張圖片,以方便在表單使用影像列示清單控制項來共用圖片。 • 如按鈕、選項鈕、核取方塊、標籤等控制項,都具 ImageList 屬性,只要將該屬性值設定為影像列示控制項,就可顯示圖片。 • 圖片控制項物件的 Image 屬性值,也可指定等於影像列示控制項的 Images 屬性值。只要傳圖片的索引值(索引值由0開始)就改變圖片,可將不同圖片檔名置入影像列示控制項,存取時透過索引值,程式碼可更簡化。
PictureBox1 圖片控制項的 Image 屬性由影像列示控制項圖片的 Index 索引值取得圖片的語法如下: PictureBox1.Image = ImageList1.Images(Index) • 如 Button1 按鈕控制項上面要顯示影像列示控制項ImageList1 的第 2 張圖片,寫法: Button1.ImageList = ImageList1 Button1.ImageIndex = 1
影像列示控制項的常用屬性 1. Images屬性物件中圖示或圖片的集合。 2. ColorDepth屬性 (預設值 Depth8Bit)影像色彩的位元數,屬性值:Depth4Bit、Depth8Bit、 Depth16Bit、Depth32Bit。 3. ImageSize屬性- 影像集合中影像的大小,最大值為(256,256)。- 影像列示控制項物件適用圖形格式和圖片控制項相同。- 因圖片載入到影像列示控制項後,大小會調整成一樣 的大小(同ImageSize屬性值)- 圖片最好大小一致,比例要相似以免秀圖時變形。
Timer 計時器控制項 • Timer 計時器控制項是 VB 所提供一個計時器,可在指定時間間隔時執行特定的動作。 • Tick 事件是 Timer 控制項預設事件,只要設定的間隔時間一到,就會觸動Tick事件,只要將執行的程式碼寫在該事件中即可。 • Tick 事件就像是一個隱形 Do…Loop 迴圈,當間隔時間一到就執行事件一次,若要離開迴圈只要設定 Enabled 屬性為 False 。 • 事件導向程式設計,迴圈可用 Timer 控制項來取代。一般用來做計時、動畫製作等。 • Timer 控制項和 ImageList 控制項一樣,都屬幕後執行控制項,執行時在表單上沒有實體物件。
Timer常用屬性和事件 1. Enabled屬性(預設值 False) 用來設定是否開始啟動Timer控制項計時器。若設為True 表計時器開始計時,以 Interval 屬性值當作週期每週期一到便觸動(執行) Tick 事件一次。若設為 False就停止計時。 2. Interval屬性(預設值 100) 用來設定計時器時間間隔(即週期),以毫秒(千分之一秒)為單位,100 即 0.1秒。若設定Interval = 1000,即代表1000毫秒 = 1秒。Interval 屬性值最大值到64,767,即64.7秒。 3. Tick事件(預設事件)當 Enabled 屬性值為True時,Timer 控制項的計時器啟動,每隔一週期(即Interval屬性值)就會觸動 Tick 事件一次。
FileName: dogRun.sln 03 Dim start_time As Double 04 Dim flag As Boolean 05 06 Private Sub Form1_Load(ByVal sender ….) Handles MyBase.Load 07 picDog.SizeMode = PictureBoxSizeMode.StretchImage 08 picDog.Image = imgDog.Images(0) 09 Timer1.Interval = 200 10 flag = True 11 End Sub 12 13 Private Sub btnStart_Click(ByVal sender …) Handles btnStart.Click 14 Timer1.Enabled = True 15 start_time = Microsoft.VisualBasic.Timer 16 End Sub 17
18 Private Sub Timer1_Tick(ByVal sender … ) Handles Timer1.Tick 19 If flag = True Then 20 picDog.Image = imgDog.Images(0) 21 flag = False 22 Else 23 picDog.Image = imgDog.Images(1) 24 flag = True 25 End If 26 End Sub 27 28 Private Sub btnStop_Click(ByVal sender _ ) Handles btnStop.Click 29 Timer1.Enabled = False 30 MsgBox("總共花費" & Microsoft.VisualBasic.Timer - start_time & "秒") 31 End Sub 32 33 End Class
按對答 看答案 按出題 開始
FileName:memoryTest.sln 01 Public Class Form1 02 Dim count, ans, ok As Integer 03 Private Sub Form1_Load(ByVal sender… ) Handles MyBase.Load 04 count = 0 : ok = 0 05 lblTest.Text = "" 06 lblMsg.Text = "請按出題鈕開始,題目會在1秒後消失" 07 btnTest.Enabled = True 08 btnCheck.Enabled = False 09 btnQuit.Enabled = True 10 txtAnswer.Enabled = False 11 tmrTest.Enabled = False 12 tmrTest.Interval = 1000 13 End Sub
15 Private Sub btnTest_Click(ByVal sender …) Handles btnTest.Click 16 Dim rnd As New Random 17 ans = rnd.Next(100000, 1000000) 18 count += 1 19 lblTest.Text = ans 20 txtAnswer.Text = "" 21 tmrTest.Enabled = True 22 btnTest.Enabled = False 23 btnCheck.Enabled = True 24 btnQuit.Enabled = True 25 End Sub
27 Private Sub tmrTest_Tick(ByVal sender …) Handles tmrTest.Tick 28 tmrTest.Enabled = False ' 關閉計時器 29 lblTest.Visible = False ' 隱藏題目 30 lblMsg.Text = "請輸入答案" 31 txtAnswer.Enabled = True ' 可以輸入 32 txtAnswer.Focus() ' 設為作用中物件供使用者輸入答案 33 End Sub 34 35 Private Sub btnCheck_Click(ByVal sender …) Handles btnCheck.Click 36 lblTest.Visible = True '顯示題目 37 If Val(txtAnswer.Text) = ans Then ok += 1 38 lblMsg.Text = "出" & count & "題,答對" & ok & "題!!按出題鈕進入下一題" 39 btnTest.Enabled = True 40 btnCheck.Enabled = False 41 End Sub
FileName:卡拉ok字幕機.sln 02 03 Dim flag As Integer = 1 04 Private Sub Form1_Load(ByVal sender …) Handles MyBase.Load 05 Timer1.Interval = 30 06 Timer1.Enabled = False 07 pic2.Location = pic1.Location 08 pic1.Width = 0 09 End Sub 10 11 Private Sub btnPlay_Click(ByVal sender …) Handles btnPlay.Click 12 Timer1.Enabled = True 13 End Sub 14
15 Private Sub Timer1_Tick(ByVal sender …) Handles Timer1.Tick 16 If flag = 1 Then 17 pic1.Image = New Bitmap("fish1.bmp") 18 pic2.Image = New Bitmap("fish2.bmp") 19 Else 20 pic1.Image = Image.FromFile("fish3.bmp") 21 pic2.Image = Image.FromFile("fish4.bmp") 22 End If 23 If pic1.Width < (pic2.Width) Then 24 pic1.Width = pic1.Width + 2 s 25 Else 26 pic2.Location = pic1.Location 27 pic1.Width = 0 28 flag = -flag 29 End If 30 End Sub 31 32 Private Sub btnStop_Click(ByVal sender …) Handles btnStop.Click 33 Timer1.Enabled = False 34 End Sub