HarmonyOS 鸿蒙Next 如何将弹窗在屏幕外加载后移回屏幕？

在弹窗中展示一个Web页面，为了让用户不等待加载h5页面，需要先将弹窗展示在屏幕外，页面渲染好后会通知客户端将弹窗移动回屏幕，目前我试过将弹窗中组件translate了-1000到屏幕外，但是遮蔽层仍然是全屏，无法对原页面进行操作；用@State装饰了一个变量distance，maskRect的y引用这个变量，无法立即生效，下次再打开才会生效，我应该怎么做才能让将弹窗移到屏幕外时不会有遮蔽层影响原页面的操作？或者还有什么好的方法能实现这种效果？

目前写了一个demo，打开dialog后点击原页面的‘show’，希望将屏幕外的弹窗移动回来的同时更改maskRect，但是只能移回屏幕不能更改遮蔽层

@Entry
@Component
struct Index {
  [@State](/user/State) distance: number = -100;
  dialogController: CustomDialogController | undefined = undefined
  [@State](/user/State) color: string = '#000000';

  build() {
    RelativeContainer() {
      Text('Open Dialog')
        .fontSize(50)
        .fontWeight(FontWeight.Bold)
        .alignRules({
          center: { anchor: '__container__', align: VerticalAlign.Center },
          middle: { anchor: '__container__', align: HorizontalAlign.Center }
        })
        .onClick(() => {
          this.dialogController?.close()
          this.dialogController = new CustomDialogController({
            builder: DialogBuilder(),
            alignment: DialogAlignment.Center,
            autoCancel: false,
            customStyle: true,
            maskColor: this.color,
            maskRect: {
              x: 0,
              y: this.distance,
              width: '100%',
              height: '100%'
            }
          })
          this.dialogController.open()
        })
      Text('show')
        .fontSize(40)
        .onClick(() => {
          this.distance = this.distance - 100
          emitter.emit('changeY')
        })
        .alignRules({
          bottom: { anchor: '__container__', align: VerticalAlign.Bottom },
          middle: { anchor: '__container__', align: HorizontalAlign.Center }
        })
    }
    .height('100%')
    .width('100%')
  }
}
@CustomDialog
export struct DialogBuilder {
  controller: CustomDialogController
  [@State](/user/State) y: number = -1000

  aboutToAppear(): void {
    emitter.on('changeY', () => {
      this.y = 0
    })
  }

  build() {
    Column() {
      Text('This is a dialog')
        .fontColor(Color.White)
        .fontSize(50)
        .backgroundColor(Color.Blue)
        .fontWeight(FontWeight.Bold)
        .onClick(() => {
          this.y = this.y - 20
        })
    }
    .translate({ y: this.y })

  }
}