2013年8月1日 星期四

用AS3快樂的判斷手勢所畫出來的圓形吧!!


因為之前公司的需求,
研究了一下怎麼樣判斷Starling環境下所畫出來的手勢,
雖然有些功能已經沒有需求了,
不過因為覺得很有趣,
所以還是寫了這篇紀錄一下XD

主要是參考這篇文章

當然不是照單全收,
但這一篇文章關於方向的圖解讓我得到很多想法,
於是便實作了出來。
當然,有更好的做法也請知情的大大指教一下XD

首先,
我們可以透過Starling TouchEvent的BEGIN和END所取得的座標來換算角度,
再依照角度來判斷手勢所滑行的方向,
但那也只能知道方向,並無法知道使用者到底畫了些什麼,
所以我們還要再加入MOVED事件並傳入當前座標來記錄使用者到底滑了些什麼,
並將這些座標存入一個容器內。

var degree:Number = Math.atan2(y - prevPosY, x - prevPosX) * 180 / Math.PI;
var direction:int = (degree + 180.0 + 15) / 45;
direction = direction == 0? DIR_LEFT: direction;
prevPosX = x;
prevPosY = y;
if (vCommand.indexOf(direction) == -1)
{
vCommand.push(direction);
}
if (checkDir != direction)
{
checkDir = direction;
vTotalCommand.push(direction);
}

vCommand內(原諒我取了個怪名稱)所記錄的是MOVED事件時有出現過的方向,不重複記錄,
vTotalCommand則是將所有手勢方向全部記錄下來。

接著在END事件時做整個判斷,
這裡我的想法是,要畫圓的話勢必8個方向都會用到,
所以判斷圓的做法很簡單,就是看vCommand的長度夠不夠。

if (vCommand.length > 6)
{
//這是圓形
}

因為沒有要做到非常嚴警(案子的關係),所以我只檢查長度是不是大於6個,
而6個長度已經幾乎是個圓了。

若還要判斷是順時針或逆時針方向所畫的圓,
只需要把所有元素取出來做比較就好。

var count:int = 0;
for (var i:int = 0; i < vCommand.length - 1; i++)
{
if (vCommand[i] > vCommand[i+1])
{
count++;
}
else
{
count--;
}
}
if (count < 0)
{
//順時針
}
else
{
//逆時針
}

若是想要判斷像是Z字型呢?
先用一個Array或Vector將Z自行需要的方向記錄好,
接著把vTotalCommand拿出來對元素做判斷就好了。
這裡我是寫成函式,
若是Z字型則回傳true。

private function checkZGraphic():Boolean
{
const zArray:Array = [4, 7, 4];
var first:int = vTotalCommand.indexOf(zArray[0]);
var second:int = vTotalCommand.indexOf(zArray[1]);
var last:int = vTotalCommand.indexOf(zArray[2], second);

if ( -1 == first)
{
return false;
}
if ( -1 == second)
{
return false;
}
if ( -1 == last)
{
return false;
}

if (first < second && second < last)
{
return true;
}
else
{
return false;
}
}

是不是很簡單呢(?)

那麼下次見XD



沒有留言:

張貼留言