Nice Guy

ScaleManager.SHOW_ALL

Recommended Posts

On 10/3/2017 at 1:10 AM, rich said:

There is no Scale Manager in Phaser 3 yet.

Hello

Still not? Could you please share info when it might be implemented?

Or maybe somebody has the well-written plugin for that? 

Thank you!

Share this post


Link to post
Share on other sites
2 hours ago, samme said:

Thank you very much for sharing!

I know this way to make resizing with css, but, unfortunately, it is not enough for me

I wanna use build in features like it was in phaser 2 to make games fully responsive to all screen sizes

I'm aimed to do the best user-friendly and customer loved games, so it would be great to know if it planned to do in phaser 3 or I should it develop by my own
 

Share this post


Link to post
Share on other sites

I'm using code from that example (game and cameras resize) + some basic css.
It could be part of Phaser, but honestly that's all I will ever need. If you want proper responsive game, you have to implement it yourself anyway.

phaser3-resizing-compressed.gif.24710c79c1613486cb759fd8ba530db3.gif

This is my custom ScaleManager's initialize method that I call after I create the Game instance (Haxe code).

public static function initialize(game:Dynamic):Void {
	function resize() {
		var w = js.Browser.window.innerWidth;
		var h = js.Browser.window.innerHeight;
		var scale = Math.min(w / Config.DEFAULT_WIDTH, h / Config.DEFAULT_HEIGHT);
		
		game.canvas.setAttribute('style',
			' -ms-transform: scale(' + scale + '); -webkit-transform: scale3d(' + scale + ', 1);' +
			' -moz-transform: scale(' + scale + '); -o-transform: scale(' + scale + '); transform: scale(' + scale + ');' +
			' transform-origin: top left;'
		);
		
		width = w / scale;
		height = h / scale;
		game.resize(width, height);
		game.scene.scenes.forEach(function (scene) {
			scene.cameras.main.setViewport(0, 0, width, height);
		});
	}
	
	js.Browser.window.addEventListener('resize', resize);
	if(game.isBooted) resize();
	else game.events.once('boot', resize);
}

 

Share this post


Link to post
Share on other sites
14 hours ago, Antriel said:

This is my custom ScaleManager's initialize method that I call after I create the Game instance (Haxe code).

Thanks a lot for sharing this example. Very interesting one!

And... On your gif... Is it a browser or some tool? Just interesting

Share this post


Link to post
Share on other sites

I'm using code from that example (game and cameras resize) + some basic css.
It could be part of Phaser, but honestly that's all I will ever need. If you want proper responsive game, you have to implement it yourself anyway.



Hi Antriel,

I'm a beginner in game development, I'm confused where to add that "public static function initialize(game:Dynamic):Void {" function and how to call it. So, Can you help me. Can you please share a sample working code of a resize demo feature.


Thanks in Advance.

Share this post


Link to post
Share on other sites
24 minutes ago, Mayjo Antony said:

Hi Antriel,

I'm a beginner in game development, I'm confused where to add that "public static function initialize(game:Dynamic):Void {" function and how to call it. So, Can you help me. Can you please share a sample working code of a resize demo feature.


Thanks in Advance.

It's a snippet from my Haxe code. It's basically a static function I call right after I create a game instance, so you could just copy what's inside. Also `js.Browser.window` is just Haxe's way to get to the global window property, in js you can just access `window` directly I think. Otherwise it should work as is.

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

  • Recently Browsing   0 members

    No registered users viewing this page.