华为仓颉鸿蒙HarmonyOS NEXT原生UI基础组件TextArea
多行文本输入框组件，当输入的文本内容超过组件宽度时会自动换行显示。高度未设置时，组件无默认高度，自适应内容高度。宽度未设置时，默认撑满最大宽度。
说明
TextArea暂不支持混合页面场景。
子组件
无
构造函数
init(String, String, TextAreaController)
public init(placeholder!: String = "", text!: String = "", controller!: TextAreaController = TextAreaController())创建 TextArea 组件对象。
参数名
参数类型
必填
默认值
描述
placeholder
String
否
设置无输入时的提示文本。输入内容后，提示文本不显示。
text
String
否
设置输入框当前的文本内容。建议通过onChange事件将状态变量与文本实时绑定，避免组件刷新时TextArea中的文本内容异常。
controller
TextAreaController
否
TextAreaController()
TextArea控制器。
init(CJResource, String, TextAreaController)
public init(placeholder!: CJResource, text!: String = "", controller!: TextAreaController = TextAreaController())创建 TextArea 组件对象。
参数名
参数类型
必填
默认值
描述
placeholder
CJResource
是
设置无输入时的提示文本。输入内容后，提示文本不显示。
text
String
否
设置输入框当前的文本内容。建议通过onChange事件将状态变量与文本实时绑定，避免组件刷新时TextArea中的文本内容异常。
controller
TextAreaController
否
TextAreaController()
TextArea控制器。
init(String, CJResource, TextAreaController)
public init(placeholder!: String = "", text!: CJResource, controller!: TextAreaController = TextAreaController())创建 TextArea 组件对象。
参数名
参数类型
必填
默认值
描述
placeholder
String
否
设置无输入时的提示文本。输入内容后，提示文本不显示。
text
CJResource
是
设置输入框当前的文本内容。建议通过onChange事件将状态变量与文本实时绑定，避免组件刷新时TextArea中的文本内容异常。
controller
TextAreaController
否
TextAreaController()
TextArea控制器。
init(CJResource, CJResource, TextAreaController)
public init(placeholder!: CJResource, text!: CJResource, controller!: TextAreaController = TextAreaController())创建 TextArea 组件对象。
参数名
参数类型
必填
默认值
描述
placeholder
CJResource
是
设置无输入时的提示文本。输入内容后，提示文本不显示。
text
CJResource
是
设置输入框当前的文本内容。建议通过onChange事件将状态变量与文本实时绑定，避免组件刷新时TextArea中的文本内容异常。
controller
TextAreaController
否
TextAreaController()
TextArea 控制器。
函数
除支持通用属性和文本通用属性的fontColor、fontSize、fontStyle、fontWeight、fontFamily外，还支持以下功能：
enterKeyType(EnterKeyType)
public func enterKeyType(value: EnterKeyType): This设置键盘操作按钮的类型。
参数名
参数类型
必填
默认值
描述
value
EnterKeyType
是
EnterKeyType.NEW_LINE
输入法回车键类型。
caretColor(Color)
public func caretColor(value: Color): This设置输入框光标颜色。
参数名
参数类型
必填
默认值
描述
value
Color
是
007DFF
输入框光标颜色。
caretColor(CJResource)
public func caretColor(value: CJResource): This设置输入框光标颜色。
参数名
参数类型
必填
默认值
描述
value
CJResource
是
输入框光标颜色。
caretColor(UInt32)
public func caretColor(value: UInt32): This设置输入框光标颜色。
参数名
参数类型
必填
默认值
描述
value
UInt32
是
输入框光标颜色。
placeholderColor(Color)
public func placeholderColor(value: Color): This设置placeholder文本颜色。
参数名
参数类型
必填
默认值
描述
value
Color
是
跟随主题
placeholder文本颜色。
placeholderColor(UInt32)
public func placeholderColor(value: UInt32): This设置placeholder文本颜色。
参数名
参数类型
必填
默认值
描述
value
UInt32
是
跟随主题
placeholder文本颜色。
placeholderFont(Length, FontWeight, String, FontStyle)
public func placeholderFont(size!: Length, weight!: FontWeight = FontWeight.W400, family!: String = "", style!: FontStyle = FontStyle.Normal): This设置placeholder文本样式，包括字体大小，字体粗细，字体族，字体风格。目前仅支持默认字体族。
参数名
参数类型
必填
默认值
描述
size
Length
是
16.0.fp
文本尺寸。 使用fp单位。
weight
FontWeight
否
FontWeight.W400
文本的字体粗细。
family
String
否
""
文本的字体列表。
style
FontStyle
否
FontStyle.Normal
文本的字体样式。
placeholderFont(Length, FontWeight, String, FontStyle)
public func placeholderFont(size!: Float64, weight!: FontWeight = FontWeight.W400, family!: String = "", style!: FontStyle = FontStyle.Normal): This设置placeholder文本样式，包括字体大小，字体粗细，字体族，字体风格。目前仅支持默认字体族。
参数名
参数类型
必填
默认值
描述
size
Float64
是
16.0
文本尺寸。 使用fp单位。
weight
FontWeight
否
FontWeight.W400
文本的字体粗细。
family
String
否
""
文本的字体列表。
style
FontStyle
否
FontStyle.Normal
文本的字体样式。
placeholderFont(Int64, FontWeight, String, FontStyle)
public func placeholderFont(size!: Int64, weight!: FontWeight = FontWeight.W400, family!: String = "", style!: FontStyle = FontStyle.Normal): This设置placeholder文本样式，包括字体大小，字体粗细，字体族，字体风格。目前仅支持默认字体族。
参数名
参数类型
必填
默认值
描述
size
Int64
是
16
文本尺寸。使用fp单位。
weight
FontWeight
否
FontWeight.W400
文本的字体粗细。
family
String
否
""
文本的字体列表。
style
FontStyle
否
FontStyle.Normal
文本的字体样式。
placeholderFont(CJResource, FontWeight, String, FontStyle)
public func placeholderFont(size!: CJResource, weight!: FontWeight = FontWeight.W400, family!: String = "", style!: FontStyle = FontStyle.Normal): This设置placeholder文本样式，包括字体大小，字体粗细，字体族，字体风格。目前仅支持默认字体族。
参数名
参数类型
必填
默认值
描述
size
CJResource
是
文本尺寸。
weight
FontWeight
否
FontWeight.W400
文本的字体粗细。
family
String
否
""
文本的字体列表。
style
FontStyle
否
FontStyle.Normal
文本的字体样式。
inputFilter(String, (String)-> Unit)
public func inputFilter(value!: String, error!: (String)-> Unit = { value => }): This通过正则表达式设置输入过滤器。匹配表达式的输入允许显示，不匹配的输入将被过滤。仅支持单个字符匹配，不支持字符串匹配。
参数名
参数类型
必填
默认值
描述
value
String
是
正则表达式。
value
(String)-> Unit
否
{ value => }
正则匹配失败时，返回被过滤的内容。
textAlign(TextAlign)
public func textAlign(value: TextAlign): This设置文本在输入框中的水平对齐方式。
参数名
参数类型
必填
默认值
描述
value
TextAlign
是
TextAlign.Start
水平对齐方式。仅支持TextAlign.Start、TextAlign.Center和TextAlign.End。
自定义类型说明
TextAreaController
TextArea 组件的控制器。
public class TextAreaController {
public init()
public func caretPosition(value: Int32): Unit
}构造函数
init()
public init()构造一个 TextAreaController 类型的对象。
函数
caretPosition(Int32)
public func caretPosition(value: Int32): Unit设置光标位置。
参数名
参数类型
必填
默认值
描述
value
Int32
是
光标的位置。
事件
除支持通用事件外，还支持以下事件：
onSubmit((EnterKeyType)->Unit)
public func onSubmit(callback: (EnterKeyType)->Unit): This按下输入法回车键触发该回调。
参数名
参数类型
描述
callback
(EnterKeyType)->Unit
回车键或者软键盘回车键触发该回调，参数为当前软键盘回车键类型。
onChange((String)->Unit)
public func onChange(callback: (String)->Unit): This输入内容发生变化时，触发该回调。
触发该事件的条件：
1、键盘输入。
2、粘贴、剪切。
3、键盘快捷键Ctrl+v。
参数名
参数类型
描述
callback
(String)->Unit
文本内容改变时触发，返回当前的文本内容。
onCopy((String)->Unit)
public func onCopy(callback: (String)->Unit): This长按输入框内部区域弹出剪贴板后，点击剪切板复制按钮，触发该回调。
参数名
参数类型
描述
callback
(String)->Unit
复制时触发，返回复制的文本内容。
onCut((String)->Unit)
public func onCut(callback: (String)->Unit): This长按输入框内部区域弹出剪贴板后，点击剪切板剪切按钮，触发该回调。
参数名
参数类型
描述
callback
(String)->Unit
剪切时触发，返回剪切的文本内容。
onPaste((String)->Unit)
public func onPaste(callback: (String)->Unit): This长按输入框内部区域弹出剪贴板后，点击剪切板粘贴按钮，触发该回调。
参数名
参数类型
描述
callback
(String)->Unit
粘贴时触发，返回粘贴的文本内容。
onEditChange((Bool)->Unit)
public func onEditChange(callback: (Bool)->Unit): This输入状态变化时，触发该回调。有光标时为编辑态，无光标时为非编辑态。
参数名
参数类型
描述
callback
(Bool)->Unit
编辑状态改变时触发，返回当前编辑状态。参数为true表示正在输入。
onEditChanged((Bool)->Unit)
public func onEditChanged(callback: (Bool)->Unit): This输入状态变化时，触发该回调。有光标时为编辑态，无光标时为非编辑态。
参数名
参数类型
描述
callback
(Bool)->Unit
编辑状态改变时触发，返回当前编辑状态。参数为true表示正在输入。
通用属性/通用事件
通用属性：全部支持。
通用事件：全部支持。
示例代码
import ohos.base.*
import ohos.component.*
import ohos.state_manage.*
import ohos.state_macro_manage.*
@Entry
@Component
class MyView {
@State var placeholder: String = "please input your name"
@State var name: String = "AAA"
var controller: TextAreaController = TextAreaController()
var scroller: Scroller = Scroller()
func build() {
Scroll(this.scroller) {
Column(10.px){
Button("caretposition 3").onClick({
evt => controller.caretPosition(3)
})
TextArea(placeholder: this.placeholder, text: this.name, controller: controller)
.textAlign(TextAlign.Center)
TextArea(text: "size")
.size(width: 100.vp, height: 50.vp).borderRadius(100.vp)
TextArea(text: "border")
.border(width: 1.vp, color: Color(0XFFFF0011), radius: 5.vp, style: BorderStyle.Dashed )
TextArea(text: "padding")
.padding(40.vp)
TextArea(text: "font color")
.fontColor(0x8A2BE2)
TextArea(text: "font size 60")
.fontSize(60)
TextArea(text: "font weight 900")
.fontWeight(FontWeight.W900)
TextArea(text: "font style Italic")
.fontStyle(FontStyle.Italic)
TextArea(placeholder: "placeholder font")
.placeholderColor(Color(0x8A2BE2))
.placeholderFont(size:60.0, weight: FontWeight.W900, family:"Georgia", style:FontStyle.Italic)
TextArea(placeholder: "textAlign")
.textAlign(TextAlign.Start)
TextArea(placeholder: "caretColor")
.caretColor(Color.RED)
TextArea(placeholder: "inputfilter only a")
.inputFilter(value: "a" , error: { val => nativeLog( "TextArea OnError:" + val) })
TextArea(placeholder: "TextArea callback")
.onChange ({ val =>
nativeLog("TextArea onChange:" + val)
})
.onPaste ({ val =>
nativeLog("TextArea onPaste:" + val)
})
.onCut ({ val =>
nativeLog("TextArea onCut:" + val)
})
.onCopy ({ val =>
nativeLog("TextArea onCopy:" + val)
})
.onEditChanged ({ val =>
nativeLog("TextArea onEditChanged:" + val.toString())
})
.onSubmit ({ val =>
nativeLog("TextArea onSubmit")
})
}
.height(100.percent)
.width(100.percent)
}
}
}
还没有申请仓颉内测资格的朋友可以看一下下面这篇文章
华为仓颉编程语言内测申请攻略《附带仓颉鸿蒙开发权限》
如对您有帮助，帮忙点个“在看 、关注” 让更多的人受益~！
技术交流群可加wx“LB-9191” 备注cangjie
浙公网安备 33010602011771号