具有移动分辨率的移相器

如何解决具有移动分辨率的移相器

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

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

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

游戏类

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);
        }
    }