Pinch to zoom

ok so ive been looking around the forums but havent found an elegant solution to pinch to zoom without plugins.

sort of what i want to do:

create object at touchpoint 1

create object at touchpoint 2

measure distance between object 1 and 2

this distance is "X"

if distance becomes greater than X (objects moving away) then zoom in

if distance becomes less X (objects moving closer) then zoom out

zoom speed could be whatever, just not snapping.

would this work and could someone help please =)

Hello openfocus.

This is purely speculative, as I haven't messed with pinch-style controls yet, but I imagine you could save the point touched on the screen to a variable and measure the difference in a 'system tick' event.

It doesn't look like there's a way to measure two touch events at the same time, though. If only one can be tracked, it might be tricky; with X increasing right and Y increasing down, you might be able to measure just the X/Y position to determine if it's a pinch or spread motion.

I'll be curious if you get a demo of this working!

Hello openfocus.

This is purely speculative, as I haven't messed with pinch-style controls yet, but I imagine you could save the point touched on the screen to a variable and measure the difference in a 'system tick' event.

It doesn't look like there's a way to measure two touch events at the same time, though. If only one can be tracked, it might be tricky; with X increasing right and Y increasing down, you might be able to measure just the X/Y position to determine if it's a pinch or spread motion.

I'll be curious if you get a demo of this working!

yeah, thats exactly what im trying to do =) but i just cant figure out the variables and the events..

C2 does support multitouch...

Touch(index)

distance(touch(0).x, touch(0).y, touch(1).x, touch(1).y)

I think this it... though you might want to use touch.XAt or touch.AbsoluteX

Here is a working example with zooming and scrolling:

http://dl.dropbox.com/u/5426011/examples16/pinchzoom.capx

I used two layers and only scale layer 1. layer 0 I used to get the touch positions used for zooming. If I scaled the layout instead zooming became very unstable.

hound, that is impressive dude. I gotta keep that one on file! Thanks.

Here is a working example with zooming and scrolling:

http://dl.dropbox.com/u/5426011/examples16/pinchzoom.capx

I used two layers and only scale layer 1. layer 0 I used to get the touch positions used for zooming. If I scaled the layout instead zooming became very unstable.

thanks rojo, exactly what i was looking for! =D

btw, is there anyway to set max zoom, so that you cant zoom outside layout or super close?

hey R0J0hound I have some strange results with your example and I'm not sure whats causing that.

Sometimes (very often usually) after zooming using two touch points it constantly keep track of one point - I've added simple text to show touch counts.

So if You then try to zoom again with two touch points it's messing up cause there are three touches now. Even if you stop touching it still shows one touch active and there is no way to reset it (only reloading page works)

I've been testing this on three different Android phones.

any ideas? or maybe it's a bug in touch plugin (using r124 currently)

Thanks R0J0hound for that example !

But it doesn't really works for me neither.

I wanted to be able to scroll and zoom on a big map. Scroll should be constrained to the boundaries of the layout and zoom should have a min and a max intensity.

Any idea about how to do that ?

I did more testings and results are a bit confusing.

on mine Samsung S3 after zooming it usually keeps 1 touch active. Touching screen adds one more touch, so it's impossible to scroll anymore cause it's start to zoom due to two active touches. Reload page only can fix this. Tested on default browser and chrome for mobiles.

Same thing happens on different samsung mobile and htc, but it works perfectly on iphone 5 (?!).

How is this possible?

Here is the link to this simple project

http://dl.dropbox.com/u/34375299/testy/New%20project1213/index.html

Text object display

-fps

-layer scale

-touch counts

Can someone test it and post your results and phone/pad model?

As far as I can see touch event don't work the same on android and ios :/

Ok, here's the feedback for an ipad 2 :

• scroll is ok
• zoom is works but very eraticly. Sometime you pinch and it zooms out, sometimes the oposite.
• zoom scale range is between 1 and 0,5
• fps varies from 59 to 61 wen zooming, stays at 60 when no action.
• scrolling has no layout constraints. It's easy to make the map (Poland !) disappear in the margins.

Hope it helps

yep, all true heh

What about touch counts? Did it stays at 0 all the time after you finished "fingering" the screen? That's my biggest concern, after testing it on few android mobiles it usually stuck at 1, like touch event never stops.

Let's see.

touc count :

• One finger on screen : 1
• Two fingers on screen : 2
• 3 fingers : 3

...

no finger on screen : 0

On ipad 2, touch event stops as it should

Testing on ipad 3 using safari:

I find that if I use a finger from each hand on either side of the screen, it registers two touches and runs really smoothly, but if I use a finger and thumb from just the one hand to pinch with it flickers around between zoomed in and zoomed out (even when I'm not pinching) and can't quite work out if I'm touching the device with two or three fingers.