HarmonyOS-UIAbitity-TextArea——【坚果派-红目香薰】

简介: HarmonyOS-UIAbitity-TextArea——【坚果派-红目香薰】
摘要

作者:红目香薰

团队:坚果派

团队介绍:坚果派由坚果创建,团队拥有12个华为HDE以及若干其他领域的三十余位万粉博主运营。

TextArea

可以输入多行文本并支持响应部分输入事件的组件。

接口

TextArea(value?:{placeholder?: ResourceStr, text?: ResourceStr, controller?: TextAreaController})

参数:

参数名

参数类型

必填

参数描述

placeholder

ResourceStr

无输入时的提示文本。

text

ResourceStr

设置输入框当前的文本内容。

controller8+

TextAreaController

设置TextArea控制器。

属性

除支持通用属性外,还支持以下属性:

名称

参数类型

描述

placeholderColor

ResourceColor

设置placeholder文本颜色。

placeholderFont

Font

设置placeholder文本样式:

- size: 设置文本尺寸,Length为number类型时,使用fp单位。

- weight: 设置文本的字体粗细,number类型取值[100, 900],取值间隔为100,默认为400,取值越大,字体越粗。

- family: 设置文本的字体列表。使用多个字体,使用','进行分割,优先级按顺序生效,例如:'Arial, sans-serif'。

- style: 设置文本的字体样式。

textAlign

TextAlign

设置文本水平对齐方式。

默认值:TextAlign.Start

caretColor

ResourceColor

设置输入框光标颜色。

inputFilter8+

{

value: Resource8+,

error?: (value: string) => void

}

通过正则表达式设置输入过滤器。满足表达式的输入允许显示,不满足的输入被忽略。仅支持单个字符匹配,不支持字符串匹配。例如:^(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,10}$,不支持过滤8到10位的强密码。

- value:设置正则表达式。

- error:正则匹配失败时,返回被忽略的内容。

事件

名称

功能描述

onChange(callback: (value: string) => void)

输入发生变化时,触发回调。

onCopy8+(callback:(value: string) => void)

长按输入框内部区域弹出剪贴板后,点击剪切板复制按钮,触发回调。

- value:复制的文本内容1。

onCut8+(callback:(value: string) => void)

长按输入框内部区域弹出剪贴板后,点击剪切板剪切按钮,触发回调。

- value:剪切的文本内容。

onPaste8+(callback:(value: string) => void)

长按输入框内部区域弹出剪贴板后,点击剪切板粘贴按钮,触发回调。

- value:粘贴的文本内容。

TextAreaController8+

TextArea组件的控制器,通过它操作TextArea组件。

导入对象

controller: TextAreaController = new TextAreaController()

caretPosition8+

caretPosition(value: number): void

设置输入光标的位置。

参数:

参数名

参数类型

必填

参数描述

value

number

从字符串开始到光标所在位置的字符长度。

代码示例:

@Entry

@Component

struct Index {

 controller: TextAreaController = new TextAreaController()

 @State text: string = ''

 build() {

   Column() {

     TextArea({ placeholder: '你要输入的单词', controller: this.controller })

       .placeholderColor("rgb(0,0,225)")

       .placeholderFont({ size: 20, weight: 100, family: 'cursive', style: FontStyle.Italic })

       .textAlign(TextAlign.Center)

       .caretColor(Color.Blue)

       .fontSize(30)

       .fontWeight(FontWeight.Bold)

       .fontFamily("sans-serif")

       .fontStyle(FontStyle.Normal)

       .fontColor(Color.Red)

       .inputFilter('^[\u4E00-\u9FA5A-Za-z0-9_]+$', (value: string) => {

         console.info("显示" + value)

       })

       .onChange((value: string) => {

         this.text = value

         this.controller.caretPosition(-1)

       })

     Text(this.text).width('90%')

   }

 }

}

相关文章
|
8月前
HarmonyOS-UIAbitity-Text——【坚果派-红目香薰】
HarmonyOS-UIAbitity-Text——【坚果派-红目香薰】
62 0
|
8月前
HarmonyOS-UIAbitity-StepperItem——【坚果派-红目香薰】
HarmonyOS-UIAbitity-StepperItem——【坚果派-红目香薰】
47 0
|
8月前
|
索引
HarmonyOS-UIAbitity-Stepper——【坚果派-红目香薰】
HarmonyOS-UIAbitity-Stepper——【坚果派-红目香薰】
46 0
|
8月前
HarmonyOS-UIAbitity-Span——【坚果派-红目香薰】
HarmonyOS-UIAbitity-Span——【坚果派-红目香薰】
52 0
|
8月前
HarmonyOS-UIAbitity-Slider——【坚果派-红目香薰】
HarmonyOS-UIAbitity-Slider——【坚果派-红目香薰】
45 0
|
8月前
|
索引
HarmonyOS-UIAbitity-Select——【坚果派-红目香薰】
HarmonyOS-UIAbitity-Select——【坚果派-红目香薰】
46 0
|
1月前
|
存储 人工智能 JavaScript
Harmony OS开发-ArkTS语言速成二
本文介绍了ArkTS基础语法,包括三种基本数据类型(string、number、boolean)和变量的使用。重点讲解了let、const和var的区别,涵盖作用域、变量提升、重新赋值及初始化等方面。期待与你共同进步!
98 47
Harmony OS开发-ArkTS语言速成二
|
2月前
|
API 索引
鸿蒙开发:实现一个超简单的网格拖拽
实现拖拽,最重要的三个方法就是,打开编辑状态editMode,实现onItemDragStart和onItemDrop,设置拖拽移动动画和交换数据,如果想到开启补位动画,还需要实现supportAnimation方法。
83 13
鸿蒙开发:实现一个超简单的网格拖拽
|
2月前
|
索引 API
鸿蒙开发:自定义一个股票代码选择键盘
金融类的软件,特别是股票基金类的应用,在查找股票的时候,都会有一个区别于正常键盘的键盘,也就是股票代码键盘,和普通键盘的区别就是,除了常见的数字之外,也有一些常见的股票代码前缀按钮,方便在查找股票的时候,更加方便的进行检索。
鸿蒙开发:自定义一个股票代码选择键盘
|
2月前
|
API
鸿蒙开发:自定义一个英文键盘
实现方式呢,有很多种,目前采用了比较简单的一种,如果大家采用网格Grid组件实现方式,也是可以的,但是需要考虑每行的边距以及数据,还有最后两行的格子占位问题。
鸿蒙开发:自定义一个英文键盘

热门文章

最新文章