HarmonyOS 鸿蒙Next 有没有办法能计算Text文本的行数
HarmonyOS 鸿蒙Next 有没有办法能计算Text文本的行数
import measure from '@ohos.measure'
[@Entry](/user/Entry)
[@Component](/user/Component)
struct MeasurePage {
[@State](/user/State) rawTitle: string = "1月16日,国务院新闻办公室举行新闻发布会,介绍2024年春运形势及工作安排。从2月9日(除夕)00:00到2月17日(正月初八)24:00,免费9天。1月16日,国务院新闻办公室举行新闻发布会,介绍2024年春运形势及工作安排"
// [@State](/user/State) rawTitle: string = "1月16日,国务院新闻办公室举行新闻发布会"
[@State](/user/State) title: string = this.rawTitle //
[@State](/user/State) suffixStr: string = ""
expanded: Boolean = true
titleWidth: number = 350
needProcess: boolean = true
ellipsis: string = "..."
EXPAND_STR: string = "展开"
COLLAPSE_STR: string = "收起"
MAX_LINES: number =2;
fontSize:number = 16
aboutToAppear(): void {
this.process();
}
process(): void {
if (this.expanded) {
this.collapseText();
} else {
this.expandText();
}
}
expandText(): void {
console.log('testTag: ’ + this.needProcess);
if (this.needProcess) {
this.suffixStr = this.COLLAPSE_STR; //收起
this.expanded = true;
this.title = this.rawTitle;
}
}
collapseText(): void {
if (!this.needProcess) {
return;
}
let titleSize : SizeOptions = measure.measureTextSize({
textContent: this.rawTitle,
constraintWidth: this.titleWidth,
fontSize: this.fontSize
})
let twoLineSize : SizeOptions = measure.measureTextSize({
textContent: this.rawTitle,
constraintWidth: this.titleWidth,
fontSize: this.fontSize,
maxLines: this.MAX_LINES
})
//文本未超过限制行数,不进行展开、收起处理
if ((titleSize.height as number) == (twoLineSize.height as number)) {
this.needProcess = false;
return;
}
console.log(‘test row height:’ + titleSize.height)
console.log(‘test twoLineSize height:’ + twoLineSize.height)
let clipTitle: string = this.rawTitle
this.suffixStr = this.EXPAND_STR;
while ((titleSize.height as number) > (twoLineSize.height as number)) {
this.expanded = true;
// 可以修改其他计算算法提高性能
clipTitle = clipTitle.substring(0, clipTitle.length - 1);
titleSize = measure.measureTextSize({
// textContent: clipTitle + this.ellipsis + this.suffixStr,
textContent: clipTitle + this.ellipsis ,
constraintWidth: this.titleWidth,
fontSize: this.fontSize
})
console.log(“test while clipTitle:” + clipTitle)
console.log(“test while clipTitle height:” + titleSize.height)
}
console.log(“test clipTitle:” + clipTitle)
this.title = clipTitle + this.ellipsis
this.expanded = false;
}
build() {
Row() {
Column() {
Text(){
Span(this.title)
}
.fontSize(this.fontSize)
.id(“title”)
.width(this.titleWidth)
<span class="hljs-keyword">if</span> (<span class="hljs-keyword">this</span>.needProcess) {
Text(<span class="hljs-keyword">this</span>.suffixStr)
.fontColor(Color.Orange)
.onClick((event) => {
<span class="hljs-keyword">this</span>.process();
})
}
}
.width(<span class="hljs-string">'100%'</span>)
.alignItems(HorizontalAlign.Start)
}
.height(<span class="hljs-string">'100%'</span>)
}
}
<button style="position: absolute; padding: 4px 8px 0px; cursor: pointer; top: 8px; right: 8px; font-size: 14px;">复制</button>
HarmonyOS 鸿蒙Next可以计算Text文本的行数。具体方法如下:
在HarmonyOS鸿蒙Next系统中,可以通过以下两种主要方式计算Text组件中文本的行数:
- 利用@ohos.measure API:该API可以返回多行文字的宽高信息,虽然没有直接返回行数,但可以根据业务场景通过计算得到。具体方法是,先不限定行数测量文本高度,再限定一个最大行数(如3行)测量高度,通过比较两个高度值可以判断文本是否超过了限定的行数。
- 利用Text组件的Layout信息:Text组件在渲染完成后会生成Layout对象,该对象包含了文本的布局信息,包括行数。通过调用Text组件的getLayout()方法获取Layout对象,然后调用getLineCount()方法可以直接获取行数。
需要注意的是,Text组件的行数可能会受到布局宽度、高度、字体大小、行距等因素的影响。因此,在获取行数时,应确保Text组件的布局和字体设置已经确定。
如果问题依旧没法解决请联系官网客服,官网地址是:https://www.itying.com/category-93-b0.html