HarmonyOS 有没有适老化的最佳实践或demo？

Question

如题：HarmonyOS 有没有适老化的最佳实践或demo？

Answer 1

问题场景

有没有适老化的最佳实践或demo，在系统设置中调大字体后，应用内的布局将非常丑陋。希望有一个最大和最小的字号，无论用户怎么调整，字号只会在这两个值范围内变化。maxFontSize和minFontSize配合maxLine并不起作用。

// xxx.ets
import measure from '@ohos.measure'

@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 = measure.measureTextSize({
            textContent: this.text,
            constraintWidth: 100,
            fontSize: 14,
            overflow: TextOverflow.Ellipsis,
            maxLines: 2
          })
          let textSizeShow2 : SizeOptions = measure.measureTextSize({
            textContent: this.text + " ",
            constraintWidth: 100,
            fontSize: 14,
            overflow: TextOverflow.Ellipsis,
            maxLines: 2000000
          })
          console.log("tag textSizeShow1.height="+ textSizeShow1.height);
          console.log("tagtextSizeShow2.height="+ textSizeShow2.height);

          if (textSizeShow2 && textSizeShow1 && textSizeShow2?.height && textSizeShow1?.height && (textSizeShow2?.height > textSizeShow1?.height)) {
            console.log("tag 文本截断")
            this.truncatedHint =  "文本截断"
          } else {
            console.log("tag文本未截断")
            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%')
  }
}