【鸿蒙实战开发】HarmonyOS半屏透明登录页实现

前言

最近在开发鸿蒙next手游sdk发现通过router打开的page,无法达到背景透明效果，在查找各路大神提供的方法，发现有三种思路可以达到这种效果

• 使用自定义Dialog
• 在主页中使用Stack（层叠布局）嵌套view，感兴趣的朋友可以去查看一下官方文档
• 使用子窗口加载页面

今天想说的是如何使用子窗口加载登录页面达到背景透明的效果，先来看看最终实现的效果

创建DialogHelper.ets

`import { common } from '@kit.AbilityKit';
import { window } from '@kit.ArkUI';
import display from '@ohos.display'

/**
 *使用子窗口加载登录页，达到页面背景透明可看到上一级页面的效果
 * */
export class DialogHelper {
 static dialogHelper: DialogHelper | null = null;
 dialogWindow: window.Window | null = null;
 width: number
 height: number;
 windowWidth: number
 windowHeight: number
 context: common.UIAbilityContext | null = null;
 promisse: Promise<number> | null = null;

 private constructor() {
 this.width = display.getDefaultDisplaySync().width;
 this.height = display.getDefaultDisplaySync().height;
 this.windowWidth = this.width; //子窗口宽度
 this.windowHeight = this.height; //子窗口高度
 }

 static instance(): DialogHelper {
 if (!DialogHelper.dialogHelper) {
 DialogHelper.dialogHelper = new DialogHelper();
 }
 return DialogHelper.dialogHelper;
 }

 //显示登录弹窗
 initDialog(context: common.UIAbilityContext, windowStage: window.WindowStage): void {
 this.context = context
 windowStage.createSubWindow('Login', (err