Kinect03 程式顯示Kinect One 持續傳入的彩色影像(1920x1080 @30fps)，提供影像分色處理選項與影像存檔功能，顯示已存檔數目，並加上Kinect Gesture 操控功能，讓使用者除了滑鼠、觸控螢幕操控之外，亦可以身體的動作或姿勢操控。

1. Kinect 2.0 Programming
(3)
Kinect03
FELab
2015/12/12
1

2. Kinect Gesture 偵測與應用
 Kinect03 目標、開發、執行
 Kinect Gesture 偵測與應用系統簡介
 Kinect03 畫面規劃
 Kinect03 實作
2

3. 3

4. 4

5. 5

6. 6

7. 7

8. 8

9. 9
Kinect03 程式顯示 Kinect One 持續傳入的彩色影像
(1920x1080 @30fps)，提供影像分色處理選項與影像
存檔功能，顯示已存檔數目，並加上 Kinect Gesture
操控功能，讓使用者除了滑鼠、觸控螢幕操控之外，
亦可以身體的動作或姿勢操控。
開發工具為 Windows 10 加上 Visual Studio 2015 環境
之 C# + WPF + Kinect for Windows SDK 2.0
Kinect03 目標、開發、執行

10. 10
程式執行時需將 Kinect One 接上電腦之 USB 3.0 插
槽
建議將螢幕解析度調為 1920x1080 或以上
Kinect03 專案下載 (Kinect03.zip)
https://onedrive.live.com/redir?resid=AB6DA2015C8C4A60!2310&a
uthkey=!AB3b_EjI6m_yKtA&ithint=file%2czip

11. 11
Kinect Gesture 偵測與應用系統簡介
Gesture 指身體做出某種動作，例如
右手往左揮 (前一選項， Previous 類別)
「COLOR」→「BLUE」→「GREEN」→「RED」
左手往右揮 (後一選項， Next 類別)
「COLOR」→「RED」→「GREEN」→「BLUE」
右手肘高舉 (影像存檔， Save 類別)

12. 12
右手往左揮
開始時，右手腕在右手肘右前方
揮動過程，右手腕往左移動一定的距離
整個揮動過程必須在設定的時間內完成
左手往右揮
開始時，左手腕在左手肘左前方
揮動過程，左手腕往右移動一定的距離
整個揮動過程必須在設定的時間內完成

13. 13
每種姿勢的偵測功能寫成一個類別 (class)
程式同時偵測三種動作或姿勢，若有符合任一動作
或姿勢標準，則觸發該事件。
Previous、Next、Save 三個類別觸發的事件，其功
能等於 Red、Green、Blue、Color、Save 五個控制項
的 Click 事件。

14. 14
視窗大小為 1440x810
一個 Image 控制項顯示 1280x720 @30fps 即時影像
四個 Button 控制項分別做為影像分色處理的選項
(Red、Green、Blue、Color)
一個 Button 控制項自動將畫面影像以 jpg 格式，存
檔於 Kinect03 專案之與 Kinect03.exe 相同檔案夾，
檔名預設為 color000001.jpg、、、color999999.jpg。
Kinect03 畫面規劃

15. 15
一個 Label 控制項顯示已儲存影像檔案數目
利用 WriteableBitmap 類別配置記憶體區塊，將記憶
體區塊的影像即時顯示在 Image 控制項
每個 Kinect One 傳入的彩色影像 (Frame)，存入指定
的記憶體區塊，經影像處理後，傳至 Image 控制項
呈現出來。
一個 KinectSensor 類別的物件代表一台 Kinect One
(一台電腦只能接一台設備)

16. 16
視窗大小為 1440x810 (Kinect01)
Image 控制項顯示 1280x720 圖像 (ColorImage)
Button 控制項操控紅色影像 (Red)
Button 控制項操控綠色影像 (Green)
Button 控制項操控藍色影像 (Blue)
Button 控制項操控回復彩色影像 (Color)
Button 控制項操控影像存檔 (Save)
Label 控制項顯示已存檔影像數目 (Count)

17. 17
建立 Kinect03 方案
 起動 Visual Studio Professional 2015
 點選「檔案(F)」 → 「新增(N)」 → 「專案(P)…」 → 「Visual
C#」 → 「WPF 應用程式」
 「名稱(N)」填入 Kinect03 (原來是WpfApplication1)
 「位置(L)」利用瀏覽(B)… 選定目錄
 點選「確定」
Kinect03 實作

18. 18
加入 Microsoft.Kinect 組件使 SDK 可以被專案使用
 在『參考』處按右鍵， 點選『加入參考(R)』
 點選「擴充功能」 → 挑選「Microsoft.Kinect 2.0.0.0」
→ CheckBox 處點一下使出現打勾
 點選「確定」

19. 19
透過 Window 的屬性視窗修改 Window 的屬性值
 名稱：Kinect03
 將 Kinect03 屬性修改為
FontSize：20
Height：810
ResizeMode：CanMinimize
Title：Kinect ColorFrame (Gesture)
Width：1440

20. 20
將 Kinect03 視窗加入一個 Image 控制項
 滑鼠在工具箱的 Image 點一下，然後在視窗設計區點一下
 名稱：ColorImage
 將 ColorImage 屬性修改為
Height：720
Margin：70 0 0 0
Width：1280

21. 21
將 Kinect03 視窗加入四個 Button 控制項
 名稱：Red
 將 Red 屬性修改為
Background：單色筆刷 (R：255 G：0 B：0 A：100%)
Content：RED
FontSize：32
Height：45
Margin：70 725 0 0
Width：150

22. 22
 名稱：Green
 將 Green 屬性修改為
Background：單色筆刷 (R：0 G：255 B：0 A：100%)
Content：GREEN
FontSize：32
Height：45
Margin：250 725 0 0
Width：150

23. 23
 名稱：Blue
 將 Blue 屬性修改為
Background：單色筆刷 (R：0 G：0 B：255 A：100%)
Content：BLUE
FontSize：32
Height：45
Margin：430 725 0 0
Width：150

24. 24
 名稱：Color
 將 Color 屬性修改為
Background：漸層筆刷 (放射漸層 R：160 G：160 B：80
A：100%)
Content：COLOR
FontSize：32
Height：45
Margin：610 725 0 0
Width：150

25. 25
將 Kinect03 視窗加入一個 Button 控制項
 名稱：Save
 將 Save 屬性修改為
Background：單色筆刷 (R：180 G：100 B：220 A：100%)
Content：SAVE
FontSize：32
Height：45
Margin：860 725 0 0
Width：150

26. 26
將 Kinect03 視窗加入一個 Label 控制項
 名稱：Count
 將 Count 屬性修改為
Background：單色筆刷 (R：210 G：140 B：70 A：100%)
Content：存檔影像：000000
FontSize：32
Height：45
Margin：1040 725 0 0
Width：310

27. 27
 滑鼠雙擊 Kinect03 事件視窗的 Loaded 右邊空白欄位
 滑鼠雙擊 Kinect03 事件視窗的 Unloaded 右邊空白欄位
 滑鼠雙擊 Red 事件視窗的 Click 右邊空白欄位
 滑鼠雙擊 Green 事件視窗的 Click 右邊空白欄位
 滑鼠雙擊 Blue 事件視窗的 Click 右邊空白欄位
 滑鼠雙擊 Color 事件視窗的 Click 右邊空白欄位
 滑鼠雙擊 Save 事件視窗的 Click 右邊空白欄位
加入 Kinect03 專案欲處理的事件

28. 28
現在 MainWindow.xaml 檔案如下

29. 29

30. 30

31. 31
寫入程式碼至 MainWindow.xaml.cs 檔案

32. 32

33. 33
+= 之後接著按 Tab 鍵

34. 34
輸入 colorFrameReader.FrameArrived +=
接著按 Tab 鍵
自動產生 ColorFrameReader_FrameArrived 函式
每一個 RGB 影格 (Frame) 傳入時，會觸發一次
FrameArrived 事件，希望程式對一個 RGB 影格做甚
麼處理，就寫在ColorFrameReader_FrameArrived 函
式裏，每秒觸發 30 次。

35. 35

36. 36

37. 37

38. 38

39. 39

40. 40

41. 41
建置 Kinect03 方案
 「建置(B)」 → 「重建方案(R)」
執行 Kinect03 方案
 「偵錯(D)」 → 「啟動但不偵錯(H)」

42. 42
現在專案執行畫面如下 (Kinect 圖是鏡像)

43. 43
 在『C# Kinect03』處按右鍵 ，點選『加入(D)』 → 『類別
(C)…』 →「名稱(N)」填入 Previous.cs →「新增(A)」
 在『C# Kinect03』處按右鍵 ，點選『加入(D)』 → 『類別
(C)…』 →「名稱(N)」填入 Next.cs →「新增(A)」
 在『C# Kinect03』處按右鍵 ，點選『加入(D)』 → 『類別
(C)…』 →「名稱(N)」填入 Save.cs →「新增(A)」
加入 Kinect03 三個動作或姿勢偵測的類別

44. 44
寫入程式碼至 Previous.cs 檔案

45. 45

46. 46

47. 47

48. 48

49. 49
寫入程式碼至 Next.cs 檔案

50. 50

51. 51

52. 52

53. 53

54. 54
寫入程式碼至 Save.cs 檔案

55. 55

56. 56

57. 57

58. 58
寫入程式碼至 MainWindow.xaml.cs 檔案

59. 59

60. 60

61. 61

62. 62

63. 63

64. 64

65. 65

66. 66

67. 67

68. 68

69. 69

70. 70

71. 71

72. 72

73. 73
建置 Kinect03 方案
 「建置(B)」 → 「重建方案(R)」
執行 Kinect03 方案
 「偵錯(D)」 → 「啟動但不偵錯(H)」

74. 74
加上三種動作或姿勢體感操控