多行文本省略的展开与显示
场景:文本组件在超出n行省略,并后面点击箭头展开收起,如下图所示:
HarmonyOS
赞
收藏 0
回答 1
待解决
相关问题
HarmonyOS 多行文本中间省略不生效
237浏览 • 1回复 待解决
实现多行文本渐变,Text实现多行文本渐变
1117浏览 • 1回复 待解决
HarmonyOS 如何根据字符的数目,来设置文本省略
277浏览 • 1回复 待解决
HarmonyOS 计算多行文本布局宽高
418浏览 • 1回复 待解决
HarmonyOS 多行文本末尾带标签时的缩进
188浏览 • 1回复 待解决
HarmonyOS Text多行文本不能居中对齐
1403浏览 • 1回复 待解决
HarmonyOS 带滚动条的多行文本显示用什么UI组件?Text、TextArea?
236浏览 • 1回复 待解决
文本只显示三行,超过部分在文字后显示省略号和展开按键,点击按钮进行展开,HarmonyOS该如何实现
826浏览 • 1回复 待解决
#鸿蒙通关秘籍#如何创建单行和多行文本输入框?
561浏览 • 1回复 待解决
HarmonyOS通知的多行文本样式中的通知概要内容字段有什么用
206浏览 • 1回复 待解决
下文本到边界尾部显示展开全部这种效果怎么实现?然后点击展开文本
609浏览 • 0回复 待解决
HarmonyOS 通知中多行文本的大小限制是每行200字节,还是多行全部限制为200字节
480浏览 • 1回复 待解决
#鸿蒙通关秘籍#如何在鸿蒙中创建单行和多行文本输入框?
335浏览 • 1回复 待解决
HarmonyOS text组件设置文本溢出显示省略号效果
439浏览 • 1回复 待解决
多行文字后面添加标签
493浏览 • 1回复 待解决
span展开/收起,如何实现文本的展开收起的功能
1063浏览 • 1回复 待解决
ArkTS实现Text文本的【...展开】
2180浏览 • 3回复 待解决
HarmonyOS 图片标签穿插于多行文字中如何实现?
609浏览 • 1回复 待解决
#鸿蒙通关秘籍#如何在ArkUI中实现文本溢出显示省略号
620浏览 • 1回复 待解决
Text的文字超长是省略号展示模式 是否支持中间省略与头部省略模式?
1973浏览 • 1回复 待解决
如何实现文本展开收起功能
1081浏览 • 1回复 待解决
ArkTS的Text组件超长省略号展示模式不支持中间省略与头部省略模式
574浏览 • 1回复 待解决
Text组件是否支持多行显示
2278浏览 • 1回复 待解决
如何计算文本是否溢出省略
1935浏览 • 1回复 待解决
使用的核心API
组件区域变化事件
RichText
核心代码解释
实现该功能目前平台的Text组件不支持功能,所以我们自己想办法来实现,我这里总结了两种平替解决方案,都有瑕疵,希望后续HarmonyOS能支持该功能。
解决方案一:配合定位实现
思路:获取组件的Area区域,配合定位给按钮设置Position位置来实现。
核心代码如下
效果如下所示:
但是这种方案有一个小瑕疵,按钮会挡住后面的省略号,要么就是加大右侧空间让省略号展示,但是这样很不美观,这个目前没有办法解决
还有一种同思路的解决方案是将文字进行裁剪,但是需要计算文字宽度对应到多少字的时候省略,这样逻辑会比较复杂,而且针对移动端多设备切换不好兼容。【暂不考虑】
解决方案二:使用RichText富文本实现
RichText可以展示HTML的内容,而HTML可以使用强大的CSS来实现该功能。
核心代码如下:
效果如下所示:
如上图,使用RichText可以实现该效果,不遮挡省略号,也能支持展开收起添加动画等等,但是该方法有一个弊端是——无法动态渲染数据,只能用于静态展示数据,业务RichText中渲染的是HTML字符串,无法做到数据更新页面刷新,也无法监听事件。
注明适配的版本信息
IDE:DevEco Studio 4.0.3.600
SDK:HarmoneyOS 4.0.10.11