鸿蒙Next字体大小随布局自适应

当我们在一个固定大小的区域内展示文字，如果文字太长，可能会超出展会区域，显示不全，因此我们希望文字内容可以根据区域大小自适应放大缩小。
演示：

演示.gif

总结：
1.设置maxFontSize和minFontSize限制文本的最大和最小字号，此时文本会在这个范围内自适应布局缩放字体，并且fontSize属性不起作用。
2.如果希望限制文本行数，可以设置maxLines
3.如果minFontSize设置的不够小，内容过长，还是会出现内容显示不全的情况，因此为了文本全部显示，可以把minFontSize设置的尽量小一些
演示代码：

@Entry
@ComponentV2
struct ColRowSplitText {
  @Local maxTextSize:number=30
  @Local minTextSize:number=5
  @Local maxlines:number=1
  @Local textWidth:number=1
  @Local textHeight:number=1
  build() {
    Column(){
      ColumnSplit() {
        Row().width('100%').height(30).backgroundColor(Color.Gray)
        Row(){
          RowSplit(){
            Row().width('10%').height('100%').backgroundColor(Color.Gray)
            Row(){
              Text('HarmonyOS开发笔记')
                .maxFontSize(this.maxTextSize)
                .minFontSize(this.minTextSize)
                .maxLines(this.maxlines)
                .backgroundColor(Color.Yellow)
                .textAlign(TextAlign.Center)
                .onAreaChange((oldValue: SizeOptions, newValue: SizeOptions)=>{
                   this.textWidth=newValue.width as number
                   this.textHeight=newValue.height as  number
                })
            }.width('80%').height('100%')
            Row().width('10%').height('100%').backgroundColor(Color.Gray)
          }
          .width('100%').height('100%')
          .borderWidth(1)
          .resizeable(true)
        }.width('100%').height(140)
        Row().width('100%').height(30).backgroundColor(Color.Gray)
      }
      .resizeable(true)
      .width('100%').height(200)
      Text('最大字体').fontSize(this.maxTextSize)
      Text('最小字体').fontSize(this.minTextSize)
      Row(){
        Text('最大行数:'+this.maxlines)
        Slider({
          value: this.maxlines,
          min: 1,
          max: 13,
          style: SliderStyle.OutSet
        }).width('50%')
          .onChange((value: number) => {
            this.maxlines = value;
          })
      }
      Row(){
        Text('最大字体:'+this.maxTextSize)
        Slider({
          value: this.maxTextSize,
          min: this.minTextSize,
          max: 30,
          style: SliderStyle.OutSet
        }).width('50%')
          .onChange((value: number) => {
            this.maxTextSize = value;
          })
      }
      Row(){
        Text('最小字体:'+this.minTextSize)
        Slider({
          value: this.minTextSize,
          min: 5,
          max: this.maxTextSize,
          style: SliderStyle.OutSet
        }).width('50%')
          .onChange((value: number) => {
            this.minTextSize = value;
          })
      }
      Text('Text文本宽:'+this.textWidth.toFixed(0)+'  高:'+this.textHeight.toFixed(0))
    }
  }
}

如果你想具体了解哪些组件，或者实现某些场景有问题可以留言或私信