HarmonyOS CustomDialogController组件问题

CustomDialogController组件可以点击背景透传事件吗?就是一个自定义个弹窗,点击背后的按钮依然可点击。

HarmonyOS
2024-09-29 12:52:51
浏览
收藏 0
回答 1
回答 1
按赞同
/
按时间
zxjiu

可以通过autoCancel属性来设置是否允许点击遮障层退出,参考链接:https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/ts-methods-custom-dialog-box-V5#customdialogcontrolleroptions对象说明

参考demo:

@CustomDialog  
export struct MyDialog1 {  
  controller1: CustomDialogController  
  title: string = ''  
  build() {  
    Row() {  
      Column({ space: 10 }) {  
        Text(this.title)  
          .fontSize(25)  
          .fontColor(Color.Blue)  
        Flex({ justifyContent: FlexAlign.SpaceAround }) {  
          Button('取消')  
            .onClick(() => {  
              this.controller1.close()  
            }).backgroundColor(0xffffff).fontColor(Color.Black)  
          Button('确认')  
            .onClick(() => {  
              this.controller1.close()  
            }).backgroundColor(0xffffff).fontColor(Color.Black)  
        }.width("100%")  
      }.width("100%")  
    }.height(100)  
  }  
}  
// main页面  
@Entry  
@Component  
struct Index {  
  @State dialogData: string = ''  
  @State colorTest: Color = Color.Blue  
  dialogController1: CustomDialogController = new CustomDialogController({  
    builder: MyDialog1({  
      title: '弹窗1',  
    }),  
    // 弹窗容器样式是否自定义  
    customStyle: false,  
    // 是否允许点击遮障层退出  
    autoCancel: false,  
    // 弹窗遮蔽层区域,在遮蔽层区域内的事件不透传,在遮蔽层区域外的事件透传  
    maskRect: ({x:0,y:667,width:'100%',height:100}),  
  })  
  confirm(data: string) {  
    this.dialogData = data  
    console.info(recv dialog data: ${data}) // 获取弹窗输入的信息  
  }  
  // 在自定义组件即将析构销毁时将dialogController置空  
  aboutToDisappear() {  
  }  
  build() {  
    Row() {  
      Column({ space: 10 }) {  
        Text(这是一个弹窗的测试)  
          .fontSize(25).margin(20).fontColor(0x3399FF)  
        Button('点击打开弹窗')  
          .onClick(() => {  
            this.dialogController1.open()  
          })  
        Button('点击改变颜色,不影响弹窗')  
          .onClick(() => {  
            this.colorTest = this.colorTest == Color.Blue ? Color.Yellow : Color.Blue  
          })  
          .backgroundColor(this.colorTest)  
      }.width("100%")  
    }.height("100%").backgroundColor(Color.Pink)  
  }  
}
  • 1.
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9.
  • 10.
  • 11.
  • 12.
  • 13.
  • 14.
  • 15.
  • 16.
  • 17.
  • 18.
  • 19.
  • 20.
  • 21.
  • 22.
  • 23.
  • 24.
  • 25.
  • 26.
  • 27.
  • 28.
  • 29.
  • 30.
  • 31.
  • 32.
  • 33.
  • 34.
  • 35.
  • 36.
  • 37.
  • 38.
  • 39.
  • 40.
  • 41.
  • 42.
  • 43.
  • 44.
  • 45.
  • 46.
  • 47.
  • 48.
  • 49.
  • 50.
  • 51.
  • 52.
  • 53.
  • 54.
  • 55.
  • 56.
  • 57.
  • 58.
  • 59.
  • 60.
  • 61.
  • 62.
  • 63.
  • 64.
  • 65.
  • 66.
分享
微博
QQ
微信
回复
2024-09-29 18:20:35
相关问题
HarmonyOS CustomDialogController问题
1286浏览 • 1回复 待解决
HarmonyOS CustomDialogController使用问题
452浏览 • 1回复 待解决
HarmonyOS CustomDialogController封装
663浏览 • 1回复 待解决
HarmonyOS CustomDialogController如何封装
1003浏览 • 1回复 待解决
HarmonyOS CustomDialogController 不显示
1142浏览 • 1回复 待解决
HarmonyOS CustomDialogController套用Scroll
736浏览 • 1回复 待解决
CustomDialogController禁用返回键
879浏览 • 1回复 待解决
CustomDialogController能否支持再次封装
1227浏览 • 1回复 待解决