arkts 设置横竖屏

在鸿蒙系统中设置横竖屏主要涉及两种方式：通过配置文件设置全局策略，以及通过代码动态调整窗口方向。以下是具体实现方法及代码示例：

一、全局配置（module.json5）

在 module.json5 文件中配置 orientation 字段，控制应用启动时的默认方向：(代码来自wb98.com)

{
  "module": {
    "abilities": [
      {
        "name": "EntryAbility",
        "orientation": "auto_rotation", // 允许横竖屏自动切换
        // 其他配置...
      }
    ]
  }
}

上面的其他配置还有其它可选参数：

portrait：强制竖屏

landscape：强制横屏

auto_rotation：允许自由旋转

auto_rotation_restricted：受系统自动旋转开关控制

follow_desktop：跟随设备形态（折叠屏场景）

二、代码动态设置（ArkTS）

通过窗口的 setPreferredOrientation 方法实现运行时动态切换：

import { BusinessError } from '@kit.BasicServicesKit'
import { window } from '@kit.ArkUI';
import { common } from '@kit.AbilityKit';

@Entry
@Component
struct Page17 {
  context: Context = getContext(this);
  private windowClass = (this.context as common.UIAbilityContext).windowStage.getMainWindowSync();

  private setWindowOrientation(orientation: window.Orientation) {
    this.windowClass?.setPreferredOrientation(orientation)
      .then(() => {
        console.log('屏幕方向设置成功-代码来自wb98.com');
      })
      .catch((err: BusinessError) => {
        console.error(`错误码：${err.code}, 信息：${err.message}`);
      });
  }

  build() {
    Column() {

      Row() {
        Button('确定->横屏')
          .onClick(() => {
            // 设置横屏
            this.setWindowOrientation(window.Orientation.LANDSCAPE);
          })

        Button('确定->竖屏')
          .onClick(() => {
            // 设置竖屏
            this.setWindowOrientation(window.Orientation.PORTRAIT);
          })
      }

      Image($r('app.media.jj930z'))
        .width('100%')
        .height(400)

    }
  }
}

要用真机和模拟器来测试以上代码。

打赏 支付宝打赏 微信打赏

来源：济亨网

本文链接：https://wb98.com/post/374.html