自定义弹窗中有弹出键盘的需要,但是弹出之后如何消除键盘和弹窗之间的距离

自定义弹窗中有弹出键盘的需要,但是弹出之后如何消除键盘和弹窗之间的距离 -鸿蒙开发者社区

类似红框区域,这个距离如何消除?

有的时候开发者不想要这种效果,这种之前想到了expandSafeArea来实现他这个诉求,但是实操写代码发现这种不能实现

HarmonyOS
2024-05-26 15:48:01
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
vclearner

使用的核心API

核心代码解释

@CustomDialog 
@Component 
export struct CustomEditDialogWidget { 
  controller?: CustomDialogController; 
  @State textInputString: string = "" 
  tipString: string = "" 
  textInputConString = (info: string) => { 
  } 
  inputType: InputType = InputType.Normal 
 
  build() { 
    Column() { 
      Text(`请输入${this.tipString}`).margin({ top: 20 }) 
      TextInput({ placeholder: `请输入${this.tipString}` }) 
        .width("90%") 
        .backgroundColor(Color.White) 
        .borderWidth(1) 
        .borderColor("#666") 
        .borderRadius(10) 
        .margin({ top: 20 }) 
        .defaultFocus(true) 
        .onChange((value: string) => { 
          this.textInputString = value 
        }) 
        .type(this.inputType) 
 
      Row() { 
        Text("取消") 
          .fontColor("#333") 
          .onClick(() => { 
            this.controller?.close() 
          }).padding({ left: 35, right: 35, top: 15, bottom: 15 }) 
        Text("|").opacity(0.5).height("100%") 
        Text("确定").fontColor("#000").onClick(() => { 
          if (this.textInputString !== "") { 
            this.textInputConString(this.textInputString) 
          } 
          this.controller?.close() 
        }).padding({ left: 35, right: 35, top: 15, bottom: 15 }) 
      } 
      .width("100%") 
      .height(50) 
      .justifyContent(FlexAlign.SpaceAround) 
      .margin({ top: 10 }) 
 
    } 
    .width("90%") 
    .borderRadius(15) 
    .backgroundColor(Color.White) 
    .borderWidth(5) 
    .offset({ x: 0, y: 20 }) //2.2、弹窗位置 
  } 
}

最后写代码发现可以在自定义弹窗的位置用offset这个通用属性就可以设置距离,实测这个距离是相对于弹窗来说的。

实现效果


分享
微博
QQ
微信
回复
2024-05-27 20:48:09
相关问题
如何实现弹窗键盘避让
1526浏览 • 1回复 待解决
HarmonyOS 自定义键盘
242浏览 • 1回复 待解决