文本显示text

文本显示

text是文本组件

创建文本
Text('基础语法')//   引用字符串Text($r('app.string.hella'))
添加子组件
span能作为Text和RichEditor组件的子组件显示文本内容。
创建span

span组建需要写在text组件里面，无法单独使用，可以写多个子组件

Text('可以添加子组件'){Span('span组件无法单独使用，')}
Span('可以写多个子组件').fontSize(15)
decoration

decoration(value: DecorationStyleInterface)

设置文本装饰线及颜色

属性名类型必填说明
valueDecorationStyleInterface12+是文本装饰线样式对象。默认值：{type: TextDecorationType.None,color: Color.Black,style: TextDecorationStyle.SOLID}
Text('可以添加子组件'){Span('span组件无法单独使用，')Span('可以写多个子组件').fontSize(15).decoration({type:TextDecorationType.LineThrough,color:Color.Blue})//Overline上划线}.fontSize(20)

自定义文本样式

1.textCase

textCase(value: TextCase)

设置文本大小写。

属性名类型必填描述
valueTextCase是文本大小写。默认值：TextCase.Normal
Span('设置文字大小写abc')//只支持onClick()添加组件.textCase(TextCase.UpperCase)
2.letterSpacing

letterSpacing(value: number | string | Resource)

设置文本字符间距。设置该值为百分比时，按默认值显示。设置该值为0时，按默认值显示。

当取值为负值时，文字会发生压缩，负值过小时会将组件内容区大小压缩为0，导致无内容显示。

属性名类型必填说明
valuenumber | string | Resource是文本字符间距。
Span('字符间距').letterSpacing(10)
3.lineHeight

lineHeight(value: number | string | Resource)

设置文本的文本行高，设置值不大于0时，不限制文本行高，自适应字体大小。

属性名类型必填说明
valueResource | number | string是文本行高，为number类型时单位为fp。
Span('行高').lineHeight(40)
4.font

font(value: Font)

设置字母索引条默认字体样式。

属性名类型必填说明
valueFont是字母索引条默认字体样式。默认值：API version 11及以前：{size:‘12.0fp’,style:FontStyle.Normal,weight:FontWeight.Normal,family:‘HarmonyOS Sans’}API version 12及以后：{size:‘10.0vp’,style:FontStyle.Normal,weight:FontWeight.Medium,family:‘HarmonyOS Sans’}
Span('行高').lineHeight(40).font({size:20,family:'HarmonyOS Sans',style:FontStyle.Italic,weight:FontWeight.Bolder})//文字大小，文字粗细
5.textShadow

textShadow(value: ShadowOptions | Array)

设置文字阴影效果。该接口支持以数组形式入参，实现多重文字阴影。不支持fill字段, 不支持智能取色模式。

属性名类型必填描述
valueShadowOptions | Array<ShadowOptions>是文字阴影效果。
Span('文字阴影')//普通形式.textShadow({color:Color.Blue,offsetX:5,offsetY:5,radius:10})//radius模糊度
Span('文字阴影')//数组形式.textShadow([{color:Color.Blue,offsetX:5,offsetY:5,radius:4},{color:Color.Red,offsetX:10,offsetY:10,radius:7}])
6.textBackgroundStyle

textBackgroundStyle(style: TextBackgroundStyle)

设置文本背景样式。子组件在不设置该属性时，将继承此属性值。

属性名类型必填说明
styleTextBackgroundStyle是文本背景样式。默认值：{color: Color.Transparent,radius: 0}
Span('背景样式').textBackgroundStyle({color:'green',radius:0})
7.baselineOffset

baselineOffset(value: LengthMetrics)

设置ImageSpan基线的偏移量。此属性与父组件的baselineOffset是共存的

属性名类型必填描述
valueLengthMetrics是设置ImageSpan基线的偏移量，设置该值为百分比时，按默认值显示。正数内容向上偏移，负数向下偏移。默认值：0设置为非0时会导致设置verticalAlign失效。
Text(){Span('调整基线').baselineOffset(new LengthMetrics(-2,LengthUnit.VP))Span('普通文字')Span('调整基线').baselineOffset(new LengthMetrics(2,LengthUnit.VP))Span('普通文字')ImageSpan($r('app.media.app_icon')).height(30).baselineOffset(new LengthMetrics(0,LengthUnit.PX))
}
8.textAlign

textAlign(value: TextAlign)

设置文本在搜索框中的对齐方式。目前支持的对齐方式有：Start、Center、End。

属性名类型必填说明
valueTextAlign是文本在搜索框中的对齐方式。默认值：TextAlign.Start
Text('左对齐').width(300).backgroundColor('gray').textAlign(TextAlign.Center)//对齐方式
Text('右对齐').width(300).backgroundColor('gray').textAlign(TextAlign.End)//对齐方式
Text('对齐').width(300).backgroundColor('gray').textAlign(TextAlign.Center)//对齐方式
9.textOverflow

textOverflow(value: { overflow: TextOverflow })

设置文本超长时的显示方式。

属性名类型必填说明
value{overflow: TextOverflow}是文本超长时的显示方式。默认值：{overflow: TextOverflow.Clip}
Text('超出滚动啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊').width(300).backgroundColor('#ccc').textOverflow({overflow:TextOverflow.MARQUEE})//MARQUEE滚动
Text('超出隐藏啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊').width(300).backgroundColor('#ccc').textOverflow({overflow:TextOverflow.Ellipsis}).maxLines(2)//最大行数，（最多2行）
10.maxLines

maxLines(value: number)

设置文本的最大行数。默认情况下，文本是自动折行的，如果指定此属性，则文本最多不会超过指定的行。如果有多余的文本，可以通过textOverflow来指定截断方式。

属性名类型必填说明
valuenumber是文本的最大行数。
Text('最大啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊').width(300).backgroundColor('#ccc').minFontSize(10).maxFontSize(30).maxLines(2)
11.minFontSize

minFontSize(value: number | string | Resource)

设置文本最小显示字号。

属性名类型必填说明
valuenumber | string | Resource是文本最小显示字号。
12.maxFontSize

maxFontSize(value: number | string | Resource)

设置文本最大显示字号。

属性名类型必填说明
valuenumber | string | Resource是文本最大显示字号。
Text('最小啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊').width(300).backgroundColor('#ccc').minFontSize(10).maxFontSize(30).maxLines(1)
Text('最大啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊').width(300).backgroundColor('#ccc').minFontSize(10).maxFontSize(30).maxLines(2)
13.copyOption

copyOption(value: CopyOptions)

设置图片是否可复制。当copyOption设置为非CopyOptions.None时，支持使用长按、鼠标右击、快捷组合键’CTRL+C’等方式进行复制。svg图片不支持复制。

当组件的参数类型为AnimatedDrawableDescriptor时设置该属性不生效。

属性名类型必填说明
valueCopyOptions是图片是否可复制。默认值：CopyOptions.None
Text('是否可以粘贴').width(300).backgroundColor('#ddd').copyOption(CopyOptions.InApp)
14.draggable

draggable(value: boolean)

设置该组件是否允许进行拖拽。

属性名类型必填说明
valueboolean是设置该组件是否允许进行拖拽。默认值：false
Text('文本的拖拽').width(300).backgroundColor('#aaa').draggable(true)//拖拽和事件一起使用.onDragStart(()=>{console.log('开始拖动')})
15.textIndent

textIndent(value: Dimension)

设置首行文本缩进。

属性名类型必填说明
valueDimension是首行文本缩进。默认值：0
Text('首行缩进啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊').width(300).backgroundColor('#f0f').textIndent(10)
16.wordBreak

wordBreak(value: WordBreak)

设置断行规则。WordBreak.BREAK_ALL与{overflow: TextOverflow.Ellipsis}，maxLines组合使用可实现英文单词按字母截断，超出部分以省略号显示

属性名类型必填说明
valueWordBreak是断行规则。默认值：WordBreak.BREAK_WORD
Text('断行规则hello word hello word hello word hello word hello word hello word hello word hello word hello word hello word hello word hello word hello word hello word ').width(300).backgroundColor('#fcf').maxLines(2).wordBreak(WordBreak.BREAK_WORD).textOverflow({overflow:TextOverflow.Ellipsis})//超出隐藏
17.selection

selection(selectionStart: number, selectionEnd: number)

设置选中区域。选中区域高亮且显示手柄和文本选择菜单。

属性名类型必填说明
selectionStartnumber是所选文本的起始位置。默认值：-1
selectionEndnumber是所选文本的结束位置。默认值：-1
Text('设置选中hello word hello word hello word hello word hello word hello word hello word hello word hello word hello word hello word hello word hello word hello word ').width(300).backgroundColor('#faf').maxLines(2).copyOption(CopyOptions.InApp)//是否可以粘贴.selection(0,30)//选中30个
18.ellipsisMode

ellipsisMode(value: EllipsisMode)

设置省略位置。ellipsisMode属性需要配合overflow设置为TextOverflow.Ellipsis以及maxLines使用，单独设置ellipsisMode属性不生效。

属性名类型必填说明
valueEllipsisMode是省略位置。默认值：EllipsisMode.END
Text('设置省略位置hello word hello word hello word hello word hello word hello word hello word hello word hello word hello word hello word hello word hello word hello word ').width(300).backgroundColor('#fcf').maxLines(1).textOverflow({overflow:TextOverflow.Ellipsis}).ellipsisMode(EllipsisMode.START)//设置省略位置只有单行可用
19.textSelectable

textSelectable(value: TextSelectableMode)

设置是否支持文本可选择、可获焦以及Touch后能否获取焦点

属性名类型必填说明
valueTextSelectableMode是文本是否支持可选择、可获焦。默认值：TextSelectableMode.SELECTABLE_UNFOCUSABLE
Text('文字特性，Hello word Hello word Hello word Hello word Hello word Hello word Hello word Hello word ').fontSize(20).maxLines(2).width(300).lineSpacing(LengthMetrics.vp(5))//行间距.wordBreak(WordBreak.BREAK_WORD).copyOption(CopyOptions.InApp).textSelectable(TextSelectableMode.UNSELECTABLE)
20.enableDataDetecto

enableDataDetector(enable: boolean)

设置使能文本识别。

属性名类型必填说明
enableboolean是使能文本识别。默认值： false
21.dataDetectorConfig

dataDetectorConfig(config: TextDataDetectorConfig)

设置文本识别配置。需配合enableDataDetector一起使用，设置enableDataDetector为true时，dataDetectorConfig的配置才能生效。

属性名类型必填说明
configTextDataDetectorConfig是文本识别配置。默认值：{types: [ ],onDetectResultUpdate: null}
Text('电话号码：1234234'+this.tel+'\n'+'链接：www.baidu.com'+this.ur+'\n'+this.em+'\n'
).enableDataDetector(true)//识别.dataDetectorConfig({types:this.aa,onDetectResultUpdate:(a:string)=>{}})

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

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

相关文章

ElasticSearch学习篇18_《检索技术核心20讲》LevelDB设计思想

ElasticSearch学习篇18_《检索技术核心20讲》LevelDB设计思想

目录 一些常见的设计思想以及基于LSM树的LevelDB是如何利用这些设计思想优化存储、检索效率的。 几种常见的设计思想 索引和数据分离减少磁盘IO读写分离分层思想 LevelDB的设计思想 读写分离设计分层设计与延迟合并LRU缓存加速检索 几种常见设计思想 索引与数据分离 索引…
阅读更多...
LabVIEW Real-Time 的特点

LabVIEW Real-Time 的特点

LabVIEW Real-Time&#xff08;简称 LabVIEW RT&#xff09;是为实时系统设计的软件平台&#xff0c;结合 NI 硬件&#xff08;如 CompactRIO 和 PXI 系列&#xff09;&#xff0c;能够在高可靠性、高性能要求的场景中实现稳定的实时控制与数据处理。以下是它的主要用处和特点&…
阅读更多...
使用脚本实现hadoop-yarn-flink自动化部署

使用脚本实现hadoop-yarn-flink自动化部署

本文使用脚本实现hadoop-yarn-flink的快速部署&#xff08;单机部署&#xff09;。 环境&#xff1a;①操作系统&#xff1a;CentOS 7.6&#xff1b;②CPU&#xff1a;x86&#xff1b;③用户&#xff1a;root。 1.前置条件 把下面的的脚本保存到“pre-install.sh”文件&#x…
阅读更多...
【JUC-Interrupt】中断相关概念

【JUC-Interrupt】中断相关概念

线程中断 一、相关概念二、API2.1、isInterrupted方法2.2、interrupted方法2.3、interrupt 三、总结&#xff1a; 一、相关概念 一个线程不应该由其他线程中断或停止&#xff0c;应该有线程自己来决定。 在Java中没有办法立即停止一个线程&#xff0c;因此提供了用于停止线程…
阅读更多...
javascript基础学习

javascript基础学习

什么是伪代码 伪代码（Pseudocode）是一种介于自然语言和编程语言之间的算法描述方式。它使用类似自然语言的语句来描述程序的逻辑和流程，但又采用了编程语言中的一些结构和控制语句，如循环、条件判断等。 伪代码的目的是在不涉及具体编程语言语法细节的情况下，清晰地表达…
阅读更多...
Django+Nginx+uwsgi网站Channels+redis+daphne多人在线聊天实现粘贴上传图片

Django+Nginx+uwsgi网站Channels+redis+daphne多人在线聊天实现粘贴上传图片

在DjangoNginxuwsgi网站Channelsredisdaphne多人在线的基础上&#xff08;详见DjangoNginxuwsgi网站使用Channelsredisdaphne实现简单的多人在线聊天及消息存储功能-CSDN博客&#xff09;&#xff0c;实现在输入框粘贴或打开本地图片&#xff0c;上传到网站后返回图片路径&…
阅读更多...
C++ —— 以真我之名 如飞花般绚丽 - 智能指针

C++ —— 以真我之名 如飞花般绚丽 - 智能指针

目录 1. RAII和智能指针的设计思路 2. C标准库智能指针的使用 2.1 auto_ptr 2.2 unique_ptr 2.3 简单模拟实现auto_ptr和unique_ptr的核心功能 2.4 shared_ptr 2.4.1 make_shared 2.5 weak_ptr 2.6 shared_ptr的缺陷&#xff1a;循环引用问题 3. shared_ptr 和 unique_…
阅读更多...
vulnhub靶场之breakout

vulnhub靶场之breakout

empire靶场2 前言 靶机&#xff1a;breakout 攻击&#xff1a;kali 续接上个靶场empire1的继续学习 主机发现 使用arp-scan扫描或者直接查看虚拟机的ip地址 信息收集 使用nmap扫描 端口80apache 2.4.51开启smb服务的两个端口139、445&#xff0c;版本4.6.2两个http服务采…
阅读更多...
今天你学C++了吗？——C++中的类与对象（第二集）

今天你学C++了吗？——C++中的类与对象（第二集）

♥♥♥~~~~~~欢迎光临知星小度博客空间~~~~~~♥♥♥ ♥♥♥零星地变得优秀~也能拼凑出星河~♥♥♥ ♥♥♥我们一起努力成为更好的自己~♥♥♥ ♥♥♥如果这一篇博客对你有帮助~别忘了点赞分享哦~♥♥♥ ♥♥♥如果有什么问题可以评论区留言或者私信我哦~♥♥♥ ✨✨✨✨✨✨ 个…
阅读更多...
聚划算！一区算法！双分解+牛顿拉夫逊优化+深度学习！CEEMDAN-VMD-NRBO-Transformer多元时序预测

聚划算！一区算法！双分解+牛顿拉夫逊优化+深度学习！CEEMDAN-VMD-NRBO-Transformer多元时序预测

目录 效果一览基本介绍程序设计参考资料 效果一览 基本介绍 1.Matlab实现CEEMDAN-Kmeans-VMD-NRBO-Transformer融合K均值聚类的数据双重分解牛顿-拉夫逊优化算法Transformer多元时间序列预测&#xff08;完整源码和数据&#xff09;运行环境Matlab2023b及以上。 2.CEEMDAN分解…
阅读更多...
C++设计模式-中介者模式

C++设计模式-中介者模式

动机(Motivation) 多个对象相互关联的情况&#xff0c;对象之间常常会维持一种复杂的引用关系&#xff0c;如果遇到一些需求的更改&#xff0c;这种直接的引用关系将面临不断的变化。在这种情况下&#xff0c;可以使用一种”中介对象“来管理对象间的关联关系&#xff0c;避免…
阅读更多...
滑动窗口篇——如行云流水般的高效解法与智能之道（2）

滑动窗口篇——如行云流水般的高效解法与智能之道（2）

前言&#xff1a; 上篇我们介绍了滑动窗口的含义并结合基础题型加以练习&#xff0c;本篇将以进阶难度的题目为索引&#xff0c;深化对于滑动窗口的运用与理解。 一. 将x减到0的最小操作数 题目链接&#xff1a;1658. 将 x 减到 0 的最小操作数 - 力扣&#xff08;LeetCode&am…
阅读更多...
EG3D: Efficient Geometry-aware 3D Generative Adversarial Networks 学习笔记

EG3D: Efficient Geometry-aware 3D Generative Adversarial Networks 学习笔记

1 Contributions 混合显式-隐式网络架构&#xff1a;提出了一种 Tri-plane 的3D表征方法&#xff0c;结合显式体素网格与隐式解码器的优点 速度快&#xff0c;内存效率高&#xff1b; 支持高分辨率生成&#xff0c;保持3D表征的灵活性和表达能力。与纯显式或隐式方法相比&#…
阅读更多...
⭐ Unity 资源管理解决方案：Addressable_ Demo演示

⭐ Unity 资源管理解决方案：Addressable_ Demo演示

一、使用Addressable插件的好处&#xff1a; 1.自动管理依赖关系 2.方便资源卸载 3.自带整合好的资源管理界面 4.支持远程资源加载和热更新 二、使用步骤 安装组件 1.创建资源分组 2.将资源加入资源组 3.打包资源 4.加载资源 三种方式可以加载 using System.Collections…
阅读更多...
C++《二叉搜索树》

C++《二叉搜索树》

在初阶数据结构中我学习了树基础的概念以及了解了顺序结构的二叉树——堆和链式结构二叉树该如何实现&#xff0c;那么接下来我们将进一步的学习二叉树&#xff0c;在此会先后学习到二叉搜索树、AVL树、红黑树&#xff1b;通过这些的学习将让我们更易于理解后面set、map、哈希等…
阅读更多...
使用VisualStudio编写C++程序输出helloWorld

使用VisualStudio编写C++程序输出helloWorld

文章目录 1. C简介1.1 历史背景1.2 特点1.3 应用领域 2. 操作过程和代码2.1 打开Visual Studio(默认你下载了C的相关文件)2.2 创建新项目2.3 输入名字&#xff0c;创建2.4 右击源文件->添加->新建项2.5 命名好&#xff0c;进行添加2.6 输入代码2.7 输出结果 3. 总结 1. C…
阅读更多...
万能的无人机锁定目标投放程序

万能的无人机锁定目标投放程序

✨✨ 欢迎大家来访Srlua的博文&#xff08;づ&#xffe3;3&#xffe3;&#xff09;づ╭❤&#xff5e;✨✨ &#x1f31f;&#x1f31f; 欢迎各位亲爱的读者&#xff0c;感谢你们抽出宝贵的时间来阅读我的文章。 我是Srlua小谢&#xff0c;在这里我会分享我的知识和经验。&am…
阅读更多...
LayaBox1.8.4实现UV滚动

LayaBox1.8.4实现UV滚动

实现思路&#xff1a; 在片元着色器采样时&#xff0c;增加一个随时间变化的偏移值&#xff0c;由于uv是一个二维向量所以加的偏移值也需要一个二维向量。注意&#xff1a;在Laya的 shader中除了0&#xff0c;输入其它数字必须输入带有小数的数字&#xff0c;否则报错 。 &quo…
阅读更多...
Next.js- App Router 概览

Next.js- App Router 概览

#题引&#xff1a;我认为跟着官方文档学习不会走歪路 一&#xff1a;App Router与Page Router 在 v13 版本中&#xff0c;Next.js 引入了一个基于 React 服务器组件 构建的新的 App Router&#xff0c;而在这之前&#xff0c;Next.js 使用的是Page Router。 目录结构 pages …
阅读更多...
milvus es

milvus es

ES 与 Milvus 结合实现高效文档搜索的实战指南 原文链接 目录 背景介绍场景与效果概述架构对比与问题分析Milvus 向量搜索架构ES Milvus 搜索架构详细流程解析Milvus 搜索配置详解ES 搜索策略与 DSL 配置结果合并与排序策略总结与未来优化 1. 背景介绍 随着团队和公司的发…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023