鸿蒙弹窗

页面级弹窗不起作用

页面级弹窗在levelMode和levelUniqueId都正确设置的情况下，如果在：

    Navigation(this.stack) {

      Button(this.message)
        .id('test_text')
        .onClick(() => {
          const node: FrameNode | null = this.getUIContext().getFrameNodeById('test_text') || null;
          this.uiContext.getPromptAction().openCustomDialog({
            builder: () => {
              this.customDialogComponent();
            },
            levelMode: LevelMode.EMBEDDED, // 启用页面级弹出框
            levelUniqueId: node?.getUniqueId(), // 设置页面级弹出框所在页面的任意节点ID
            immersiveMode: ImmersiveMode.EXTEND, // 设置页面级弹出框蒙层的显示模式
          }).then((dialogId: number) => {
            customDialogId = dialogId;
          })

          this.stack?.pushPath({ name: "PageOne" })
        })
      
    }
    .width('100%')
    .height('100%')

像这样的Navigation中显示，stack push后dialog依旧会显示。

对于Navigation，如果想要使用页面级弹窗，只能在NavDestination中调用，因此需要这样使用：

@Entry
@Component
struct Index {
  private stack: NavPathStack = new NavPathStack();

  build() {
    // 在这里配置主页NavDestination信息
    Navigation(this.stack, { name: 'PageHome' }) {
    }
    .width('100%').height('100%')
  }
}

@Component
export struct PageHome {
  
  ...
  
  build() {
    NavDestination() {

      Button(this.message).id('test_text')
        .fontSize(50)
        .fontWeight(FontWeight.Bold)
        .onClick(() => {
          const node: FrameNode | null = this.getUIContext().getFrameNodeById('test_text') || null;
          this.uiContext.getPromptAction().openCustomDialog({
            builder: () => {
              this.customDialogComponent();
            },
            levelMode: LevelMode.EMBEDDED, // 启用页面级弹出框
            levelUniqueId: node?.getUniqueId(), // 设置页面级弹出框所在页面的任意节点ID
            immersiveMode: ImmersiveMode.EXTEND, // 设置页面级弹出框蒙层的显示模式
          }).then((dialogId: number) => {
            customDialogId = dialogId;
          })

          this.stack?.pushPath({name:"PageOne"})
        })

    }
    .width('100%').height('100%')
    .onReady((ctx: NavDestinationContext) => {
      this.stack = ctx.pathStack;
    })
  }
  
  ...
  
}

将原本在Navigation闭包中的ui代码改到NavDestination中，像跳转其他Navigation子界面一样，使用Navigation(stack,{name:"homeName"})定义主页面。不过这种写法只在API version 20以上可用，在低版本手机上会表现为空白，无法显示界面。