TextInput组件输入状态下隐藏光标

输入框输入数字验证码进行校验的场景中,如果使用TextInput单行文本输入框作为验证码的输入框,当点击TextInput调起输入法会有蓝色的光标,现在想要完全隐藏掉光标(包括下面“圆圈”手柄)。

TextInput组件输入状态下隐藏光标-鸿蒙开发者社区

HarmonyOS
2024-05-26 12:02:35
1650浏览
1
收藏 0
回答 1
回答 1
按赞同
/
按时间
liqi399

使用的核心API

Stack容器

核心代码解释

使用Stack容器包含TextInput和Text子组件,将TextInput设置为透明状态隐藏,具体要显示的文本反馈在Text上面。

@Entry 
@Component 
struct Index { 
  @State text: string = '' 
  controller: TextInputController = new TextInputController() 
  build() { 
    Column() { 
      Stack() { 
        TextInput({ text: this.text, controller: this.controller }) 
          .opacity(0) // 设置输入框透明度为0,隐藏光标 
          .width(200) 
          .height(60) 
          .margin(10) 
          .type(InputType.Number) 
          .onChange((value: string) => { 
            this.text = value 
          }) 
        Text(this.text).margin(10) //具体要显示的文本反馈在Text上面 
      } 
  
      Button('clear') 
        .onClick(() => { 
          this.text = '' 
        }) 
    }.width('100%') 
  } 
}
  • 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.

适配的版本信息

IDE:DevEco Studio 4.0.3.600

SDK:4.0.10.11

分享
微博
QQ
微信
回复
2024-05-27 15:57:16


相关问题
HarmonyOS TextInput如何隐藏光标
546浏览 • 1回复 待解决
HarmonyOS 如何隐藏TextInput中的光标
606浏览 • 1回复 待解决
如何设置组件不同状态下的样式
2656浏览 • 1回复 待解决
何设置组件不同状态下的样式
2809浏览 • 1回复 待解决
HarmonyOS 横屏状态下获取组件的宽高
1320浏览 • 1回复 待解决
设置TextInput组件光标位置在起点
1339浏览 • 1回复 待解决
HarmonyOS 输入光标控制
1095浏览 • 1回复 待解决
TextInput怎么输入中文
4011浏览 • 0回复 待解决
小程序输入法键盘光标问题
1258浏览 • 1回复 待解决
HarmonyOS 输入光标移位监听
864浏览 • 1回复 待解决