鸿蒙5.0版开发:ArkTS基础组件(TextArea)

往期鸿蒙全套实战文章必看:


TextArea

多行文本输入框组件,当输入的文本内容超过组件宽度时会自动换行显示。

高度未设置时,组件无默认高度,自适应内容高度。宽度未设置时,默认撑满最大宽度。

说明:

该组件从API Version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。

子组件

接口

TextArea(value?: TextAreaOptions)

原子化服务API: 从API version 11开始,该接口支持在原子化服务中使用。

参数:

参数名 类型 必填 说明
value TextAreaOptions TextArea组件参数。

TextAreaOptions对象说明

原子化服务API: 从API version 11开始,该接口支持在原子化服务中使用。

参数名 参数类型 必填 参数描述
placeholder ResourceStr 设置无输入时的提示文本。输入内容后,提示文本不显示。
仅设置placeholder属性时,手柄依然跟随拖动,手柄松开后光标停留在文字开头位置。
text ResourceStr 设置输入框当前的文本内容。
建议通过onChange事件将状态变量与文本实时绑定,
避免组件刷新时TextArea中的文本内容异常。
从API version 10开始,该参数支持$$双向绑定变量。
controller8+ TextAreaController 设置TextArea控制器。

属性

除支持通用属性文本通用属性的fontColor、fontSize、fontStyle、fontWeight、fontFamily外,还支持以下属性:

placeholderColor

placeholderColor(value: ResourceColor)

设置placeholder文本颜色。

原子化服务API: 从API version 11开始,该接口支持在原子化服务中使用。

系统能力: SystemCapability.ArkUI.ArkUI.Full

参数:

参数名 类型 必填 说明
value ResourceColor placeholder文本颜色。
默认值:跟随主题。

placeholderFont

placeholderFont(value: Font)

设置placeholder文本样式,包括字体大小,字体粗细,字体族,字体风格。目前仅支持默认字体族。

原子化服务API: 从API version 11开始,该接口支持在原子化服务中使用。

系统能力: SystemCapability.ArkUI.ArkUI.Full

参数:

参数名 类型 必填 说明
value Font placeholder文本样式。

textAlign

textAlign(value: TextAlign)

设置文本在输入框中的水平对齐方式。

支持TextAlign.Start、TextAlign.Center和TextAlign.End。

可通过align属性控制文本段落在垂直方向上的位置,此组件中不可通过align属性控制文本段落在水平方向上的位置,即align属性中Alignment.TopStart、Alignment.Top、Alignment.TopEnd效果相同,控制内容在顶部,Alignment.Start、Alignment.Center、Alignment.End效果相同,控制内容垂直居中,Alignment.BottomStart、Alignment.Bottom、Alignment.BottomEnd效果相同,控制内容在底部。

当textAlign属性设置为TextAlign.JUSTIFY时,最后一行文本不参与两端对齐,为水平对齐首部效果。

从API version 11开始,textAlign可设置TextAlign.JUSTIFY

原子化服务API: 从API version 11开始,该接口支持在原子化服务中使用。

系统能力: SystemCapability.ArkUI.ArkUI.Full

参数:

参数名 类型 必填 说明
value TextAlign 文本在输入框中的水平对齐方式。
默认值:TextAlign.Start

caretColor

caretColor(value: ResourceColor)

设置输入框光标颜色。

原子化服务API: 从API version 11开始,该接口支持在原子化服务中使用。

系统能力: SystemCapability.ArkUI.ArkUI.Full

参数:

参数名 类型 必填 说明
value ResourceColor 输入框光标颜色。
默认值:‘#007DFF’

说明:
从API version 12开始,此接口支持设置文本手柄颜色,光标和文本手柄颜色保持一致。

inputFilter8+

inputFilter(value: ResourceStr, error?: (value: string) => void)

通过正则表达式设置输入过滤器。匹配表达式的输入允许显示,不匹配的输入将被过滤。仅支持单个字符匹配,不支持字符串匹配。

原子化服务API: 从API version 11开始,该接口支持在原子化服务中使用。

系统能力: SystemCapability.ArkUI.ArkUI.Full

参数:

参数名 类型 必填 说明
value ResourceStr 正则表达式。
error (value: string) => void 正则匹配失败时,返回被过滤的内容。

copyOption9+

copyOption(value: CopyOptions)

设置输入的文本是否可复制。设置CopyOptions.None时,当前TextArea中的文字无法被复制或剪切,仅支持粘贴。

copyOption对于拖拽,只限制是否选中,不涉及拖拽范围。

原子化服务API: 从API version 11开始,该接口支持在原子化服务中使用。

系统能力: SystemCapability.ArkUI.ArkUI.Full

参数:

参数名 类型 必填 说明
value CopyOptions 输入的文本是否可复制。
默认值:CopyOptions.LocalDevice,支持设备内复制。

maxLength10+

maxLength(value: number)

设置文本的最大输入字符数。默认不设置最大输入字符数限制。到达文本最大字符限制,将无法继续输入字符,同时边框变为红色。

原子化服务API: 从API version 11开始,该接口支持在原子化服务中使用。

系统能力: SystemCapability.ArkUI.ArkUI.Full

参数:

参数名 类型 必填 说明
value number 文本的最大输入字符数。

showCounter10+

showCounter(value: boolean, options?: InputCounterOptions)

设置当通过InputCounterOptions输入的字符数超过阈值时显示计数器。

参数value为true时,才能设置options,文本框开启计数下标功能,需要配合maxlength(设置最大字符限制)一起使用。字符计数器显示的效果是当前输入字符数/最大可输入字符数。

当输入字符数大于最大字符数乘百分比值时,显示字符计数器。如果用户设置计数器时不设置InputCounterOptions,那么当前输入字符数达到最大字符数时,边框和计数器下标将变为红色。用户同时设置参数value为true和InputCounterOptions,当thresholdPercentage数值在有效区间内,且输入字符数超过最大字符数时,边框和计数器下标将变为红色,框体抖动。highlightBorder设置为false,则不显示红色边框,计数器默认显示红色边框。内联模式下字符计数器不显示。

原子化服务API: 从API version 11开始,该接口支持在原子化服务中使用。

系统能力: SystemCapability.ArkUI.ArkUI.Full

参数:

参数名 类型 必填 说明
value boolean 是否显示计数器。
options11+ InputCounterOptions 计数器的百分比。

style10+

style(value: TextContentStyle)

设置文本框多态样式,内联输入风格只支持TextAreaType.Normal类型。

原子化服务API: 从API version 11开始,该接口支持在原子化服务中使用。

系统能力: SystemCapability.ArkUI.ArkUI.Full

参数:

参数名 类型 必填 说明
value TextContentStyle 文本框多态样式。
默认值:
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值