在实际开发中,通常会用到全屏模式,比如广告页或者闪屏加载页、或者是开发游戏时需要用到全屏,需要把顶部状态栏、刘海屏、底部工具栏等区域全部覆盖。那么如果是页面全屏幕比较简单,可以通过以下方式解决 这种是单页面设置全屏,当然也有全局设置全屏幕,具体还是需要看实际项目场景,如果需要做到全局全屏可以
1、设置全局全屏方式,在 EntryAbility类的onWindowStageCreate添加下代码
onWindowStageCreate(windowStage: window.WindowStage): void {
let targetPage:string="pages/d3/fullscreen/FullScreenPage";
let isLayoutFullScreen= true;
let windowClass = windowStage.getMainWindowSync()
try {
windowClass.setWindowLayoutFullScreen(isLayoutFullScreen, (err) => {
if (err.code) {
console.error('Failed to set the window layout to full-screen mode. Cause:' + JSON.stringify(err));
return;
}
console.info('Succeeded in setting the window layout to full-screen mode.');
});
} catch (exception) {
console.error('Failed to set the window layout to full-screen mode. Cause:' + JSON.stringify(exception));
}
2、设置单页面全屏模式
@Entry
@Component
struct FullScreenPage {
build() {
Swiper() {
Column() {
Image($r('app.media.bg_evening'))
.height('100%').width('100%')
// 设置图片延伸到状态栏
// .expandSafeArea([SafeAreaType.SYSTEM], [SafeAreaEdge.TOP])
/* Column() {
Text('HarmonyOS 第一课')
.fontSize(32)
.margin(30)
Text('通过循序渐进的学习路径,无经验和有经验的开发者都可以掌握ArkTS语言声明式开发范式,体验更简洁、更友好的HarmonyOS应用开发旅程。')
.fontSize(20).margin(20)
}.height('50%').width('100%')
.backgroundColor(Color.White)*/
// 设置文本内容区背景延伸到导航栏
.expandSafeArea([SafeAreaType.SYSTEM], [SafeAreaEdge.TOP,SafeAreaEdge.BOTTOM])
}
}
.width('100%')
.height('100%')
// 关闭Swiper组件默认的裁切效果以便子节点可以绘制在Swiper外。
.clip(false)
}
}
预览效果
模拟器效果