具有移动分辨率的移相器

问题描述

我的问题是如何通过在移动视图中进行不同的设计来分离纵向和横向模式？例如纵向模式用户界面和横向模式用户界面是我希望它们彼此不同。

我有一款游戏，我想在移动设备上打开时以纵向模式显示不同的用户界面，或者我想在横向模式下打开时显示不同的用户界面。

为此，我准备了以下代码块，但并非在所有移动设备上都正确。我想写下所有手机比例的宽度和高度是没有意义的。它必须是自动的。

游戏类

public resize(): void {
       
        if (this.game.width > this.game.height) {
            this.game.stage.updateTransform();
            this.elementsPositionLandscape();
        } else {
            this.game.stage.updateTransform();
            this.elementsPositionPortrait();
        }

    }

引导类

this.scale.scaleMode = Phaser.ScaleManager.USER_SCALE;

        //resize because it's better than any of the phaser provided resizes
        window.addEventListener('resize',(e: Event) => this.mobileResizeCallback(this.game.scale));
        this.game.scale.onSizeChange.add(() => {
            this.game.state.getCurrentState().resize();
        },this);
        this.mobileResizeCallback(this.game.scale);

public mobileResizeCallback(manager: Phaser.ScaleManager): void {
        let width: number = window.innerWidth;
        let height: number = window.innerHeight;

        let userRatio: number = 1;

        if (width < height) {
            userRatio /= Math.round(height / Constants.GAME_WIDTH * 10) / 10;
        } else {
            userRatio /= Math.round(width / Constants.GAME_WIDTH * 10) / 10;
        }

        let expectedWidh: number = Math.ceil(width * userRatio);
        let expecteHeight: number = Math.ceil(height * userRatio);

        if (manager.width !== expectedWidh || manager.height !== expecteHeight) {
            manager.setGameSize(expectedWidh,expecteHeight);
            manager.setUserScale(1 / userRatio,1 / userRatio);
        }
    }

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）