HarmonyOS 鸿蒙next 实现自定义启动页

HarmonyOS 鸿蒙next 实现自定义启动页,要在 HarmonyOS 中实现自定义启动页,需要在项目中 Ability 的 onWindowStageCreate 和 onWindowStageRestore 方法中获取应用主窗口, 并通过调用窗口强制全屏布局接口 setWindowLayoutFullScreen 将窗口设置为全屏。

/**
* 将窗口设置为全屏
* [@param](/user/param) windowStage
*/
setFullSize(windowStage: window.WindowStage) {
   let windowClass: window.Window = windowStage.getMainWindowSync(); // 获取应用主窗口
   // 设置窗口全屏
   let isLayoutFullScreen = true;
   windowClass.setWindowLayoutFullScreen(isLayoutFullScreen)
       .then(() => {
           console.info('Succeeded in setting the window layout to full-screen mode.');
       })
       .catch((err: BusinessError) => {
           console.error('Failed to set the window layout to full-screen mode. Cause:' + JSON.stringify(err));
       });
}

新建启动页 Splash.ets ,在该页面中的 aboutToAppear 生命周期钩子中使用 timer 定时器,实现延时跳转功能。最后在组件结构销毁之前的 aboutToDisappear 生命周期钩子中销毁 timer 定时器。

[@State](/user/State) countdown: number = 5; // 倒计时,默认 5 秒
readonly DURATION: number = 1000; // 倒计时间隔
private timer: number = 0; // 定时器

aboutToAppear(): void {
 this.startTiming();
}

/**
* 开始倒计时
*/
startTiming() {
 // 设置时间间隔
 this.timer = setInterval(() => {
   this.countdown--;
   if (this.countdown === 0) {
     this.clearTiming();
     this.jumpToMainPage();
   }
 }, this.DURATION);
}

/**
* 清除定时器
*/
clearTiming() {
 if (this.timer !== null) {
   clearInterval(this.timer);
   this.timer = 0;
 }
}

/**
* 跳转到主页
*/
jumpToMainPage() {
 this.clearTiming();
 router.replaceUrl({
   url: 'pages/Index'
 });
}

/**
* 组件结构销毁之前时
*/
aboutToDisappear() {
 // 清除定时器
 this.clearTiming();
}


运行效果如下:

image.png


更多关于HarmonyOS 鸿蒙next 实现自定义启动页的实战教程也可以访问 https://www.itying.com/category-93-b0.html

回到顶部