uni-app 荣耀平板(V7 Pro BRT-W09)一直显示横屏的高宽

发布于 1周前 作者 sinazl 来自 Uni-App

uni-app 荣耀平板(V7 Pro BRT-W09)一直显示横屏的高宽

操作步骤:

  • 在 荣耀平板(V7 Pro BRT-W09) 上安装我们的软件”语法分析助手“

预期结果:

  • 显示不正常

实际结果:

  • 显示不正常

bug描述:

  • 用户反馈,在他的平板上不正常显示
  • 从他的截图看,应该是在竖屏状态也是显示横屏的高宽

图像

信息类别 详细信息
产品分类 uniapp/App
PC开发环境操作系统 Mac
PC开发环境操作系统版本号 13.5 (22G74)
HBuilderX类型 正式
HBuilderX版本号 3.93
手机系统 Android
手机系统版本号 Android 12
手机厂商 华为
手机机型 BRT-W09
页面类型 vue
vue版本 vue2
打包方式 云端
项目创建方式 HBuilderX

1 回复

uni-app 中,如果你在荣耀平板(V7 Pro BRT-W09)上遇到应用一直显示横屏的高宽问题,可能是由于设备的屏幕方向设置或 uni-app 的配置问题导致的。以下是一些可能的解决方案:

1. 检查设备的屏幕方向设置

确保设备的屏幕方向没有被锁定为横屏。你可以在设备的设置中检查屏幕方向锁定选项,并确保它没有被启用。

2. 配置 uni-app 的屏幕方向

uni-app 中,你可以通过配置 manifest.json 文件来控制应用支持的屏幕方向。以下是一个示例配置:

{
  "app-plus": {
    "screenOrientation": [
      "portrait-primary",
      "portrait-secondary",
      "landscape-primary",
      "landscape-secondary"
    ]
  }
}
  • portrait-primary:竖屏(正常方向)
  • portrait-secondary:竖屏(倒置方向)
  • landscape-primary:横屏(正常方向)
  • landscape-secondary:横屏(倒置方向)

你可以根据需要调整这些选项,例如只支持竖屏:

{
  "app-plus": {
    "screenOrientation": [
      "portrait-primary",
      "portrait-secondary"
    ]
  }
}

3. 使用 uni-app 的 API 动态控制屏幕方向

你还可以在代码中使用 uni-app 提供的 API 来动态控制屏幕方向。例如,使用 uni.setScreenOrientation 方法:

uni.setScreenOrientation({
  orientation: 'portrait-primary' // 设置为竖屏
});

4. 检查 CSS 样式

确保你的 CSS 样式没有强制设置横屏的布局。你可以使用媒体查询来根据屏幕方向调整布局:

[@media](/user/media) screen and (orientation: portrait) {
  /* 竖屏样式 */
}

[@media](/user/media) screen and (orientation: landscape) {
  /* 横屏样式 */
}
回到顶部
AI 助手
你好,我是IT营的 AI 助手
您可以尝试点击下方的快捷入口开启体验!