如何实现page页面的横竖屏切换

如何实现page页面的横竖屏切换

HarmonyOS
2024-07-22 12:30:20
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
jshyb

使用setPreferredOrientation设置横竖屏切换:setPreferredOrientation

import { window } from '@kit.ArkUI'; 
 
@Entry 
@Component 
struct Index { 
  @State message: string = 'Hello World'; 
  private portrait: boolean = true 
  changeOrientation = () => { 
    // 获取当前页面 
    let context = getContext(this) 
    window.getLastWindow(context).then((mainWindow) => { 
      this.changeOrientationInternal(mainWindow) 
    }).catch((error: ESObject) => { 
      console.log('getMainWindow error: ' + JSON.stringify(error)) 
    }) 
  } 
 
  changeOrientationInternal(lastWindow: window.Window) { 
    if (this.portrait) { 
      // 切换成横屏 
      lastWindow.setPreferredOrientation(window.Orientation.LANDSCAPE).then(() => { 
        console.log('setPreferredOrientation success') 
        this.portrait = !this.portrait 
      }).catch((error: ESObject) => { 
        console.log('setPreferredOrientation failure' + JSON.stringify(error)) 
      }) 
    } else { 
      // 切换成竖屏 
      lastWindow.setPreferredOrientation(window.Orientation.PORTRAIT).then(() => { 
        console.log('setPreferredOrientation success') 
        this.portrait = !this.portrait 
      }).catch((error: ESObject) => { 
        console.log('setPreferredOrientation failure: ' + JSON.stringify(error)) 
      }) 
    } 
  } 
 
  build() { 
    Column() { 
      Text(this.message) 
        .id('Index19HelloWorld') 
        .fontSize(50) 
        .fontWeight(FontWeight.Bold) 
        .alignRules({ 
          center: { anchor: '__container__', align: VerticalAlign.Center }, 
          middle: { anchor: '__container__', align: HorizontalAlign.Center } 
        }) 
      Button('横竖屏切换') 
        .onClick(() => { 
          this.changeOrientation() 
        }) 
    } 
    .height('100%') 
    .width('100%') 
    .backgroundColor(Color.Green) 
  }}
分享
微博
QQ
微信
回复
2024-07-22 20:13:20
相关问题
页面横竖如何进行切换
171浏览 • 1回复 待解决
如何进行页面横竖切换
1619浏览 • 1回复 待解决
求大佬告知如何切换横竖
1638浏览 • 1回复 待解决
如何监听设备横竖切换状态呢
1280浏览 • 1回复 待解决
如何监听手机屏幕的横竖切换
181浏览 • 1回复 待解决
鸿蒙JS 框架中如何主动切换横竖?
4446浏览 • 1回复 待解决
如何横竖切换更自然一些
335浏览 • 1回复 待解决
鸿蒙横竖切换监听,需要这个功能
10954浏览 • 3回复 已解决
page页面如何设置为横显示
1323浏览 • 1回复 待解决
Open Harmony 3.1版本支持横竖切换吗?
4623浏览 • 1回复 待解决
如何实现Page页面数据的保留
1340浏览 • 1回复 待解决
OpenHarmony 小型系统如何设置横竖
7519浏览 • 1回复 待解决
HarmonyOS如何实现hap包页面的跳转
197浏览 • 1回复 待解决