问题场景在弹框中使用textinput控件,点击输入键盘弹起,弹框进行上移了,有什么方法禁止弹框移动吗?还有那个输入框样式怎么定义成方格的样式,需要展示6个设置安全区域.expandSafeArea([SafeAreaType.SYSTEM], [SafeAreaEdge.TOP, SafeAreaEdge.BOTTOM]);参考链接:https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/ts-universal-attributes-expand-safe-area-V5全模态内的输入框上抬需要开发者自己做,可以通过这个接口获取到键盘的高度来避让参考链接:https://developer.huawei.com/consumer/cn/doc/harmonyos-references/js-apis-inputmethod-0000001774281542关于类似验证码数字输入框,请参考以下代码示例://验证码输入框 interface codeOne { str: string, isBorder: boolean } @Entry @Component export struct TextInputCodeView { // 验证码 @State code: string = '' // 验证码位数 @Prop someArrayLength: number = 4 someArray: number[] = [] aboutToAppear(): void { this.someArray = Array.from({ length: this.someArrayLength }) } build() { Stack() { Row() { ForEach(this.someArray, (item: number, index: number) => { //加间隙 if (index != 0) { Blank() } //index + 1 :表示输入框的位置。 //填写验证码 if (this.code.length >= index + 1) { this.OneText({ str: this.code.substring(index, index + 1), isBorder: index + 1 === this.someArray.length }) } else { //没有验证码 this.OneText({ str: '', isBorder: this.code.length + 1 === index + 1 }) } }, (item: number, index: number) => JSON.stringify(index + 1)) //键值标识 } .width('100%') TextInput({ placeholder: "" }) .width('100%') .height('100%') .maxLength(this.someArray.length) .caretColor(Color.Transparent) .fontColor(Color.Transparent) .borderColor(Color.Transparent) .backgroundColor(Color.Transparent) .onChange((value: string) => { this.code = value }) .onSubmit(async () => { //回车事件 }) } .width('100%') .height(60) } //参数:验证码内容,是否显示边框 @Builder OneText(item: codeOne) { //判断,是否选中当前的输入框,是否有内容 。是当前选中的,没有内容,显示 | Text(item.isBorder && !item.str ? '|' : item.str as string) .width(50) .height(50) .textAlign(TextAlign.Center) .fontSize(20) .fontColor(item.isBorder && !item.str ? '#ffdd4f46' : Color.Black) .backgroundColor('#f3f4f6') .borderRadius(8) } }
问题场景
在弹框中使用textinput控件,点击输入键盘弹起,弹框进行上移了,有什么方法禁止弹框移动吗?还有那个输入框样式怎么定义成方格的样式,需要展示6个
设置安全区域.expandSafeArea([SafeAreaType.SYSTEM], [SafeAreaEdge.TOP, SafeAreaEdge.BOTTOM]);
参考链接:https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/ts-universal-attributes-expand-safe-area-V5
全模态内的输入框上抬需要开发者自己做,可以通过这个接口获取到键盘的高度来避让
参考链接:https://developer.huawei.com/consumer/cn/doc/harmonyos-references/js-apis-inputmethod-0000001774281542
关于类似验证码数字输入框,请参考以下代码示例: