放大與縮小手勢(shì)（1）

放大與縮小手勢(shì)對(duì)應(yīng)TransformGestureEvent. GESTURE_ZOOM事件類型，使用時(shí)要求兩個(gè)手指觸摸屏幕，同時(shí)向外或向內(nèi)做放縮動(dòng)作，如圖3-2所示。

圖3-2　放縮手勢(shì)

放縮手勢(shì)操作起來(lái)簡(jiǎn)單且直觀，在觸摸屏設(shè)備上的應(yīng)用范圍很廣，比如瀏覽網(wǎng)頁(yè)時(shí)控制頁(yè)面上的字體大小，查看地圖時(shí)控制地圖的縮放級(jí)別等。

下面的實(shí)例程序GestureZoom演示了如何使用ZOOM手勢(shì)來(lái)控制圖片的放縮。對(duì)loader對(duì)象添加手勢(shì)監(jiān)聽(tīng)器，事件響應(yīng)函數(shù)根據(jù)手勢(shì)動(dòng)作，實(shí)現(xiàn)放大或縮小加載的圖片。主程序Main.as的代碼如下：

package  
{  
import flash.display.Loader;  
import flash.display.Sprite;　  
import flash.events.Event;  
import flash.events.TransformGestureEvent;  
import flash.geom.Point;  
import flash.net.URLRequest;  
　  
public class Main extends AppBase  
{  
private var loader:Loader;  
　  
　override protected function init():void  
　{  
　　//使用Loader對(duì)象加載圖片  
　　loader = new Loader();  
　　loader.contentLoaderInfo.addEventListener(Event.COMPLETE, onLoadComplete);  
　　addChild(loader);  
　　//加載目錄下的圖片  
　　loader.load( new URLRequest("dog.jpg") );  
　}　　  
　//處理加載事件  
　private function onLoadComplete(e:Event):void  
　{  
　　loader.contentLoaderInfo.removeEventListener(Event.COMPLETE, onLoadComplete);  
　//判斷設(shè)備是否支持手勢(shì)事件  
　if ( Multitouch.supportsGestureEvents )  
　{  
　//對(duì)loader對(duì)象添加手勢(shì)事件監(jiān)聽(tīng)器  
　loader.addEventListener(TransformGestureEvent.GESTURE_ZOOM, onZoom);  
　}  
　}  
　//響應(yīng)放縮手勢(shì)  
　private function onZoom(e:TransformGestureEvent):void  
　{  
　　//記錄下手勢(shì)作用點(diǎn)的位置，采用loader對(duì)象中的本地坐標(biāo)  
　　var p:Point = new Point( e.localX, e.localY );  
　　//將坐標(biāo)轉(zhuǎn)換為父級(jí)容器的本地坐標(biāo)  
　　var parent_p:Point = this.globalToLocal(loader.localToGlobal(p));  
　　//對(duì)loader對(duì)象做放縮處理  
　　loader.scaleX *= e.scaleX;  
　　loader.scaleY *= e.scaleY;  
　　//loader對(duì)象縮放后，p點(diǎn)在loader對(duì)象中的坐標(biāo)沒(méi)有變，但在父級(jí)容器中的坐標(biāo)已發(fā)生變化，因此要//重新計(jì)算  
　　var parent_p2:Point = this.globalToLocal(loader.localToGlobal(p));  
　　//移動(dòng)loader，使得點(diǎn)p在父級(jí)容器的坐標(biāo)保持不變  
　　loader.x += (parent_p.x - parent_p2.x);  
　　loader.y += (parent_p.y - parent_p2.y);  
　}  
} 

在本例中，使用Loader對(duì)象加載程序目錄下的圖片。加載完成后，對(duì)loader對(duì)象添加手勢(shì)事件監(jiān)聽(tīng)器，代碼如下：

if ( Multitouch.supportsGestureEvents )  
{  
　loader.addEventListener(TransformGestureEvent.GESTURE_ZOOM, onZoom);  
} 

3.3.1　放大與縮小手勢(shì)（2）

由于Multitouch類的inputMode屬性默認(rèn)為處理手勢(shì)事件，因此無(wú)需更改交互模式即可處理手勢(shì)事件。使用手勢(shì)事件之前，對(duì)Multitouch類的supportsGestureEvents屬性做判斷是一個(gè)好習(xí)慣。事實(shí)上，僅僅做這一個(gè)判斷并不能確保設(shè)備就一定會(huì)支持所有的手勢(shì)。要做到萬(wàn)無(wú)一失，還需要檢查Multitouch的supportedGestures屬性，檢查的過(guò)程如下：

var index:int = -1;  
if ( Multitouch.supportedGestures != null )  
{  
index = Multitouch.supportedGestures.indexOf(TransformGestureEvent.GESTURE_ZOOM);  
}  
if(Multitouch.supportsGestureEvents && index != -1 )  
{  
//添加其他代碼  
} 

supportedGestures是一個(gè)Vector類型的數(shù)組，包含了設(shè)備支持的所有手勢(shì)類型。每個(gè)元素代表一個(gè)事件類型，如果設(shè)備任何一個(gè)手勢(shì)都不支持，supportedGestures的值為null。因此，要檢測(cè)設(shè)備是否支持某個(gè)手勢(shì)，可以使用Vector的indexOf方法進(jìn)行查找，確保代碼在設(shè)備上能夠正確運(yùn)行。

處理GESTURE_ZOOM 事件時(shí)，使用TransformGestureEvent 對(duì)象的scaleX與scaleY，即可分別獲取水平方向與垂直方向的縮放值。如果手指向外滑動(dòng)，表示放大，對(duì)應(yīng)的scaleX與scaleY值大于1，反之小于1。因此，用以下兩行代碼就可以實(shí)現(xiàn)放縮控制：

loader.scaleX *= e.scaleX;  
loader.scaleY *= e.scaleY; 

如果只是簡(jiǎn)單地對(duì)loader對(duì)象做放縮處理，會(huì)帶來(lái)一個(gè)問(wèn)題，那就是每次都是以loader的原點(diǎn)為中心點(diǎn)進(jìn)行縮放。而符合邏輯的做法，應(yīng)該是以手勢(shì)動(dòng)作的作用點(diǎn)為中心進(jìn)行縮放。也就是說(shuō)，要將手勢(shì)動(dòng)作的作用點(diǎn)設(shè)置為loader對(duì)象的注冊(cè)點(diǎn)。雖然ActionScript并沒(méi)有提供修改可視元件注冊(cè)點(diǎn)的功能，但可以模擬這個(gè)行為。整個(gè)過(guò)程并不難，關(guān)鍵在于坐標(biāo)轉(zhuǎn)換，步驟如下：

步驟1　記錄手勢(shì)作用點(diǎn)在loader對(duì)象中的本地坐標(biāo)，記為點(diǎn)p，它將是新的“注冊(cè)點(diǎn)”。

步驟2　以loader對(duì)象的父級(jí)容器為參照物，計(jì)算出點(diǎn)p在父級(jí)容器中的本地坐標(biāo)，記為點(diǎn)parent_p。

步驟3　對(duì)loader對(duì)象進(jìn)行縮放。

步驟4　計(jì)算縮放后點(diǎn)p在父級(jí)容器中的本地坐標(biāo)，記為點(diǎn)parent_p2。

步驟5　移動(dòng)loader對(duì)象的坐標(biāo)，讓點(diǎn)p在父級(jí)容器中的坐標(biāo)保持不變。

第5步操作的原理是：點(diǎn)p是loader對(duì)象的本地坐標(biāo)，因此對(duì)loader對(duì)象進(jìn)行縮放并不影響點(diǎn)p的值，但點(diǎn)p相對(duì)父級(jí)容器而言位置發(fā)生了變化，所以，根據(jù)縮放前后點(diǎn)p在父級(jí)容器中的位移，更改loader對(duì)象的坐標(biāo)，就能夠讓點(diǎn)p在父級(jí)容器的坐標(biāo)保持不變，從而達(dá)到了更改loader對(duì)象注冊(cè)點(diǎn)的目的。起決定性作用的兩行代碼如下：

loader.x += (parent_p.x - parent_p2.x);  
loader.y += (parent_p.y - parent_p2.y); 

請(qǐng)注意，程序GestureZoom的屏幕朝向設(shè)置為橫屏模式，在程序描述文件中對(duì)應(yīng)的設(shè)置項(xiàng)如下：

<aspectRatio>landscape</aspectRatio> 

到這里，一個(gè)簡(jiǎn)單的圖片放大鏡就完工了。

注意　程序中使用的圖片放在bin目錄中，和其他文件一起被包含在APK文件中，與主SWF文件位于同一目錄結(jié)構(gòu)，因此使用相對(duì)路徑就可以直接加載。