如何实现弹出弹窗时不自动收起软键盘
=================

#### 问题现象

当前页面弹出软键盘时，显示自定义弹窗后，会导致软键盘被收起，代码如下：

@Component
@Entry
export struct DialogIssue {
  build() {
    Column({ space: 20 }) {
      TextInput()
        .width('90%');
      Button('弹窗显示2秒后关闭').onClick(() \=\> {
        const dialog \= new CustomDialogController({
          builder: TestDialogController(),
          customStyle: true,
          autoCancel: false,
          isModal: true,
          onWillDismiss: () \=\> {
          }
        });
        dialog.open();
        setTimeout(() \=\> {
          dialog.close();
        }, 2000);
      });
    }.width('100%').height('100%');
  }
}

@CustomDialog
export struct TestDialogController {
  controller?: CustomDialogController;

  build() {
    Text('测试信息');
  }
}

问题示意图如下：

![](https://contentcenter-vali-drcn.dbankcdn.cn/pvt_2/DeveloperAlliance_scene_100_1/a8/v3/SZvVcQASTWuvvg_Pl2Hg1g/zh-cn_image_0000002628765702.png?HW-CC-KV=V1&HW-CC-Date=20260709T134106Z&HW-CC-Expire=86400&HW-CC-Sign=EEC9C9CB8D763474D665E64533BA664F2AD99FE1A1295FD5F4C8FD980A25997B "点击放大")

期望是显示弹窗时，软键盘不收起，如何实现？

#### 效果预览

![](https://contentcenter-vali-drcn.dbankcdn.cn/pvt_2/DeveloperAlliance_scene_100_1/69/v3/U1oDvqCkRvi0cJM4NcLTRQ/zh-cn_image_0000002658965029.png?HW-CC-KV=V1&HW-CC-Date=20260709T134106Z&HW-CC-Expire=86400&HW-CC-Sign=A4B5956EB3F67D320A11581DD3761E1A0C77B1308D8DBD4B59FBEE92E6440247 "点击放大")

#### 背景知识

*   [focusable](https://developer.huawei.com/consumer/cn/doc/harmonyos-references/ts-universal-attributes-focus#focusable)设置当前组件是否可以获焦。
*   [showTextInput](https://developer.huawei.com/consumer/cn/doc/harmonyos-references/js-apis-inputmethod#showtextinput10-1)进入文本编辑状态。使用promise异步回调。
*   [attach](https://developer.huawei.com/consumer/cn/doc/harmonyos-references/js-apis-inputmethod#attach10-1)自绘控件绑定输入法。使用promise异步回调。通过参数showKeyboard绑定输入法成功后，是否拉起输入法键盘。

#### 解决方案

可以通过以下步骤实现弹出弹窗时不自动收起软键盘：

1.  设置TextInput不可获焦：在TextInput组件中使用.focusable(false)，防止其获取焦点，避免弹窗弹出时焦点切换导致软键盘隐藏。
2.  手动控制软键盘显示：inputController.showTextInput()方法手动显示软键盘，而不是依赖默认行为。这样可以在弹窗弹出时保持软键盘可见。
3.  绑定输入法控制器：在组件生命周期中绑定输入法控制器，并订阅键盘状态变化事件，确保软键盘状态不受弹窗弹出影响。

import { inputMethod } from '@kit.IMEKit';
import { BusinessError } from '@kit.BasicServicesKit';

@CustomDialog
export struct TestDialogController {
  controller?: CustomDialogController;

  build() {
    Text('测试信息');
  }
}

@Entry
@Component
struct TextInputTest {
  private inputController: inputMethod.InputMethodController \= inputMethod.getController();
  @State codeTxt: string \= '';
  keyboardStatus: number \= 0;

  async detach() {
    await this.inputController.detach();
    console.info('Succeeded in detaching inputMethod.');
  }

  async aboutToAppear(): Promise<void\> {
    await this.attachAndListener();
  }

  build() {
    Column({ space: 10 }) {
      Button('弹窗显示2秒后关闭').onClick(() \=\> {
        const dialog \= new CustomDialogController({
          builder: TestDialogController(),
          customStyle: true,
          autoCancel: false,
          isModal: true,
          onWillDismiss: () \=\> {
          }
        });
        dialog.open();
        setTimeout(() \=\> {
          dialog.close();
        }, 2000);
      });
      TextInput({ text: this.codeTxt, placeholder: '内容' })
        .width('90%')
        .focusable(false)
        .onClick(async () \=\> {
          this.inputController.showTextInput((err: BusinessError) \=\> {
            if (err) {
              console.error(\`Failed to showTextInput: ${err}\`);
              return;
            }
            console.info('Succeeded in showing the inputMethod.');
          });
        });
    }
    .width('100%').height('100%');
  }

 _ // 绑定和设置监听_
  async attachAndListener() {
    _// 输入法配置项_
    let textConfig: inputMethod.TextConfig \= {
      inputAttribute: {
        textInputType: inputMethod.TextInputType.TEXT,
        enterKeyType: inputMethod.EnterKeyType.GO
      }
    };
  _  // 控件绑定输入法_
    await this.inputController.attach(false, textConfig);
    this.attachListener();
  }

  _// 订阅输入法回调_
  attachListener(): void {
    this.inputController.on('insertText', (text) \=\> {
      this.codeTxt += text;
      console.info(\`this.inputText, insertText this.inputText= ${this.codeTxt}\`);
    });
   _ // 订阅输入法应用向左删除事件_
    this.inputController.on('deleteLeft', (length) \=\> {
      this.codeTxt \= this.codeTxt.substring(0, this.codeTxt.length \- 1);
      console.info(\`this.inputText, deleteLeft this.inputText= ${this.codeTxt}, length ${length}\`);
    });
   _ // 订阅输入法应用发送输入法软键盘状态事件_
    this.inputController.on('sendKeyboardStatus', async (keyboardStatus: inputMethod.KeyboardStatus) \=\> {
      this.keyboardStatus \= keyboardStatus;
      console.info(\`IsaKit this.inputText keyboardStatus= ${this.keyboardStatus}\`);
    });
  }
}