TextArea

About 4 min

TextArea

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

提供多行文本输入组件。

权限列表

子组件

接口

TextArea(value?: { placeholder?: string })

  • 参数

    参数名

    参数类型

    必填

    默认值

    参数描述

    placeholder

    string

    -

    无输入时的提示文本。

属性

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

名称

参数类型

默认值

描述

placeholderColor

Color

-

设置placeholder文本颜色。

placeholderFont

{

size?: number,

weight?:number | FontWeight,

family?: string,

style?: FontStyle

}

-

设置placeholder文本样式:

  • size: 设置文本尺寸,Length为number类型时,使用fp单位。
  • weight: 设置文本的字体粗细,number类型取值[100, 900],取值间隔为100,默认为400,取值越大,字体越粗。
  • family: 设置文本的字体列表。使用多个字体,使用','进行分割,优先级按顺序生效。例如:'Arial, sans-serif'。
  • style: 设置文本的字体样式。

textAlign

TextAlign

TextAlign.Start

设置文本水平对齐方式。

caretColor

Color

-

设置输入框光标颜色。

  • TextAlign枚举说明

    名称

    描述

    Start

    水平对齐首部。

    Center

    水平居中对齐。

    End

    水平对齐尾部。

事件

名称

功能描述

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

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

示例

@Entry
@Component
struct TextAreaExample {
  @State text: string = ''

  build() {
    Column() {
      TextArea({ placeholder: 'input your word' })
        .placeholderColor("rgb(0,0,225)")
        .placeholderFont({ size: 30, weight: 100, family: 'cursive', style: FontStyle.Italic })
        .textAlign(TextAlign.Center)
        .caretColor(Color.Blue)
        .height(50)
        .fontSize(30)
        .fontWeight(FontWeight.Bold)
        .fontFamily("sans-serif")
        .fontStyle(FontStyle.Normal)
        .fontColor(Color.Red)
        .onChange((value: string) => {
          this.text = value
        })
      Text(this.text).width('90%')
    }
  }
}
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