中国优质的IT技术网站
专业IT技术创作平台
IT职业在线教育平台
如何判断文本组件text是否超出maxLines设置的高度
微信扫码分享
import { MeasureText } from '@kit.ArkUI' @Entry @Component struct TextInputExample { @State text: string = ''; @State truncatedHint: string = "文本未截断"; controller: TextInputController = new TextInputController(); build() { Column() { TextInput({ text: this.text, placeholder: 'input your word...', controller: this.controller }) .placeholderColor(Color.Grey) .placeholderFont({ size: 14, weight: 400 }) .caretColor(Color.Blue) .width(400) .height(40) .margin(20) .fontSize(14) .fontColor(Color.Black) .onChange((value: string) => { this.text = value; let textSizeShow1: SizeOptions = MeasureText.measureTextSize({ textContent: this.text, constraintWidth: 100, fontSize: 14, overflow: TextOverflow.Ellipsis, maxLines: 2 }) let textSizeShow2: SizeOptions = MeasureText.measureTextSize({ textContent: this.text + " ", constraintWidth: 100, fontSize: 14, overflow: TextOverflow.Ellipsis, maxLines: 2000000 }) console.log("textSizeShow1.height=" + textSizeShow1.height); console.log("textSizeShow2.height=" + textSizeShow2.height); if (textSizeShow2 && textSizeShow1 && textSizeShow2?.height && textSizeShow1?.height && (textSizeShow2?.height > textSizeShow1?.height)) { console.log("文本截断"); this.truncatedHint = "文本截断"; } else { console.log("文本未截断"); this.truncatedHint = "文本未截断"; } }) Text(this.text) .maxLines(2) .width(100) .textOverflow({ overflow: TextOverflow.Ellipsis }) .border({ width: 1 }) .minFontSize(14) .maxFontSize(24) Text(this.truncatedHint) }.width('100%') } }