HarmonyOS CustomDialogController如何在显示键盘的时候，点击返回键先关闭键盘

目前点击返回键，不仅键盘关闭了CustomDialog也跟着关闭了。

HarmonyOS

superinsect

2025-01-09 16:21:05

浏览

回答 1

待解决

回答 1

按赞同

按时间

fox280

参考示例如下：

import { window } from '@kit.ArkUI'

@CustomDialog
struct CustomDialogExample {
  controller?: CustomDialogController

  build() {
    Column() {
      Text('Change text').fontSize(20).margin({ top: 10, bottom: 10 })// 标记焦点
        .id('Text').focusable(true)
      TextInput().height(60).width('90%')
    }.borderRadius(10)
  }
}

@Entry
@Component
struct CustomDialogUser {
  @State textValue: string = ''
  @State inputValue: string = 'click me'
  @State keyboardIsShow: boolean = false // 软键盘是否弹出

  //窗口的回调，判断键盘的高度（只能判断键盘的起或者终的高度，开发者可以看日志打印，）
  onPageShow(): void {
    window.getLastWindow(getContext(this), (err, win) => {
      win.on("keyboardHeightChange", (data) => {
        console.log("soft keyboard height: " + data, " zbt")
        if (data != 0) {
          this.keyboardIsShow = true
        } else {
          this.keyboardIsShow = false
        }
      })
    })
  }

  dialogController: CustomDialogController | null = new CustomDialogController({
    builder: CustomDialogExample({}),
    autoCancel: true,
    alignment: DialogAlignment.Bottom,
    offset: { dx: 0, dy: -20 },
    customStyle: false,
    gridCount: 4,
    cornerRadius: 10,
    onWillDismiss: (dismissDialogAction: DismissDialogAction) => {
      console.info("reason=" + JSON.stringify(dismissDialogAction.reason))
      console.log("dialog onWillDismiss")
      if (dismissDialogAction.reason == DismissReason.PRESS_BACK) {
        if (this.keyboardIsShow) {
          focusControl.requestFocus('Text')
        } else {
          dismissDialogAction.dismiss()
        }
      }
    },
  })

  aboutToDisappear() {
    this.dialogController = null
  }

  build() {
    Column() {
      Button(this.inputValue)
        .onClick(() => {
          if (this.dialogController != null) {
            this.dialogController.open()
          }
        }).backgroundColor(0x317aff)
    }.width('100%').height('100%').margin({ top: 5 })
  }
}