HarmonyOS Text怎么根据行数调整字体大小?

HarmonyOS
21h前
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
aquaa

可以通过onAreaChange计算Text组件当前文本的行数

@Entry
@Component
struct Page49 {
  // 预设的默认行高,初始未定义
  private INITIAL_LINE_HEIGHT: number = -1;
  // 状态管理:存储用户输入的文本内容
  @State private textContent: string = '';
  // 状态管理:根据计算显示的行数
  @State private displayedLines: number = 0;

  build() {
    Column() {
      // 按钮以添加字符到文本
      Button('添加文字').onClick(() => {
        this.textContent += '哈'; // 添加一个汉字“哈”至文本内容
      })

      // 按钮以删除最后一个字符
      Button('删除文字').onClick(() => {
        if (this.textContent.length > 0) { // 确保文本非空才执行删除
          this.textContent = this.textContent.slice(0, -1); // 删除最后一个字符
        }
      })

      // 显示当前文本行数的提示信息
      Text(`当前行数: ${this.displayedLines}`)

      // 可变高度的文本显示区域,响应式更新行数
      Text(this.textContent)
        .width('50%')// 设置文本宽度为50%
        .onAreaChange((previousArea: Area, currentArea: Area) => {
          // 初始化行高,仅在首次获取到有效高度时设置
          if (this.INITIAL_LINE_HEIGHT == -1 && this.INITIAL_LINE_HEIGHT === this.INITIAL_LINE_HEIGHT && currentArea.height > 0) {
            this.INITIAL_LINE_HEIGHT = currentArea.height as number;
          }

          // 计算并更新显示的行数
          console.log('Previous Height:', previousArea.height);
          console.log('Current Height:', currentArea.height);
          console.log('this.INITIAL_LINE_HEIGHT:', this.INITIAL_LINE_HEIGHT);
          this.displayedLines = Math.ceil(currentArea.height as number / this.INITIAL_LINE_HEIGHT);
        })
    }
    .width('100%')
  }
}

目前有这个类似的方法,麻烦看一下是否满足

设置文本自适应高度的方式。

默认值:TextHeightAdaptivePolicy.MAX_LINES_FIRST。

说明:

当设置为TextHeightAdaptivePolicy.MAX_LINES_FIRST时,优先使用maxLines属性来调整文本高度。如果使用maxLines属性的布局大小超过了布局约束,则尝试在minFontSize和maxFontSize的范围内缩小字体以显示更多文本。

https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/ts-basic-components-text-V5

参考此文档的示例3

分享
微博
QQ
微信
回复
19h前
相关问题
HarmonyOS web_webview怎么调整字体
117浏览 • 1回复 待解决
应用内字体大小设置调整
399浏览 • 1回复 待解决
HarmonyOS 应用内调整全局字体大小
171浏览 • 1回复 待解决
HarmonyOS 怎么获取系统字体大小
717浏览 • 1回复 待解决
HarmonyOS 应用内字体大小怎么设置?
176浏览 • 1回复 待解决
HarmonyOS webview字体大小设置
174浏览 • 1回复 待解决
HarmonyOS 字体大小如何设置?
852浏览 • 1回复 待解决
HarmonyOS RichText无法指定字体大小
147浏览 • 1回复 待解决
HarmonyOS 字体大小适配方案
1131浏览 • 1回复 待解决
鸿蒙IndexBar如何设置字体大小
6990浏览 • 1回复 待解决
HarmonyOS RichText组件无法设置字体大小
132浏览 • 1回复 待解决
HarmonyOS 应用内字体大小调节
731浏览 • 1回复 待解决
全局设置字体大小方案咨询
534浏览 • 1回复 待解决
HarmonyOS List中字体大小的全局修改
139浏览 • 1回复 待解决