第八章: 輸入裝置－鍵盤與滑鼠.

Presentation on theme: "第八章: 輸入裝置－鍵盤與滑鼠."— Presentation transcript:

1 第八章: 輸入裝置－鍵盤與滑鼠

2 章節預覽 8.1 鍵盤與事件 8.2 KeyPress事件 8.3 KeyDown事件與KeyUp事件 8.4 滑鼠與事件
8.5 Click事件 8.6 DblClick事件 8.7 MouseDown、MouseUp與MouseMove事件 8.8 拖曳（Drag）與放置（Drop） 8.9 本章整合應用實例

3 8.1：鍵盤與事件 Visual Basic提供了許多控制項介面來處理由鍵盤輸入的資料，例如『文字方塊』控制項中的文字通常是由鍵盤所輸入的資料。除此之外，某些特殊按鍵或組合鍵是具有特殊意義的，為了要提供這種服務，Visual Basic提供了三個事件來處理鍵盤操作。 事件名稱 說明 物件_KeyPress 在特定物件上收到由鍵盤按鍵的字元。（僅回應按鍵動作，無法判斷該按鍵是否仍被按住或已放開） 物件_KeyDown 在特定物件上偵測出有按鍵被按住。 物件_KeyUp 在特定物件上偵測出被按住的鍵已放開。

4 8.2：KeyPress事件 當使用者按下鍵盤後，將觸發KeyPress事件與KeyDown事件，放開鍵盤時，則觸發KeyUp事件
不是按下所有的按鈕都會觸發KeyPress事件，只有按下KeyAscii碼的按鍵，才會觸發KeyPress事件。 KeyAscii碼如下列所示： 合法的按鍵 傳入的KeyAscii碼值 任何可印出的鍵盤字元（如【A】、【B】、【C】） 字元的ASCII碼 【Tab】鍵 9 【Crtl】+【A】鍵~【Crtl】+【Z】鍵 1~26 【Enter】鍵與【Ctrl】+【Enter】鍵 13【Enter】鍵與10 【Backspace】鍵與 【Ctrl】+【Backspace】鍵 8【Backspace】鍵（倒退鍵）與127

5 8.2：KeyPress事件 KeyPress事件語法語法如下：
【語法說明】： KeyAscii：傳入代表被按鍵盤的ASCII碼（參閱附錄）。 若在事件程序中更改KeyAscii參數內容，則顯示的字元將跟著被更改。 若將KeyAscii設為0，則會清除剛才輸入的字元。 【實作範例8- 1】： 設計三種自動校正與禁止輸入的文字方塊，如下規定。 第一個文字方塊只允許輸入數字與小數點，輸入其他字元則清除掉所輸入的字元。 第二個文字方塊內，會將小寫字母改成大寫字母，其它字元維持不變。 第三個文字方塊內，會將大寫字母改成小寫字母，其它字元維持不變。 Private Sub物件_KeyPress(KeyAscii As Integer) ……………………………… End Sub

6 【實作範例8-1】 上機實作 Step1：將專案名稱設為『p8_01』。 Step2：在表單上產生下列控制項並設定屬性。

7 【實作範例8-1】 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 Private Sub cmdClear_Click() txtNum.Text = "" txtUpperCase.Text = "" txtLowerCase.Text = "" End Sub Private Sub txtLowerCase_KeyPress(KeyAscii As Integer) If KeyAscii >= 65 And KeyAscii <= 90 Then '大寫字母 KeyAscii = KeyAscii + 32 '轉為小寫 End If Private Sub txtNum_KeyPress(KeyAscii As Integer) If Not ((KeyAscii >= 48 And KeyAscii <= 57) Or KeyAscii = 46) Then KeyAscii = 0 '數字或小數點判斷 Private Sub txtUpperCase_KeyPress(KeyAscii As Integer) If KeyAscii >= 97 And KeyAscii <= 122 Then '小寫字母 KeyAscii = KeyAscii - 32 '轉為大寫

8 8.3：KeyDown事件與KeyUp事件 KeyDown與KeyUp事件的觸發時機與動作：
KeyDown動作：按下鍵盤按鍵不放時，會觸發KeyDown事件。 KeyUp動作：放開已按下的按鍵時，會觸發KeyUp事件（恰與KeyDown動作相反）。 可以配合KeyPress事件來檢查按下的是哪一個按鍵。 KeyDown、KeyUp、KeyPress事件提供的功能有些不同： 若輸入一個字元，則事件發生順序為KeyDown事件、KeyPress事件、KeyUp事件 KeyPress事件可以取得按下字元的ASCII碼，但無法得知鍵盤是否持續被按著，或者是一按下就被放開。 KeyUp和KeyDown事件程序可以處理KeyPress事件無法處理的按鍵，例如：功能鍵、編輯鍵與組合鍵。

9 8.3：KeyDown事件與KeyUp事件 下列狀況無法觸發KeyDown、KeyUp、KeyPress事件：
當表單出現指令按鈕，並且預設屬性為True時，按下【Enter】鍵，只會觸發指令按鈕的事件，對於其它控制項則沒有作用。 當表單出現的指令按鈕的取消屬性為True時，按【Esc】鍵只會觸發指令按鈕的事件，對於其它控制項則沒有作用。 按【Tab】鍵沒有作用 KeyDown與KeyUp事件語法 Private Sub物件_KeyDown(KeyCode As Integer , Shift As Integer) ………………………………. End Sub Private Sub物件_KeyUp(KeyCode As Integer , Shift As Integer) ………………………………. End Sub

10 8.3：KeyDown事件與KeyUp事件 【語法說明】：
參數KeyCode：KeyCode是鍵盤掃描碼（非ASCII碼）。鍵盤掃描碼如下： 按鍵 掃瞄碼 A~Z 65~90 0~9 48~57 功能鍵 掃瞄碼 【F1】~【F12】 112~123 0～9 48～57 7 Home 8 ↑ 9 PgUp 4 ← 5 6 → 1 End 2 ↓ 3 PgDn 36 38 33 37 12 39 35 40 34 對應掃描碼

11 8.3：KeyDown事件與KeyUp事件 參數Shift：將傳入【Shift】、【Crtl】、【Alt】等3鍵被按下的情形。如下表：
3鍵被按下的形況 此3鍵都沒被按下 1 僅【Shift】鍵被按下 2 僅【Ctrl】鍵被按下 3 【Shift】與【Ctrl】鍵同時被按下 4 僅【Alt】鍵被按下 5 【Shift】與【Alt】鍵同時被按下 6 【Ctrl】與【Alt】鍵同時被按下 7 【Shift】、【Ctrl】、【Alt】3鍵同時被按下

12 8.3：KeyDown事件與KeyUp事件 【實作範例8-2】： 上機實作
設計一個同時按下【Ctrl】+【Shift】+【方向】鍵不放可移動圖片的程式，當放開鍵盤時，則會將圖片歸位。 上機實作 Step1：專案名稱為『p8_02』。 Step2：在表單上產生下列控制項並設定屬性。 Step3：撰寫下頁程式碼。 Step4：執行程式。

13 4 5 6 7 8 9 10~11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32~33 34 35 Const KEY_LEFT = '左鍵掃描碼 Const KEY_UP = '上鍵掃描碼 Const KEY_RIGHT = 39 '右鍵掃描碼 Const KEY_DOWN = '下鍵掃描碼 Private Sub Form_Load() picElf.Left = 1500 : picElf.Top = 1500 End Sub Private Sub picElf_KeyDown(KeyCode As Integer, Shift As Integer) lblKeyStatus.Caption = "KeyCode:" & KeyCode & " Shift:" & Shift & _ " (Shift為3時可移動圖片)" If Shift = 3 Then Select Case KeyCode Case KEY_LEFT picElf.Left = picElf.Left '向左移動 Case KEY_UP picElf.Top = picElf.Top '向上移動 Case KEY_RIGHT picElf.Left = picElf.Left '向右移動 Case KEY_DOWN picElf.Top = picElf.Top '向下移動 End Select End If Private Sub picElf_KeyUp(KeyCode As Integer, Shift As Integer) lblKeyStatus.Caption = "KeyCode:" & KeyCode & " Shift:" & Shift

14 8.4：滑鼠與事件 除了鍵盤之外，另一種常用的輸入裝置為滑鼠，通常我們會用滑鼠做以下幾件工作：
1. 選取選項。 按下按鈕。 3. 移動物件。 移動插入點。 5. 編輯文件。 繪圖。 以上幾個工作，大多由滑鼠的3項基本操作合併合成： 1. 移動滑鼠指標。 2. 按下滑鼠按鈕。 3. 放開滑鼠按鈕。

15 8.4：滑鼠與事件 針對上述3項滑鼠的基本操作，Visual Basic提供七個滑鼠事件： 事件名稱 說 明 物件_Click
說 明 物件_Click 滑鼠游標在物件時，按滑鼠左鍵一下。 物件_DblClick 滑鼠游標在物件時，快按滑鼠左鍵兩下。 物件_MouseDown 滑鼠游標在物件時，偵測到滑鼠鍵被按住。 物件_MouseUp 按下物件的滑鼠鍵已經被放開 物件_MouseMove 滑鼠游標在物件時，偵測到滑鼠正在移動。 物件_DragDrop 物件正在被拖曳。 物件_DragOver 物件正在被拖曳，並且越過另外一個物件的上方。

16 8.5：Click事件 當使用者按下滑鼠左鍵然後放開滑鼠左鍵的動作（稱為按一下），會觸發Click事件。
1. 取得控制權 2. 選取物件 3. 執行指令 【利用程式移轉控制權】： 除了讓使用者透過鍵盤或滑鼠來改變目前擁有控制權的控制項之外，我們也可以利用物件的SetFocus方法來強制轉移控制權到特定物件上，語法如下： 語法:物件名稱.SetFocus 功能:要求該物件為焦點物件，也就是該物件取得控制權。

17 8.6：DblClick事件 快速按下滑鼠左鍵兩下Double Click事件（按二下）。通常我們會在以下時機觸發Double Click事件： 執行應用程式 例如：在檔案總管中『計算機』應用程式圖示上按二下，就會執行『計算機』應用程式。 開啟資料夾視窗 例如：在『我的電腦』或『網路芳鄰』圖示上按二下，就會開啟『我的電腦』或『網路芳鄰』視窗。 快速選取清單方塊選項 安裝顯示卡時，在精靈畫面 中，您可以先選擇廠商、 再選擇顯示卡種類、最後 按下【下一步】鈕設定。 也可以直接在顯示卡種類上 按兩下，直接進入下一步驟 設定。

18 8.7：MouseDown、MouseUp與MouseMove事件
滑鼠的動作可以分為3種，並且會引發3個事件。 (1) 在滑鼠上按下任一鍵（請注意是『任一鍵』），就會觸發「MouseDown」事件。 (2) 當滑鼠鍵由按下再放開，放開時會觸發「MouseUp」事件。 (3) 無論滑鼠是否被按下，只要移動滑鼠指標，就會觸發「MouseMove」事件。 以上3個事件被觸發時，同時可以偵測下列幾件事： (1) 鍵盤是否被按下【Alt】、【Ctrl】、【Shift】鍵。 (2) 滑鼠目前的位置。 (3) 目前按下或放開是那一個滑鼠按鍵。 明顯地，當我們按一下滑鼠左鍵時，一共會觸發Click、MouseDown、MouseUp三個事件 事件發生的先後順序為『MouseDown事件』、『MouseUp事件』、『Click事件』。

19 8.7：MouseDown、MouseUp與MouseMove事件
Private Sub物件_MouseMove(Button As Integer, Shift As Integer, X As Single, Y As Single) ………………………………………………………… End Sub Private Sub物件_MouseUp(Button As Integer, Shift As Integer, X As Single, Y As Single) ………………………………………………………… End Sub Private Sub物件_MouseDown(Button As Integer, Shift As Integer, X As Single, Y As Single) ………………………………………………………… End Sub

20 8.7：MouseDown、MouseUp與MouseMove事件
Button值 被按下或放開的滑鼠鍵 沒有滑鼠按鍵被按下，因此只會出現在MouseMove事件中。 1 按下的是滑鼠左鍵。 2 按下的是滑鼠右鍵。 4 按下的是滑鼠中間鍵。 【語法說明】： Button參數：代表哪一個滑鼠 按鍵被按下或放開的狀態。 Shift參數：當滑鼠被按下或放開時，【Alt】、【Ctrl】、【Shift】鍵同時被按下的情形： X參數與Y參數：代表滑鼠鍵被按下或放開時，滑鼠游標所在的X座標值與Y座標值。 Shift值 同時被按下的特殊鍵盤按鍵 【Alt】、【Ctrl】、【Shift】三鍵都沒被按下。 1 【Shift】鍵同時被按下。 2 【Ctrl】鍵同時被按下。 4 【Alt】鍵同時被按下。

21 【實作範例8-3】 【實作範例8-3】： 設計一個能夠使用滑鼠畫直線的程式。 (1) 按下滑鼠右鍵代表設定起始點。 (2) 按下滑鼠左鍵代表要在起始點與滑鼠游標間畫上直線。 上機實作 Step1：專案名稱為『p8_03』。 Step2：表單如右圖。 Step3：編輯下頁程式碼。 Step4：執行程式。

22 【實作範例8-3】 PSet方法可畫出一個小點。語法如下： 語法：PSet (X,Y) [,Color] 功能：在物件上畫一個小點。 4 5
6 7 8 9 10 11 12 13 14 15 Dim StartX, StartY Private Sub Form_MouseDown(Button As Integer, Shift As Integer, X As Single, Y As Single) If Button = 2 Then '按下滑鼠右鍵會畫一個起始點 StartX = X StartY = Y PSet (X, Y) End If If Button = 1 Then '按下滑鼠左鍵會在起始點與滑鼠游標間畫一條線 Line (StartX, StartY)-(X, Y) End Sub PSet方法可畫出一個小點。語法如下： 【語法說明】：(X,Y)為要畫點的座標，Color為點的顏色，若省略則點的顏色與前景顏色相同。指定坐標。 語法：PSet (X,Y) [,Color] 功能：在物件上畫一個小點。

23 【實作範例8-3】 Line方法可畫出一條直線。語法如下： 【語法說明】： (X1 , Y1)：為直線的起點座標。
Color：顏色。 B：畫方框。 BF：畫方塊。 省略B[F]：畫直線。 語法：Line [(X1 , Y1)] - [Step] (X2 , Y2) [,Color] [,B[F]] 功能：在物件上畫一條直線、方框、方塊。

24 【實作範例8-4】 【實作範例8-4】： 模擬小畫家，設計一個可以拿畫筆隨意畫圖形或寫字的程式，畫圖時滑鼠游標也同時變成筆狀。 (1) 按下滑鼠左鍵拖曳時就可以畫圖。 (2) 放開滑鼠左鍵時不會畫圖。 (3) 同時按下【Ctrl】鍵拖曳滑鼠，則可以畫粗線。 上機實作 Step1：專案名稱為『p8_04』。 Step2：建立空白表單。 Step3：編輯下頁程式碼。 Step4：執行程式。 (結果如右圖)

25 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 Dim draw_flag '可繪圖狀態 Dim StartX, StartY Private Sub Form_Load() draw_flag = False End Sub Private Sub Form_MouseDown(Button As Integer, Shift As Integer, X As Single, Y As Single) draw_flag = True Private Sub Form_MouseMove(Button As Integer, Shift As Integer, X As Single, If draw_flag = True Then If Shift = 4 Or Shift = 1 Or Shift = 0 Then DrawWidth = 1 If Shift = 2 Then DrawWidth = 2 '按Ctrl鍵 Line (StartX, StartY)-(X, Y) End If StartX = X StartY = Y Private Sub Form_MouseUp(Button As Integer, Shift As Integer, X As Single,

26 8.8：拖曳（Drag）與放置（Drop） 按住滑鼠左鍵不放，將該物件移動的動作稱為『拖曳』（Drag）。 把物件拖曳到目的地，然後放開滑鼠左鍵將物件放下的過程，則稱為『放置』（Drop）。 例如：在接龍遊戲中搬移撲克牌、在檔案總管中搬移檔案、在Word中搬移資料、、、都可以用此動作加以完成。 Visual Basic物件被拖曳的方法可分為『自動模式』與『手動模式』兩種。 自動模式：按住物件不放移動滑鼠游標就會有拖曳效果 手動模式：按住物件不放移動滑鼠游標時並不會馬上有拖曳效果，必須在程式中透過Drag方法設定物件是否可被拖曳。

27 8.8：拖曳（Drag）與放置（Drop） 設計拖曳與放下過程的程式碼，可能會使用的屬性、事件與方法有DragMode屬性、DragIcon屬性、DragDrop事件、DragOver事件和Drag方法： 名稱 種類 說明 DragDrop 事件 拖曳A物件到B物件處，並放下A物件時，將會觸發B物件的DragDrop事件。 DragOver 拖曳A物件越過B物件上方時，將會觸發B物件的DragOver事件。 DragMode 屬性 設定物件被拖曳的模式為『手動模式』或『自動模式』：0-由程式碼控制。（預設值）1-自動。 DragIcon 設定物件被拖曳時的代表圖示。若未設定（none）則將以箭頭游標與灰色方框做為拖曳圖示。 Drag 方法 Drag方法是用來設定物件是否可被拖曳。

28 8.8：拖曳（Drag）與放置（Drop） DragDrop事件
當拖曳A物件到B控制項或表單空白處並放下A物件時，將會觸發屬於B控制項或表單的DragDrop事件。 必須在DragDrop事件中做出放下A物件的反應，否則被拖曳的A物件在放開滑鼠後，就會跳回原來的地方。DragDrop的語法如下： 【語法說明】： 物件：指的是目的物件而不是被拖曳的物件，換句話說，當我們把物件A拖曳到物件B或表單空白處放下時，目的物件則為物件B或表單。 Source：指來源物件的名稱，也就是被拖曳的物件（如上範例，則為物件A）。Source As Contrl代表宣告Source變數為一個控制項變數。 X,Y：目前滑鼠游標的座標值。 Private Sub 物件_DragDrop(Source As Control , X As Single , Y As Single) ……………………………………………………………… End Sub

29 8.8：拖曳（Drag）與放置（Drop） DragOver事件
拖曳物件A經過物件B的上方時，會觸發物件B的DragOver事件。語法如下： 【語法說明】： Source、X、Y與DragDrop事件的參數意義相同。 State參數代表滑鼠游標與物件之間的關係： Private Sub 物件_DragOver(Source As Control, X As Single, Y As Single, State As Integer) ……………………………………………………………… End Sub State值 說　　　　　　明 進入：滑鼠游標剛剛進入物件範圍。 1 離開：滑鼠游標剛剛離開物件範圍。 2 越過：滑鼠游標正在物件範圍內移動。

30 8.8：拖曳（Drag）與放置（Drop） 自動模式（DragMode=1）
【實作範例8-5】： 設計可用滑鼠拖曳移動圖片的程式。 上機實作 Step1：專案名稱為『p8_05』。 Step2：在表單上產生控制項並 設定屬性。 Step3：編輯下列程式碼。 4 5 6 7 Private Sub picElfTarget_DragDrop(Source As Control, X As Single, Y As Single) picElfTarget.Picture = Source.Picture picElf.Visible = False End Sub

31 【實作範例8-5】 Step4：執行程式。

32 8.8：拖曳（Drag）與放置（Drop） 手動模式（DragMode=0） 物件.Drag Action
若將來源物件的DragMode屬性設定為『0-手動』（預設值），則物件就會在原來的固定位置（拖不動），除非我們在MouseDown事件程序中撰寫相關的程式碼，並且使用Drag方法來控制拖曳狀況。語法如下： 【語法說明】： Action是用來設定物件 是否能被拖曳： 設定允許拖曳的恰當時機 為按下滑鼠鍵時 （發生MouseDown事件時）。 在Mouse.Down事件程序中 指定『物件.Drag 1』敘述。 結束拖曳最適當的時機則是 放開滑鼠鍵時（發生MouseUp事件） ，在MouseUp事件程序中指定『物件.Drag 2』敘述。 物件.Drag Action Action值 動 作 說 明 取消拖曳。若在拖曳過程中執行『物件.Drag 0』敘述，則拖曳將會失效，也就是物件將會回到原來的地方。 1 允許拖曳。 2 結束拖曳，然後會觸發DragDrop事件。

33 【實作範例8-6】 【實作範例8-6】： 設計一個搬移文件的程式，並使用手動模式，自行控制拖曳的搬移效果。 上機實作
Step1：專案名稱為『p8_06』。 Step2：在表單上產生下列控制項並設定屬性。 Step3：編輯下頁程式碼。 Step4：執行程式。

34 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 Private Sub imgDoc_MouseDown(Button As Integer, Shift As Integer, X As Single, Y As Single) imgDoc.Drag 1 '允許拖曳 End Sub Private Sub imgDoc_MouseUp(Button As Integer, Shift As Integer, X As Single, imgDoc.Drag 2 '結束拖曳 Private Sub imgTarget_DragOver(Source As Control, X As Single, Y As Single, State As Integer) Select Case State Case '進入 lblQty.Caption = Str(Val(lblQty.Caption) - 1) imgTarget = imgOpen Case '離開 imgTarget = imgClose imgDoc.Drag 2 '結束拖曳 Case ' 越過 For I = 1 To X = I Next I End Select

35 【實作範例8-6】

36 8.8：拖曳（Drag）與放置（Drop） 拖曳技巧（移動物件）
自動模式或手動模式，對於控制項進行拖曳時事實上真正的物件仍停留在原地，當然您可以利用DragIcon屬性（設為與物件圖片相同）並且將原始圖片設為隱藏，然後在MouseUp處，重新設定圖片的位置來解決這個問題，但是由於拖曳游標並無法指定所有的圖檔格式，並且當物件並非圖檔時，也必須先製作物件的影像檔才能夠變成拖曳游標，因此我們使用另一個方法來完成相同功能。 【實作範例8-7】： 移動物件。 上機實作 Step1：專案名稱為『p8_07』。 Step2：在表單上產生控制項 並設定屬性。

37 【實作範例8-7】 Step3：編輯下列程式碼。 Step4：執行程式。 4 5 6 7 8 9 10 11 12 13 14 15 16
Dim X1, Y '起點座標 Private Sub imgCoin_MouseDown(Button As Integer, Shift As Integer, X As Single, Y As Single) X1 = X: Y1 = Y '設定起點座標 End Sub Private Sub imgCoin_MouseMove(Button As Integer, Shift As Integer, X As Single, If Button = 1 Then moveX = X - X1 moveY = Y - Y1 imgCoin.Move imgCoin.Left + moveX, imgCoin.Top + moveY '改變座標 End If

38 【實作範例8-7】

39 8.9：本章整合應用實例 【實作範例8-8】： 上機實作 設計一個找寶藏的遊戲，使用方向鍵來移動尋寶者的位置。
Step1：專案名稱為『p8_08』。 Step2：在表單上產生下列控制項並設定屬性。 Step3：編輯程式碼。 Step4：執行程式。

40 【實作範例8-8】

41 8.10：本章回顧 鍵盤與事件 滑鼠與事件 KeyPress事件 KeyDown事件與KeyUp事件 Click事件 DblClick事件
MouseDown、MouseUp與MouseMove事件 拖曳（Drag）與放置（Drop）

42 本章習題