HarmonyOS 鸿蒙Next 当弹窗弹出的时候,点击弹窗以外的区域,不让弹窗消失,有什么办法吗?

HarmonyOS 鸿蒙Next 当弹窗弹出的时候,点击弹窗以外的区域,不让弹窗消失,有什么办法吗?

CustomDialog弹窗和promptAction 弹窗 两种方式都有试过,点击空白区域的时候,弹窗都会消失,问题: 有什么办法,在弹窗弹出的时候,点击弹窗以外的区域不让它消失吗?

import promptAction from '@ohos.promptAction';

@Entry
@Component
struct LinePage_7 {
  dialogController: CustomDialogController = new CustomDialogController({
    builder: CustomDialogExample({
      cancel: this.onCancel,
      confirm: this.onAccept,
    }),
    alignment: DialogAlignment.Default, // 可设置dialog的对齐方式,设定显示在底部或中间等,默认为底部显示
  })

  onCancel() {
    console.info('Callback when the first button is clicked')
  }

  onAccept() {
    console.info('Callback when the second button is clicked')
  }

  build() {
    Column() {
      Button('@ohos.promptAction弹窗').margin({ top: 20 }).width('70%').type(ButtonType.Normal).onClick(() => {
        promptAction.showActionMenu({
          title: 'Title Info',
          buttons: [
            {
              text: 'item1',
              color: '#666666',
            },
            {
              text: 'item2',
              color: '#000000',
            },
          ]
        }, (err, data) => {
          if (err) {
            console.info('showActionMenu err: ' + err);
            return;
          }
          console.info('showActionMenu success callback, click button: ' + data.index);
        })
      })

      Button('CustomDialog弹窗').margin({ top: 20 }).width('70%').type(ButtonType.Normal).onClick(() => {
        this.dialogController.open()
      })
    }.width('100%')
  }
}

@CustomDialog
struct CustomDialogExample {
  controller: CustomDialogController
  cancel: () => void
  confirm: () => void

  build() {
    Column() {
      Text('我是内容').fontSize(20).margin({ top: 10, bottom: 10 })
      Flex({ justifyContent: FlexAlign.SpaceAround }) {
        Button('cancel')
          .onClick(() => {
            this.controller.close()
            this.cancel()
          }).backgroundColor(0xffffff).fontColor(Color.Black)
        Button('confirm')
          .onClick(() => {
            this.controller.close()
            this.confirm()
          }).backgroundColor(0xffffff).fontColor(Color.Red)
      }.margin({ bottom: 10 })
    }
  }
}

更多关于HarmonyOS 鸿蒙Next 当弹窗弹出的时候,点击弹窗以外的区域,不让弹窗消失,有什么办法吗?的实战教程也可以访问 https://www.itying.com/category-93-b0.html

7 回复
dialogController: CustomDialogController = 
new CustomDialogController({ 
builder: CustomDialogExample({ 
      cancel: this.onCancel, 
      confirm: this.onAccept, }), alignment: DialogAlignment.Default, // 可设置dialog的对齐方式,设定显示在底部或中间等,默认为底部显示 
autoCancel:false,//是否允许点击遮障层退出。默认值:true
})

更多关于HarmonyOS 鸿蒙Next 当弹窗弹出的时候,点击弹窗以外的区域,不让弹窗消失,有什么办法吗?的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


感谢,在API文档中也找到了这个属性,刚刚找半天没有找到!谢谢~

但是promptAction弹窗好像没有点击遮障层退出的属性,

这个确实没有 如果有需求就用CustomDialog吧,

按返回健的时候也会消失

在HarmonyOS中,如果你希望弹窗在点击外部区域时不消失,可以通过设置弹窗的setCanceledOnTouchOutside属性为false来实现。具体代码如下:

let dialogController = new DialogController();
let dialog = dialogController.createDialog({
  title: '提示',
  message: '这是一个弹窗',
  buttons: [
    {
      text: '确定',
      action: () => {
        // 确定按钮点击事件
      }
    }
  ]
});
dialog.setCanceledOnTouchOutside(false); // 设置点击外部区域不消失
dialog.show();

通过这种方式,弹窗在用户点击外部区域时将不会自动关闭。

回到顶部