How do I use something like this to zoom in/zoom out?

Get help using Construct 2

Post » Tue Nov 18, 2014 2:29 pm

Could I use a script or something else to zoom in/zoom out the entire screen gradually? Thanks.

Code: Select all
<div class="toolbar" style="display: block; width: 940px; height: 50px;">
<img id="zoomin" alt="zoomin" src="./media/toolbar_zoomin.svg" style="width: 30px; bottom: 0px; left: 0px; padding-top: 10px;">
<img id="zoomout" alt="zoomout" src="./media/toolbar_zoomout.svg" style="width: 30px; bottom: 0px; left: 0px; padding-top: 10px;">
</div>
Last edited by RBuster on Wed Nov 19, 2014 10:33 am, edited 2 times in total.
B
74
S
13
G
4
Posts: 1,006
Reputation: 8,060

Post » Tue Nov 18, 2014 3:15 pm

You could create zoom in/out effect by repositioning and resizing objects in relation to how close they are to the centre of the screen. You could also use families to create 3d zoom parallax effects.
Image
B
9
S
3
G
1
Posts: 346
Reputation: 1,560

Post » Tue Nov 18, 2014 4:23 pm

Hi @hundredfold

I just want to zoom (in/out) the entire screen without change the game assets. Something like browser>request fullscreen, but zooming gradually.

And about the script? I cannot apply it or something like it on the page for this purpose?
B
74
S
13
G
4
Posts: 1,006
Reputation: 8,060

Post » Tue Nov 18, 2014 4:33 pm

Hi RenatoB

kmsravindra just posted a thread about a brainstorming product he's developed with Construct 2.
viewtopic.php?f=148&t=119400

I just watched the YouTube video demo (it's only a couple of minutes long) and he's using a zoom in/out feature in there. If it's anything like what you're trying to achieve he may be able to help.
Image
B
9
S
3
G
1
Posts: 346
Reputation: 1,560

Post » Tue Nov 18, 2014 4:42 pm

RenatoB wrote:Could I use this script or something else to zoom in/zoom out the entire screen gradually? Thanks.

Code: Select all
<div class="toolbar" style="display: block; width: 940px; height: 50px;">
<img id="zoomin" alt="zoomin" src="./media/toolbar_zoomin.svg" style="width: 30px; bottom: 0px; left: 0px; padding-top: 10px;">
<img id="zoomout" alt="zoomout" src="./media/toolbar_zoomout.svg" style="width: 30px; bottom: 0px; left: 0px; padding-top: 10px;">
</div>


In C2,

System>set canvas size
or system>set layout scale would let you zoom the game (or change the window size, which effectively can be use to resize the game when fullscreen is set to off andzoom in some fullscreen modes).
Game design is all about decomposing the core of your game so it becomes simple instructions.
B
53
S
22
G
18
Posts: 2,122
Reputation: 17,123

Post » Tue Nov 18, 2014 5:50 pm

@hundredfold: Thanks for the link. I'll check it.

@Aphrodite: Thank you. I'm already trying something with the "canvas size". Thanks for the suggestion about "scale layout" too. A question: Could I use percentage with "canvas size"?
B
74
S
13
G
4
Posts: 1,006
Reputation: 8,060

Post » Wed Nov 19, 2014 10:37 am

Anyone knows how to use percentage? I would like to increment/decrement values using percentage to zoom in/out the screen.
B
74
S
13
G
4
Posts: 1,006
Reputation: 8,060

Post » Wed Nov 19, 2014 2:16 pm

I tried:

Code: Select all
set canvas size to canvasW = canvasW*1.10 / canvasY = canvasY*1.10


But not worked like I need. The screen moves to the left when reduced.
B
74
S
13
G
4
Posts: 1,006
Reputation: 8,060

Post » Wed Nov 19, 2014 3:36 pm

You would have to store the value of the width and height corresponding to 100%

Then you just set the width to the reference width * the percentage.
Game design is all about decomposing the core of your game so it becomes simple instructions.
B
53
S
22
G
18
Posts: 2,122
Reputation: 17,123

Post » Wed Nov 19, 2014 6:13 pm

@Aphrodite

I did it, but only worked after I change the "Fullscreen in browser" option to "Off". Thanks anyway.
B
74
S
13
G
4
Posts: 1,006
Reputation: 8,060


Return to How do I....?

Who is online

Users browsing this forum: No registered users and 23 guests