Hello Everyone,
I’ve just finished a project for a website that i’ve been working for time. It’s kinda of a isometric city build game, I have camera stuff inside and like UIScene (working with 2 scenes at one time),
My config object like this:
import Phaser from 'phaser';
import { BootScene, PreloadScene, GameScene, UIScene } from './scenes/';
export const type = Phaser.WEBGL;
export const loader = {
baseURL: 'assets/'
};
export const backgroundColor = 0x062830;
export const scale = {
mode: Phaser.Scale.ScaleModes.FIT,
autoCenter: Phaser.Scale.Center.CENTER_BOTH,
width: 1920,
height: 1080,
parent: 'core',
fullscreenTarget: 'core',
};
export const physics = {
default: false
};
export { title, version, url } from '../package.json';
export const scene = [ BootScene, PreloadScene, GameScene, UIScene ];
export const banner = {
text: '#ffffff',
background: [
'#fb8cb3',
'#d44a52',
'#871905',
'#581505',
],
hidePhaser: true
};
after ScaleManager, I have changed my scale object like this:
export const scale = {
mode: Phaser.Scale.ScaleModes.FIT,
autoCenter: Phaser.Scale.Center.CENTER_BOTH,
width: 1920,
height: 1080,
parent: 'core',
fullscreenTarget: 'core',
};
Everything seems to work fine but just one thing, which is
When ORIENTATION_CHANGE it wont fit inside the parent
's box,
Let me show what i’m trying to tell:
I’m starting the page on landscape mode:
after this i’m turning my page to portrait which is also fine:
From here after i change the orientation again it’s not scaling, actually it is but this is not like it should be:
I looked into phaser’s code and it seems like it’s using ScaleManager’s refresh()
method after resize event. BDW it happening on IOS devices mostly, on Android it’s sometimes fitting and sometimes just staying small, after toggling fullscreen, everything find bdw
Other then this: when i do resize with mouse quickly, for instance scaling div with dev tool shrink, when it’s fast it’s staying like really small, and when do it slowly it’s kinda find but still not fitting like the first time. let me show it with 2 pictures:
I’m staring page like this:
when i shrink down or close dev tool it’s like this:
or:
And i believe @rich, If i dont have something wrong on my code, you might wanna check on this
I’ll be glad for any help Thanks