Flash攝像頭遊戲課件的設計之動畫製作論文

摘要：

      攝像頭遊戲是隨着技術的進步產生出來的一種新的遊戲形式，它擺脱了鼠標與鍵盤的限制，給遊戲者以全新的互動體驗。Flash 8提供的位圖處理功能為Flash攝像頭遊戲的實現提供了可能。將攝像頭遊戲技術引入到Flash課件的開發，可以充分發揮其互動性和趣味性，與傳統Flash課件相比，具有其不可替代的優勢。該文提出設計Flash攝像頭遊戲課件的基本原則，並以《水果樂園》課件為例，詳細介紹了開發的過程和主要實現方法，為攝像頭遊戲類課件製作提供了參考。

關鍵詞：Flash；攝像頭遊戲；

一、引言

攝像頭遊戲是隨着攝像頭的普及和圖形圖像技術的不斷髮展而出現的。它擺脱了鼠標鍵盤的限制，給遊戲者帶來全新的遊戲體驗，能夠實現許多傳統遊戲無法實現的遊戲效果。它通過攝像頭將玩家投影到遊戲中，由玩家自己做動作與遊戲進行交互。畫面中登場的敵人或道具都將對玩家的動作即刻做出反應，讓玩家體驗到前所未有的新鮮感。

Flash課件是用Flash的形式表現教學內容一種課件形式。Flash課件充分利用了Flash的直觀性、互動性以及娛樂性，能夠有效的調動學生的學習積極性，激發學生的學習樂趣，在當前的教學過程中發揮着越來越大的作用。Flash攝像頭遊戲課件整合了攝像頭遊戲和Flash課件的優點，充分體現了寓教於樂的教學思想。它帶給學生全新的遊戲感受，能夠極大的激發學生的學習興趣。它能夠激發學生的多種感觀刺激，建立強烈的真實感，通過遊戲過程中學生與遊戲的互動，還能夠促進學生手、耳、眼以及肢體的相互協調，達到較好的教學效果。

二、Flash攝像頭遊戲課件的設計原則

Flash攝像頭遊戲課件具有較好參與性、體驗性，能夠有效增強學習效果，提高學習效率，特別適合於學生動作類技能的訓練。在設計的過程中，應遵循如下原則，體現其獨特的優勢。

（1）教學性原則

這是所有課件，應用於教學的最基本的要求，該類課件也不例外，在設計的過程中，必須針對一定的教學目標，遵循認知過程的一般規律，組織教學內容和教學活動。緊密圍繞以學生學習為中心的設計思路。

（2）易用性原則

攝像頭遊戲課件的交互，計算機對於學習者的動作迴應，都是建立在動作檢測，捕捉學習者動作影像的基礎上。設計過程中應考慮讓學習者的操作儘量簡便，易於上手使用。做好課件使用的幫助或者使用手冊。

（3）科學性原則

課件的內容，不能有科學性的錯誤，這也是設計中基本要求，必須對課件所有呈示的內容，進行嚴格仔細的審查，保證學生看到的所有知識點，都必須科學、準確，一般由課件開發小組中學科專家把好關。

（4）藝術性原則

如果一個課件的展示不但取得良好的教學效果，而日‘使人賞心悦目，使人獲得美的享受，則説課件具有較高的藝術性。這樣的課件是好的內容與美的形式的統一，美的形式能激發學生的興趣，史好地表現內容。其表現有:展示的對象結構對稱，色彩柔和，搭配合理，有審美性。

（5）體驗性原則

攝像頭遊戲課件因其交互的多維化，全方位，檢測學習者動作，使得學習者的沉浸感很強，要求學習者的個人形象和課件環境融合的過程中，能讓學習能有身臨其境的感覺，所以課件在設計的過程中，注意課件環境，界面的元素，聲音的效果，都必然能激發學習者的投入感。該原則是攝像頭遊戲課件設計過程中最重要的原則，也是整個課件製作的關鍵，成敗所在。

三、Flash攝像頭遊戲課件的設計與實現

在兒童英語教學中，引入Flash攝像頭遊戲課件，使得兒童擺脱鍵盤和鼠標的單一化的交互方式，而進行身體動作與計算機的交互，增強兒童學習的體驗感，能較好的輔助英語的學習。以下是設計與開發的水果樂園課件的實現步驟和主要功能代碼。

1.攝像頭圖像的捕獲

使用Camera類實現對攝像頭圖像的捕獲。()方法返回對用於捕獲視頻的 Camera 對象的引用。當 SWF 文件嘗試訪問 () 返回的攝像頭時，Flash Player 顯示拒絕對話框，用户可從中選擇是允許還是拒絕對攝像頭的訪問。setMode()方法將攝像頭的捕獲模式設置為最符合指定要求的本機模式。//新建一個Camera對象，實例名為my_cam，並設置對象屬性。var my_cam:Camera = ();my_ode(160,120,30,true);

2.攝像頭圖像的顯示

1)顯示圖像

若要實際開始捕獲視頻，必須將 Camera 對象附加到 Video 對象。attachVideo(source:Object) : Void指定將在舞台上的 Video 對象的邊界內顯示的視頻流 (source)。//新建一個Video對象，將Camera對象附加到Video上。var my_video:Video;my_chVideo(my_cam);

2)水平翻轉圖像

由於攝像頭中看到的圖像與遊戲者本人的方向相反。為了方便遊戲者操作遊戲，在加載圖像時應該把圖像左右翻轉。這一操作非常重要，將直接影響遊戲者的遊戲體驗。

Video._rotation 屬性可以實現對Video圖像的旋轉，但是無法實現左右翻轉的效果。

       Video._xscale 屬性指示從 Video 對象註冊點開始應用的 Video 對象的水平縮放比例 。當x軸的水平縮放比例為-100時，則可以實現對Video對象的水平翻轉。默認註冊點為 (0，0)。縮放本地座標系統將影響 _x 和 _y 屬性設置，這些設置是以整像素定義的。由於翻轉時是以左上角主測點為中心，因此在水平翻轉之後，Video對象的座標雖然未發生改變，但是整體位置向左平移了Video. _width個像素。因此翻轉之後我們需要設置Video的新座標為Video._x = Video._x+Video._width。

3.獲取圖像信息

要對獲取的圖像進行分析，必須將從攝像頭獲取的圖像信息提取出來。在Flash8中， Bitmap對象存儲了圖像中各點的RGB通道信息以及Alpha通道信息，可以使用new方法建立一個Bitmap對象。然後使用draw（）方法提取某一時刻video對象中的像素信息。

draw(source:Object,[matrix:Matrix],[colorTransform.:ColorTransform], [blendMode:Object], [clipRect:Rectangle], [smooth:Boolean]) : Void使用 Flash Player 向量呈現器在目標圖像上繪製源圖像。使用 Matrix、ColorTransform、BlendMode 對象以及目標 Rectangle 對象來控制呈現的執行方式。或者也可以指定縮放時是否應對位圖進行平滑處理。這隻適用於當源對象是 BitmapData 對象時的情況。

import apData;

//創建BitmapData對象Var snapshot:BitmapData=newBitmapData(output_vid._width，output_vid._height);

//從my_video獲取當前圖像(my_video);

4.運動檢測的實現

該部分是整個攝像頭遊戲實現的核心。主要利用了Flash 8的位圖處理功能，即BitmapData類。

1)基本思路

我們可以使用getPixel(x，y)獲取前一張圖片上每個像素點的像素值，然後對比後一張圖片中的每一點的像素值，當像素的亮度差值變化達到一定程度時，認為該點發生了運動變化。通過這種方式，得到前後兩張圖片的負片效果圖。

//閥值tolerance=10;

//獲取當前圖像now某一點的RGB值nc=ixel(x，y);

//紅色通道nr=nc16&0xff;

//綠色通道ng=nc8&0xff;

//藍色通道nb=nc&0xff;

//計算該點亮度值nl=(nr*nr + ng*ng + nb*nb)

//獲取前一快照before同一點的RGB值bc=ixel(x，y);

//紅色通道br=bc16&0xff;

//綠色通道bg=bc8&0xff;

//藍色通道bb=bc&0xff;

//計算該點亮度值bl=(br*br + bg*bg + bb*bb);

//計算亮度值的變化d=d((bl-nl));

if(dtolerance){//該點發生了變化　}

但是這種方法存在計算效率問題。按圖像大小為180*160像素，每秒30幀計算，每計算一副圖片需要的計算次數為180*160*30。圖像的像素越大，需要的計算次數就越多。採用隔點檢測的方法可以在一定程度上緩解計算壓力，即每隔n個像素檢測一次，這樣電腦的計算次數減少為原來的1/n。

2)改進思路

Flash8提供的圖像混合模式可以解決上面遇到的效率問題。Flash8提供了11種圖像混合模式。每一種混合模式可以得到不同的混合效果。Different 混合模式是基於兩張圖片之間的亮度差值進行計算，從而得到圖片的負片效果。利用該模式，便可以得到移動像素的檢測圖像。

//將前一張快照before的圖像繪製到當前快照now上，使用different混合模式(before， new Matrix()， null， "difference");

圖像中黑色表示沒有發生移動，其他顏色表示發生了移動。由於Flash8提供的混合模式是採用C++編碼實現的，因此運行效率要比Action Script編碼更加高效。

5.動態顯示檢測圖像

1)處理檢測圖像

通過以上兩種方式得到的圖像中色彩範圍較廣，這增加了統計上面的困難。通過使用 threshold() 方法，可以隔離和替換圖像中的顏色範圍，並對圖像像素執行其它邏輯操作。threshold（）函數根據指定的閾值測試圖像中的像素值，並將通過測試的像素設置為新的顏色值。這樣，便得到了清晰醒目的.檢測圖像。

//將大於閥值0xFF111111的像素替換為綠色。

shold(myBitmap， angle， eft， ""， 0xFF111111， 0xFF00FF00， 0x00FFFFFF， false);

2)檢測圖像的顯示

Bitmap對象無法直接在舞台上顯示，必須附着在MovieClip上面才能顯示。因此可以使用MovieClip類的attachBitmap()方法，將獲取的圖像信息顯示出來。

//創建一個影片剪輯來顯示當前圖像teEmptyMovieClip(當前，extHighest Depth());

//將攝像頭獲取的圖像顯示在影片剪輯內bitmap_chBitmap(now，1);

3)檢測圖像的動態顯示

要實現檢測圖像的動態顯示，必須不斷的更新當前圖像now和歷史圖像before，並進行混合處理。可以把檢測圖像的功能寫成方法snapshot()，每隔100毫秒調用一次。

偽代碼如下：

function snapshot() {//獲取當前圖像//獲取檢測圖像//將檢測圖像繪製到//將檢測圖像中RGB超過閥值0xFF111111的部分替換成綠色//顯示檢測圖像//本次檢測完成之後，當前圖像便成為了歷史圖像。為下一次檢測做好準備。preBitmap = e();}

在該方法中，關鍵在於每次檢測完成之後當前圖像和歷史圖像的更新。

6.檢測特定區域內的運動狀態

經過上面幾步操作，已經得到了檢測圖像。檢測圖像是對整幅圖像的運動情況的反映。在遊戲中，經常需要檢測的是某一特定區域的運動狀態。

1)檢測某點的運動狀態

因為已經到了檢測圖像，所以在檢測某一點運動狀態時，只需要判斷檢測圖像上該點的RGB值是否大於閥值。

偽代碼如下：

pix = ixel(x， y);if (pix大於閥值) {//該點發生了運動}

2)檢測某區域的運動狀態

由於燈光因素、攝像頭圖像噪點等干擾因素的存在，每次只檢測一個點容易造成檢測結果的不穩定。因此，大多采用區域檢測的方式。即在檢測某點運動狀態時，檢測的不僅僅是這個點，而是以該點開始的n*n個像素的區域（n的取值根據實際情況確定，在檢測點數量較多時，n的值不宜取太大。）。如果檢測區域內的像素點變化數量超過一定閥值，如60％，則認為該區域發生了運動。

需要注意的一點是，由於看到的圖像是經過水平翻轉的，但原有的圖像內部座標系並沒有發生變化，因此，檢測時的取點位置也要水平翻轉。

//以(rectx，recty)為頂點的rectw*recth的矩形區域的運動情況

function ismove(a， rectx， recty， rectw， recth) {var i， j;

var sum = 0;

    var pix;

for (i=1; i=rectw; i++) {for (j=1; j=recth; j++) {//圖像水平翻轉後取點位置相對變化pix = ixel(160-i-rectx， j+recty);

if (pix132361) {sum++;

//trace("sum="+sum);

if (sum(recth*rectw/2)) {return (sum);

//該區域發生了運動} else {return 0;}}

在該方法中，檢測圖像、檢測區域頂點座標、檢測區域大小都為作為變量輸入。採用這種方法，提高了程序的重用性，還可以實現對運動物體的檢測。

3)檢測點的設置

所謂檢測點，實際是一個影片剪輯。在進行區域檢測時，以該影片剪輯的座標（x，y）確定檢測區域的座標位置。檢測點可以是一個不可見的輔助點，也可以是舞台中運動的物體。當把運動物體做為檢測點時，隨着物體的移動，檢測區域也隨之移動，因此可以實現對運動物體的檢測。檢測點的作用：一是可以起到輔助點的作用，簡化了檢測區域定位的繁瑣工作，使定位操作可視化。二是實現了代碼的重用，起到了簡化程序的作用。

7.實現攝像頭運動檢測的控制接口

遊戲中檢測點接口的作用就是返回舞台中被觸碰的檢測點編號。在接口函數中，調用了以上幾個功能函數。返回值為檢測點編號。

function istouch() {var max:Number = 0;

var min:Number;

var num:Number;

for (var i = 1; i=9; i++) {//檢測第i個檢測點是否被觸碰min = ismove(myBitmap, this["point"+i]._x-xpoint, this["point"+i]._y-ypoint, 10, 10);

//每次只能激發一個點，選擇9個點中移動最顯著的一個if (max max = min;num = i;}}

   if (num) {//返回被觸碰的點的序號return (num);} else {//一個檢測點也沒碰到！;return 0;}}

8.遊戲交互功能的實現

遊戲功能交互的實現方法和其他Flash遊戲大體類似。在此遊戲中，主要包括3大功能模塊：子彈系統，氣球系統 和主控制系統。

1)子彈系統的實現

該部分主要是實現子彈的運動。遊戲中有9個檢測點，每個檢測點都可以發射子彈。各位置發射的子彈運動方向是不同的。第i個檢測點的子彈方向為rot=i*20，初始位置在界面底部中央。

this._x = this._x-30*(rot*);

this._y = this._y-30*(rot*);

當子彈出界時，要使用adMovie()方法將該子彈實例銷燬，釋放內存。

2)氣球系統的實現

該部分主要是實現氣球的碰撞檢測，判斷氣球是否被子彈擊中需使用hitTest()函數。該函數有兩種用法：

用法 1：

        根據 shapeFlag 設置，將 x 和 y 座標與指定實例的形狀或邊框進行比較。如果 shapeFlag 設置為 true，則只計算在舞台上的實例實際佔據的區域，並且如果 x 和 y 在任意一點重疊，則返回 true 值。

用法 2：

         計算 target 和指定實例的邊框，如果它們在任意一點上重疊或交叉，則返回 true。

3)主控制系統的實現

主控制系統是實現互動功能的核心部分。主要工作就是把遊戲中所有的功能模塊集成起來，對各功能模塊進行調度和顯示。一方面，主控制系統要接收從攝像頭功能接口傳遞的信息；一方面根據接收的信息執行相應的功能代碼。

四、結束語

Flash攝像頭遊戲課件能夠實現很多傳統Flash課件難以實現的效果，特別是對操作技能的培養。我們開發的《水果樂園》課件提供給一些小學，進行了英語學習實踐,效果還不錯。但是，對於Flash攝像頭遊戲課件應用於學生高級思維策略的訓練，還沒有進行深入的研究，特別是角色扮演型、問題探究型等學習模式等實施，有待進一步的的探索和實踐。