中国优质的IT技术网站
专业IT技术创作平台
IT职业在线教育平台
本文原创发布在华为开发者社区。
本示例通过 setPreferredOrientation 方法来控制窗口的横竖屏显示,通过设置组件的 rotate 属性来控制组件的横竖屏显示。
实现横竖屏切换源码链接
点击横屏竖屏按钮实现窗口的横竖屏显示切换,点击组件旋转按钮实现组件的横竖屏显示切换。
const topWindow = await window.getLastWindow(getContext(this)); await topWindow.setPreferredOrientation(window.Orientation.LANDSCAPE_INVERTED); ... const topWindow = await window.getLastWindow(getContext(this)); await topWindow.setPreferredOrientation(window.Orientation.PORTRAIT);
Column() { Button($r('app.string.button_rotate')) .onClick(() => { if (this.angle === 0) { this.angle = 90; this.newWidth = this.tempWidth; this.newHeight = this.tempHeight; } else { this.angle = 0; this.newWidth = this.tempWidth; this.newHeight = this.tempHeight; } }); } .onAreaChange((oldValue: Area, newValue: Area) => { this.tempWidth = newValue.height as number; this.tempHeight = newValue.width as number; }) .height(this.newHeight) .width(this.newWidth) .backgroundColor(Color.Blue) .rotate({ angle: this.angle });
微信扫码分享