鸿蒙5.0开发进阶:UI框架-ArkTS组件(TextArea)

往期鸿蒙全套实战文章必看:(文中附带全栈鸿蒙学习资料)


TextArea

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

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

说明

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

子组件

接口

TextArea(value?: TextAreaOptions)

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

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

参数:

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

TextAreaOptions对象说明

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

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

名称 类型 必填 说明
placeholder ResourceStr

设置无输入时的提示文本。输入内容后,提示文本不显示。

仅设置placeholder属性时,手柄依然跟随拖动,手柄松开后光标停留在文字开头位置。

text ResourceStr

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

建议通过onChange事件将状态变量与文本实时绑定,

避免组件刷新时TextArea中的文本内容异常。

从API version 10开始,该参数支持$$双向绑定变量。

controller8+ TextAreaController 设置TextArea控制器。

属性

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

说明

通用属性padding的默认值为:

{

top: '8vp',

right: '16vp',

bottom: '8vp',

left: '16vp'

}

从API version 11开始,多行输入框可设置.width('auto')使组件宽度自适应文本宽度,自适应时组件宽度受constraintSize属性以及父容器传递的最大最小宽度限制,其余使用方式参考尺寸设置

placeholderColor

placeholderColor(value: ResourceColor)

设置placeholder文本颜色。

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

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

参数:

参数名 类型 必填 说明
value ResourceColor

placeholder文本颜色。

默认值:跟随主题。

placeholderFont

placeholderFont(value: Font)

设置placeholder文本样式,包括字体大小,字体粗细,字体族,字体风格。当前支持'HarmonyOS Sans'字体和注册自定义字体

元服务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开始,此接口支持设置文本手柄颜色,光标和文本手柄颜色保持一致。

fontColor

fontColor(value: ResourceColor)

设置字体颜色。

卡片能力: 从API version 9开始,该接口支持在ArkTS卡片中使用。

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

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

参数:

参数名 类型 必填 说明
value ResourceColor 字体颜色。

fontSize

fontSize(value: number | string | Resource)

设置字体大小。

卡片能力: 从API version 9开始,该接口支持在ArkTS卡片中使用。

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

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

参数:

参数名 类型 必填 说明
value Resource | number | string 字体大小。fontSize为number类型时,使用fp单位。字体默认大小16fp。不支持设置百分比字符串。

fontStyle

fontStyle(value: FontStyle)

设置字体样式。

卡片能力: 从API version 9开始,该接口支持在ArkTS卡片中使用。

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

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

参数:

参数名 类型 必填 说明
value FontStyle

字体样式。

默认值:FontStyle.Normal

fontWeight

fontWeight(value: number | FontWeight | string)

设置文本的字体粗细,设置过大可能会在不同字体下有截断。

卡片能力: 从API version 9开始,该接口支持在ArkTS卡片中使用。

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

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

参数:

参数名 类型 必填 说明
value FontWeight | number | string

文本的字体粗细,number类型取值[100, 900],取值间隔为100,默认为400,取值越大,字体越粗。string类型仅支持number类型取值的字符串形式,例如"400",以及"bold"、"bolder"、"lighter"、"regular"、"medium",分别对应FontWeight中相应的枚举值。

默认值:FontWeight.Normal

fontFamily

fontFamily(value: string | Resource)

设置字体列表。

卡片能力: 从API version 9开始,该接口支持在ArkTS卡片中使用。

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

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

参数:

参数名 类型 必填 说明
value
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值