2011年8月30日

Flex in Mobile(第四篇、Mobile觸碰螢幕操作方法)


首先創建一個新的Moblie專案,在views中添加新的view,命名為MultiTouchView
,然後在MXML中天下以下程式碼 :


<fx:Declarations>
        <fx
:Component className="Circle">
            <s
:Ellipse width="140" height="140">
                <s
:fill>
                    <s
:SolidColor color="blue" />
                </s
:fill>
            </s
:Ellipse>
        </fx
:Component>
</fx
:Declarations> 


Script區塊新增下面程式碼
<![CDATA[

            protected var circles:
Object = new Object();
            
            protected function init
():void
            
{

                Multitouch.
inputMode = MultitouchInputMode.TOUCH_POINT;
                

                
this.stage.addEventListener(TouchEvent.TOUCH_BEGIN, onTouchBegin);
                
this.stage.addEventListener(TouchEvent.TOUCH_END, onTouchEnd);
                
this.stage.addEventListener(TouchEvent.TOUCH_MOVE, onTouchMove);
            
}

            protected function onTouchBegin
(event:TouchEvent):void
            
{
                var c:Circle = new Circle
();
                c.
x = event.localX -70;
                c.
y = event.localY -70;
                addElement
(c);
                circles
[event.touchPointID] = c;
            
}
            

            protected function onTouchEnd
(event:TouchEvent):void
            
{
                
if (circles[event.touchPointID] != null)
                
{
                    removeElement
(circles[event.touchPointID]);
                    
delete circles[event.touchPointID];
                
}
            
}


            protected function onTouchMove
(event:TouchEvent):void
            
{
                
if (circles[event.touchPointID] != null)
                
{
                    circles
[event.touchPointID].x = event.localX -70;
                    circles
[event.touchPointID].y = event.localY - 70;
                
}
            
}
        
]]>

這段程式碼首先定義了一個自訂元件Circle,並使用橢圓形繪製,然後在程式碼區塊中宣告了它的引用,在初始化函式中我將螢幕的inputMode更改為MultitouchInputMode.TOUCH_POINT模式才能支援多點,並且讓我們的顯示螢幕(stage)監聽了三個事件,分別為觸碰開始、觸碰移動、觸碰結束,分別對這些事件使用不同方式處理。

完成!!
將它運行在你的實體機器上,就可以測試了!!

沒有留言:

ShareThis