Shulou(Shulou.com)05/31 Report--

Today, the editor will share with you the relevant knowledge points about how to zoom in and out gestures in Android. The content is detailed and the logic is clear. I believe most people still know too much about this, so share this article for your reference. I hope you can get something after reading this article. Let's take a look at it.

Zoom in and out gestures (1)

Zoom in and out gestures correspond to TransformGestureEvent. The GESTURE_ZOOM event type, which requires two fingers to touch the screen while zooming out or inward.

The zoom gesture is simple and intuitive to operate, and it is widely used in touch screen devices, such as controlling the font size on the page when browsing the web, controlling the zoom level of the map when viewing the map, and so on.

The following example program, GestureZoom, demonstrates how to use ZOOM gestures to control the zoom of a picture. A gesture listener is added to the loader object, and the event response function zooms in or out of the loaded picture according to the gesture action. The code of the main program Main.as is as follows:

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 {/ / use Loader object to load picture loader = new Loader (); loader.contentLoaderInfo.addEventListener (Event.COMPLETE, onLoadComplete); addChild (loader) / / load the picture loader.load (new URLRequest ("dog.jpg")) in the directory;} / / handle the load event private function onLoadComplete (e:Event): void {loader.contentLoaderInfo.removeEventListener (Event.COMPLETE, onLoadComplete); / / determine whether the device supports gesture event if (Multitouch.supportsGestureEvents) {/ / A pair of loader objects add gesture event listener loader.addEventListener (TransformGestureEvent.GESTURE_ZOOM, onZoom) }} / / response to zoom gesture private function onZoom (e:TransformGestureEvent): void {/ / record the position of the action point of the gesture, using the local coordinates var p:Point = new Point (e.localX, e.localY) in the loader object; / / convert the coordinates to the local coordinates of the parent container var parent_p:Point = this.globalToLocal (loader.localToGlobal (p)) / / A pair of loader objects are scaled loader.scaleX * = e.scaleX; loader.scaleY * = e.scaleY; / / after the loader object is scaled, the coordinates of the p point in the loader object have not changed, but the coordinates in the parent container have changed, so it is necessary to / / recalculate var parent_p2:Point = scaleX (loader.localToGlobal (p)) / / move loader so that the coordinates of point p in the parent container remain the same loader.x + = (parent_p.x-parent_p2.x); loader.y + = (parent_p.y-parent_p2.y);}}

In this example, you use the Loader object to load the picture in the program directory. After loading, add a gesture event listener to the loader object as follows:

If (Multitouch.supportsGestureEvents)

{

Loader.addEventListener (TransformGestureEvent.GESTURE_ZOOM, onZoom)

}

Zoom in and out gestures (2)

Because the inputMode property of the Multitouch class defaults to handling gesture events, you can handle gesture events without changing the interaction mode. It is a good habit to judge the supportsGestureEvents property of the Multitouch class before using gesture events. In fact, making this judgment alone does not guarantee that the device will support all gestures. To be foolproof, you also need to check the supportedGestures property of Multitouch, which is as follows:

Var index:int =-1; if (Multitouch.supportedGestures! = null) {index = Multitouch.supportedGestures.indexOf (TransformGestureEvent.GESTURE_ZOOM);} if (Multitouch.supportsGestureEvents & & index! =-1) {/ / add other code}

SupportedGestures is an array of Vector types that contains all the gesture types supported by the device. Each element represents an event type, and if the device does not support any of the gestures, the value of supportedGestures is null. Therefore, to detect whether the device supports a gesture, you can use Vector's indexOf method to find it to ensure that the code runs correctly on the device.

When handling the GESTURE_ZOOM event, use the scaleX and scaleY of the TransformGestureEvent object to get the horizontal and vertical scaling values, respectively. If the finger slides outward, it means magnification, and the corresponding scaleX and scaleY values are greater than 1, and vice versa. Therefore, scaling control can be achieved with the following two lines of code:

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

If you simply scale the loader object, you will have a problem, that is, you will scale around the origin of the loader every time. The logical approach should be to zoom around the action point of the gesture. That is, set the action point of the gesture to the registration point of the loader object. Although ActionScript does not provide the ability to modify the visual component registration point, it can simulate this behavior. The whole process is not difficult, the key is the coordinate transformation, the steps are as follows:

Step 1 records the local coordinates of the gesture action point in the loader object, marked as point p, which will be the new "registration point".

Step 2 takes the parent container of the loader object as the reference and calculates the local coordinates of point p in the parent container, which is recorded as the point parent_p.

Step 3 zooms the loader object.

Step 4 calculates the local coordinates of the scaled point p in the parent container, recorded as the point parent_p2.

Step 5 move the coordinates of the loader object so that the coordinates of point p in the parent container remain the same.

The principle of step 5 operation is: point p is the local coordinates of the loader object, so scaling the loader object does not affect the value of point p, but the position of point p has changed relative to the parent container, so, according to the displacement of point p in the parent container before and after scaling, change the coordinates of the loader object, you can make point p in the parent container coordinates remain unchanged, thus achieving the purpose of changing the loader object registration point. The two decisive lines of code are as follows:

Loader.x + = (parent_p.x-parent_p2.x)

Loader.y + = (parent_p.y-parent_p2.y)

Notice that the screen orientation of the program GestureZoom is set to landscape mode, and the corresponding settings in the program description file are as follows:

Landscape above is all the content of the article "how to zoom in and out gestures in Android". Thank you for reading! I believe you will gain a lot after reading this article. The editor will update different knowledge for you every day. If you want to learn more knowledge, please pay attention to the industry information channel.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.