Pinch to zoom

Get help using Construct 2

Post » Fri Feb 24, 2012 9:29 am

Many games on mobiles use the "pinch to zoom" feature.

I didn't see any event for pinching, how is it possible to do it myself ?

One difficulty is that we cant get both finger coordinate I think, well I just began to use construct 2 a few days ago so I'm not sure :)

On solution would be to let the browser do the work, but for some reason my construct app don't zoom as other web pages do.
It may have something to do with the meta tag "viewport" attribute "user-scalable", but I don't see how to set that from construct (and it would be nicer to control the pinch event also).

Ah and is there a mouse wheel event ? Would be nice to zoom also.

(to the dev: great software btw, you're making my life more beautiful)
yumyum2012-02-24 10:06:43
B
15
S
7
G
1
Posts: 10
Reputation: 1,445

Post » Fri Feb 24, 2012 10:36 am

Things like
[quote]
<meta name="viewport"
    content="user-scalable=no, width=device-width" />
[/quote]
prevent the pinch-to-zoom feature.

One way to do that with only a single gesture that I saw in my lab is to use a specific widget, looking like a knob. When you have your finger on it, and turning the knob clockwise, you are zooming, when you turn it counter-clockwise, you are dezooming.
B
33
S
9
G
6
Posts: 709
Reputation: 6,704

Post » Fri Feb 24, 2012 1:41 pm

I'd prefer a pinch to zoom, people are used to it and it doesn't take any space on screen.

Editing the index.html is fine, but it won't work with the preview I guess.

It could be a layout option in construct: "allow user to zoom: yes/no".


yumyum2012-02-24 13:43:42
B
15
S
7
G
1
Posts: 10
Reputation: 1,445

Post » Fri Feb 24, 2012 2:17 pm

You can edit the file "preview.html" in the folder c2\exporters\html5 to have this working in preview mode.

But you would have to remember to edit it again if you want on to make another project not using said pinch, or targeted at desktop.
New to Construct ? Where to start

Image Image
Image Image

Please attach a capx to any help request or bug report !
Moderator
B
247
S
85
G
40
Posts: 6,999
Reputation: 57,793

Post » Fri Feb 24, 2012 2:28 pm

Ah thanks, I'll do that !
B
15
S
7
G
1
Posts: 10
Reputation: 1,445

Post » Sat Feb 25, 2012 3:27 pm

So is there a way to pinch to zoom? "Edit the html file" is not very clear to me, is that the way to pinch to zoom? What do you edit it to?
B
8
S
3
G
2
Posts: 107
Reputation: 2,219

Post » Sun Feb 26, 2012 6:00 am

You edit preview-fs.html and comment or remove this line:
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, target-densitydpi=device-dpi" />

After that you can zoom, but you still can't drag to pan the view
Not sure why.

Panning is probably possible with the "in touch" event, so zoom would be handled by the browser and panning by constuct.

Multi-touch support in construct would be nice though.

B
15
S
7
G
1
Posts: 10
Reputation: 1,445

Post » Sun Feb 26, 2012 8:18 pm

I made a plugin to support multi touch, with an example on how to do "pinch to zoom"
here.

The pinch to zoom is not very good, it can probably be smoother.
B
15
S
7
G
1
Posts: 10
Reputation: 1,445

Post » Sun Feb 26, 2012 9:22 pm

pinch to zoom (the default one) might be a problem if you want a HUD layer.

Perhaps, on two touches at the same time (not sure you can even do that)
create an invisible object at each one
set layerscale(whatever)
clamp(factor / distance(x1,y1,x2,y2), lower zoom out limit, upper zoom out limit

factor can be anything... not sure of the math now but play around with some numbers.

Hmm, this resets it every time you try to zoom though...sqiddster2012-02-26 21:23:25
B
90
S
30
G
24
Posts: 3,189
Reputation: 32,400

Post » Mon Feb 27, 2012 5:49 am

[QUOTE=sqiddster]
Perhaps, on two touches at the same time (not sure you can even do that)
[/QUOTE]
You can with my plugin :)
B
15
S
7
G
1
Posts: 10
Reputation: 1,445

Next

Return to How do I....?

Who is online

Users browsing this forum: djcrazypants, marekmk and 6 guests