HarmonyOS鸿蒙Next中通过setPreferredOrientation设置横竖屏切换功能

HarmonyOS鸿蒙Next中通过setPreferredOrientation设置横竖屏切换功能 通过setPreferredOrientation 设置横竖屏切换功能

3 回复

效果图

效果图

实现思路

  1. 通过setPreferredOrientation api实现切换方向
  2. 通过windowSizeChange监控状态

示例完整代码（可运行）

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

@Entry
@Component
struct Index {
  @State isLandscape: boolean = false
  private windowClass = ( this.getUIContext()?.getHostContext() as common.UIAbilityContext).windowStage.getMainWindowSync()

  aboutToAppear(): void {
    this.windowClass.on('windowSizeChange', () => {
      this.isLandscape = !this.isLandscape
    })
  }

  aboutToDisappear(): void {
    this.windowClass.off('windowSizeChange')
  }
  
  build() {
    Row(){
      Text(this.isLandscape ? '横屏' : '竖屏').fontColor(Color.Black).fontWeight(900).fontSize(50).onClick(()=>{
        if (this.isLandscape) {
          this.windowClass.setPreferredOrientation(window.Orientation.PORTRAIT)
        } else {
          this.windowClass.setPreferredOrientation(window.Orientation.LANDSCAPE)
        }
      })
    }
  }
}

效果图完整代码（不可运行）

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

@Component
export struct NavBar {
  @Consume navPathStack:NavPathStack


  @Consume isLandscape: boolean
  private windowClass = ( this.getUIContext()?.getHostContext() as common.UIAbilityContext).windowStage.getMainWindowSync()

  aboutToAppear(): void {
    this.windowClass.on('windowSizeChange', () => {
      this.isLandscape = !this.isLandscape
    })
  }

  aboutToDisappear(): void {
    this.windowClass.off('windowSizeChange')
  }

  build() {
    Row(){
      Image($r('app.media.player_jiantou')).width(30)
      Row(){
        Row() {
          Text(this.isLandscape ? '横屏' : '竖屏').fontColor(Color.White).fontWeight(900).fontSize(16)
          Image($r('app.media.player_hengping')).width(40)
        }.onClick(()=>{
          if (this.isLandscape) {
            this.windowClass.setPreferredOrientation(window.Orientation.PORTRAIT)
          } else {
            this.windowClass.setPreferredOrientation(window.Orientation.LANDSCAPE)
          }
        })
        Image($r('app.media.player_fenxaing')).width(30)
      }
    }.height(70).width('100%').justifyContent(FlexAlign.SpaceBetween)
  }
}

更多关于HarmonyOS鸿蒙Next中通过setPreferredOrientation设置横竖屏切换功能的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


在HarmonyOS Next中，可通过windowManager.getLastWindow()获取窗口对象，调用setPreferredOrientation(orientation: Orientation)方法设置屏幕方向。参数orientation支持Orientation.PORTRAIT（竖屏）、Orientation.LANDSCAPE（横屏）、Orientation.PORTRAIT_INVERTED（反向竖屏）等枚举值。此方法可动态调整应用界面方向，需在UIAbility或页面中调用。

在HarmonyOS Next中，setPreferredOrientation 是用于控制应用或Ability屏幕方向的核心方法。它允许开发者动态设置或锁定屏幕的横竖屏状态，以提供更好的用户体验。

主要使用方式：

  1. 获取UIAbility上下文后，通过UIAbilityContext.setPreferredOrientation()进行设置。
  2. 参数为Orientation枚举，常用值包括：
    • Orientation.UNSPECIFIED：遵循系统默认或传感器方向（通常为自动旋转）。
    • Orientation.PORTRAIT：锁定为竖屏。
    • Orientation.LANDSCAPE：锁定为横屏。
    • Orientation.PORTRAIT_INVERTED / LANDSCAPE_INVERTED：锁定为特定方向的倒置竖屏或横屏（取决于设备支持）。
    • Orientation.SENSOR：根据设备物理方向自动切换（类似自动旋转）。
    • Orientation.SENSOR_PORTRAIT / SENSOR_LANDSCAPE：在竖屏或横屏范围内根据传感器自动切换。

典型应用场景：

  • 视频播放器界面通常锁定为横屏。
  • 阅读应用可能锁定为竖屏。
  • 游戏可能根据关卡需要动态切换方向。

注意事项：

  • 该设置通常作用于整个Ability，而非单个页面。
  • 部分锁定方向可能受设备硬件或系统配置限制。
  • 方向变更可能触发Ability的重建（如onDestroy和onCreate），需妥善处理状态保存与恢复。

通过合理使用此API，可以确保应用界面在不同方向下保持稳定与兼容性。

回到顶部