第九节HarmonyOS 常用基础组件9-TextArea

1、描述

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

2、接口

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

3、参数

参数名

参数类型

必填

描述

placeholder

ResourceStr

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

text

ResourceStr

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

controller

TextAreaController

设备TextArea控制器。

4、属性

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

名称

参数类型

描述

placeholderColor

ResourceColor

设置placeholder文本颜色。

placeholderFont

Font

设置placeholder文本的样式。包括文字大小、文字粗细等。

textAlign

TextAlign

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

caretColor

ResourceColor

设置输入光标的颜色

inputFilter

{

value: ResourceStr,

error?: (value: string) => void

}

通过正则表达式设置输入过滤器。

copyOption

CopyOptions

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

5、事件

onChange - 输入内容发生变化时触发该回调。

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

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

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

onContentScroll - 文本内容滚动时,触发该回调。

  1. TextAreaController

它是TextArea组件的控制器。

导入对象:

controller:TextAreaController = new TextAreaController();

caretPosition(value: number): void

value是设置输入光标的位置(从字符串开始到光标所在位置的字符长度)。

7、实例

import router from '@ohos.router';@Entry
@Component
struct TextAreaPage {@State message: string = '多行文本输入框组件,当输入的文本内容超过组件宽度时会自动换行显示。'@State textContent: string = '';@State copyContent: string = '';@State cutContent: string = '';@State pasteContent: string = '';// 实例化TextArea的控制器controller: TextAreaController = new TextAreaController();build() {Row() {Scroll() {Column() {Text(this.message).fontSize(20).fontWeight(FontWeight.Bold).width('96%')Blank(12)TextArea({ placeholder: '请输入你的描述', text: this.textContent, controller: this.controller }).placeholderColor(Color.Red)// 设置未输入内容时提示内容的颜色.placeholderFont({ size: 20, weight: FontWeight.Bold })// 设置提示内容的样式如:文本大小、文本粗细等.width('96%').height(200).fontColor(Color.Green).fontSize(20).padding(12).textAlign(TextAlign.Start)// 设置输入框中文本的对其方式.backgroundColor(Color.Yellow)// 设置输入框背景颜色.caretColor(Color.Black)// 设置光标颜色.onChange((value: string) => { //  监听输入内容this.textContent = value;}).onCopy((value: string) => { // 监听复制输入的内容console.log("onCopy value = " + value)this.copyContent = value;}).onCut((value: string) => { //  // 监听剪切输入的内容console.log("onCut value = " + value)this.cutContent = value;}).onPaste((value: string) => { // 监听粘贴到输入框中的内容console.log("onPaste value = " + value)this.pasteContent = value;})Blank(12)Text(this.textContent).width('96%').fontSize(20)Blank(12)Text("copyContent = " + this.copyContent + " - cutContent = " + this.cutContent + " - pasteContent = " + this.pasteContent).width('96%').fontSize(20)Blank(12)Button("TextArea文本文档").fontSize(20).backgroundColor('#007DFF').width('96%').onClick(() => {// 处理点击事件逻辑router.pushUrl({url: "pages/baseComponent/textArea/TextAreaDesc",})})}.width('100%')}}.padding({ top: 12, bottom: 12 })}
}

8、效果图

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/601307.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

使用mysql查询当天、近一周、近一个月及近一年的数据以及各种报表查询sql

1.mysql查询当天的数据 1 select * from table where to_days(时间字段) to_days(now()); 2.mysql查询昨天的数据 1 select * from table where to_days(now( ) ) - to_days( 时间字段名) < 1 3.mysql查询近一个月的数据 1 SELECT * FROM table WHERE date(时间字段) …

迁移数据mysql到clickhouse

场景&#xff1a; 项目上需要将mysql表中数据迁移到clickhouse。 理论&#xff1a; 借助MaterializeMySQL 说明&#xff1a; 首先该方案实施需要启动mysql的binlog配置否则同步不了&#xff0c;尽管MaterializeMySQL官方说是在实验阶段&#xff0c;不应该在生产上使用&#x…

主浏览器优化之路2——Edge浏览器的卸载与旧版本的重新安装

Edge浏览器的卸载与旧版本的重新安装 引言开整寻找最年轻的她开始卸载原本的Edge工具下载后新版本的安装 结尾 引言 &#xff08;这个前奏有点长&#xff0c;但是其中有一些我的思考顿悟与标题的由来&#xff0c;望耐心&#xff09; 我在思考这个系列的时候 最让我陷入困得是…

Spring Boot依赖版本声明

链接 官网 Spring Boot文档官网&#xff1a;​​​​​​https://docs.spring.io/spring-boot/docs/https://docs.spring.io/spring-boot/docs/ Spring Boot 2.0.7.RELEASE Spring Boot 2.0.7.RELEASE reference相关&#xff1a;https://docs.spring.io/spring-boot/docs/2.…

文件夹重命名方法:提高效率减少错误,中英文批量翻译文件夹名称

在日常生活和工作中&#xff0c;经常要处理大量的文件夹&#xff0c;无论是整理电脑上的文件&#xff0c;还是为项目分类。如何快速、准确地重命名这些文件夹&#xff0c;对于提高工作效率和减少错误至关重要。现在来看下云炫文件管理器一些实用的文件夹重命名方法&#xff0c;…

Python+Requests实现接口自动化测试(超详细的)

一般对于自动化的理解&#xff0c;有两种方式的自动化。 第一&#xff0c;不需要写代码&#xff0c;完全由工具实现&#xff0c;这种方式的工具一般是公司自己研发的&#xff0c;方便黑盒测试人员使用。这种工具的特点是学习成本低&#xff0c;方便使用&#xff0c;但是通用性…

高压放大器输出接法及其注意事项

高压放大器应用场景非常广泛&#xff0c;非常适用于半导体高压驱动、TFT产业高压驱动、各种高压工程等应用&#xff1b;也很适用当作音频信号产生器或函数波形产生器的波形放大使用。使用场景广泛&#xff0c;放大器的输出接法也多种&#xff0c;对于不同的放大器也有对应的输出…

C++补充内容--EasyX-UI界面

esay x 其他 地图打印(利用二维数组) 双缓冲 当我们绘制一张图 然后另一张图盖住前一张图的某个部分的时候 由于while的存在 会导致 两张图不停的闪烁 所以加入双缓冲可以解决这个问题 开启双缓冲 之后等待Flush或者End 才会进行图片的绘制 不然不会进行图片的绘制,这样就可…

东信免驱系列身份证阅读器串口通讯协议解析示例,适用于单片机、ARM等系统开发集成使用

完整的一次读卡流程包括&#xff1a; 身份证寻卡 > 身份证选卡 > 身份证读卡&#xff0c;三个步骤 缺一不可&#xff08;见通讯协议&#xff09;。 寻卡&#xff1a;EA EB EC ED 04 00 B0 B4 BB 返回&#xff1a;EA EB EC ED 05 00 00 B0 B5 BB 选卡&#xff1a;EA …

1.4 Unity协程

一、先说接口 接口是不能实例化的&#xff0c;想实例化接口&#xff0c;只能实例化继承了接口的类。 using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.Threading.Tasks;namespace InterfaceTest {interface IMyInterfa…

基于Springboot的旅游管理系统(有报告)。Javaee项目,springboot项目。

演示视频&#xff1a; 基于Springboot的旅游管理系统&#xff08;有报告&#xff09;。Javaee项目&#xff0c;springboot项目。 项目介绍&#xff1a; 采用M&#xff08;model&#xff09;V&#xff08;view&#xff09;C&#xff08;controller&#xff09;三层体系结构&…

使用STM32微控制器驱动LCD1602显示器

驱动LCD1602显示器是嵌入式系统常见的任务之一&#xff0c;而STM32微控制器因其灵活性和丰富的外设而成为了广泛采用的解决方案。在这篇文章中&#xff0c;我们将探讨如何使用STM32微控制器来驱动LCD1602显示器。我们将从STM32的GPIO配置、延时函数以及LCD1602的初始化和写入数…

MIT_线性代数笔记:第 24 讲 马尔可夫矩阵;傅里叶级数

目录 马尔可夫矩阵 Markov matrices傅里叶级数 Fourier series 本讲学习马尔可夫矩阵和傅里叶级数&#xff0c;两者是关于特征值和投影矩阵的应用。 马尔可夫矩阵 Markov matrices A [ 0.1 0.01 0.3 0.2 0.99 0.3 0.7 0 0.4 ] A \begin{bmatrix} 0.1 & 0.01 & 0.3 \\…

所有单片机使用的汇编语言是统一的吗?

所有单片机使用的汇编语言是统一的吗&#xff1f; 在开始前我有一些资料&#xff0c;是我根据网友给的问题精心整理了一份「单片机的资料从专业入门到高级教程」&#xff0c; 点个关注在评论区回复“888”之后私信回复“888”&#xff0c;全部无偿共享给大家&#xff01;&…

十大性能测试工具

这篇关于“性能测试工具”的文章将按以下顺序让您了解不同的软件测试工具&#xff1a; 什么是性能测试&#xff1f; 为什么我们需要性能测试&#xff1f; 性能测试的优势 性能测试的类型 十大性能测试工具 什么是性能测试&#xff1f; 性能测试是一种软件测试&#xff0c;可确…

Origin无法使用主题管理器相关功能或报错:Err, Save Theme dialog error!

问题描述 在使用origin绘图时&#xff0c;往往需要进行大批量绘制同样类型的图。如果每个图都不断地去修改相关设置&#xff0c;无疑是浪费了许多宝贵的时间。为了提高绘图效率&#xff0c;了解到了主题管理器&#xff0c;可在“工具–主题管理器”找到。 然而&#xff0c;当我…

自然语言处理24-T5模型的介绍与训练过程,利用简单构造数据训练微调该模型,体验整个过程

大家好,我是微学AI,今天给大家介绍一下自然语言处理24-T5模型的介绍与训练过程,利用简单构造数据训练微调该模型,体验整个过程。在大模型ChatGPT发布之前,NLP领域是BERT,T5模型为主导,T5(Text-to-Text Transfer Transformer)是一种由Google Brain团队在2019年提出的自然…

ARM工控机Node-red使用教程

嵌入式ARM工控机Node-red安装教程 从前车马很慢书信很远&#xff0c;而现在人们不停探索“科技改变生活”。 智能终端的出现改变了我们的生活方式&#xff0c;钡铼技术嵌入式工控机协助您灵活布建能源管理、大楼自动化、工业自动化、电动车充电站等各种多元性IoT应用&#xff…

Linux 编译安装 Nginx

目录 一、前言二、四种安装方式介绍三、本文安装方式&#xff1a;源码安装3.1、安装依赖库3.2、开始安装 Nginx3.3、Nginx 相关操作3.4、把 Nginx 注册成系统服务 四、结尾 一、前言 Nginx 是一款轻量级的 Web 服务器、[反向代理]服务器&#xff0c;由于它的内存占用少&#xf…

【Pytorch】学习记录分享10——TextCNN用于文本分类处理

【Pytorch】学习记录分享10——PyTorchTextCNN用于文本分类处理 1. TextCNN用于文本分类2. 代码实现 1. TextCNN用于文本分类 具体流程&#xff1a; 2. 代码实现 # coding: UTF-8 import torch import torch.nn as nn import torch.nn.functional as F import numpy as np…