uni-app 安卓手机横屏模式下进入小程序后界面错乱

操作步骤：

安卓手机横屏模式下，进入小程序后，小程序界面错乱

预期结果：

安卓手机横屏模式下，进入小程序后，界面正常

实际结果：

安卓手机横屏模式下，进入小程序后，小程序界面错乱

bug描述：

App.vue中已设置：plus.screen.lockOrientation('portrait-primary');
manifest.json中已设置： "orientation" : [ "portrait-primary" ]；
安卓手机横屏模式下，进入小程序后，小程序会先横屏然后竖屏；此时小程序界面会错乱；
小程序没有出现横屏，界面正常

更多关于uni-app 安卓手机横屏模式下进入小程序后界面错乱的实战教程也可以访问 https://www.itying.com/category-93-b0.html

sinazl 1楼

更多关于uni-app 安卓手机横屏模式下进入小程序后界面错乱的实战教程也可以访问 https://www.itying.com/category-93-b0.html

在uni-app中，安卓横屏进入小程序时出现界面错乱，通常是由于屏幕方向切换时的渲染时序问题。虽然你已经设置了plus.screen.lockOrientation('portrait-primary')和manifest中的orientation配置，但横屏启动时系统可能先以横屏布局渲染，再强制旋转为竖屏，导致样式计算异常。

建议在App.vue的onLaunch生命周期中增加延时处理，确保方向锁定在页面渲染前生效：

onLaunch: function() {
    // 确保在页面加载前锁定方向
    setTimeout(() => {
        plus.screen.lockOrientation('portrait-primary');
    }, 100);
}