HarmonyOS Canvas绘制文本后，使用scale属性缩放后内容模糊

画布的尺寸放大了内容没有重新绘制，被放大后显示模糊是正常的现象，可以使用canvas的scale，设置canvas画布的缩放变换属性，参考文档：https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/ts-canvasrenderingcontext2d-V5

示例参考如下：

import { MeasureOptions, MeasureText } from '@kit.ArkUI';

@Component
export struct TextCanvas {
  @Prop fontSize: number = 0
  @Prop message: string = ""
  @State textWidth: number = 0
  @State textHeight: number = 0
  @Prop canvasScale: number = 1
  private ctx2D: CanvasRenderingContext2D = new CanvasRenderingContext2D(new RenderingContextSettings(true))

  aboutToAppear(): void {
    this.onMeasureText()
  }

  build() {
    Canvas(this.ctx2D)
      .width(this.textWidth * this.canvasScale)
      .height(this.textHeight * this.canvasScale)
      .onReady(() => {
        this.ctx2D.clearRect(0, 0, this.textWidth, this.textHeight)
        this.ctx2D.scale(this.canvasScale, this.canvasScale)
        this.onDrawText()
      })
    // .scale({ x: this.canvasScale, y: this.canvasScale })
  }

  onDrawText() {
    this.ctx2D.fillStyle = '#000000'
    this.ctx2D.font = this.getTextFontStyle()
    this.ctx2D.fillText(this.message, 0, this.textHeight)
  }

  onMeasureText() {
    let size: SizeOptions = MeasureText.measureTextSize(this.getMeasureOptions())
    this.textWidth = px2vp(size.width as number)
    this.textHeight = px2vp(size.height as number)
  }

  getMeasureOptions(): MeasureOptions {
    return {
      fontSize: this.fontSize + "px",
      textContent: this.message
    }
  }

  getTextFontStyle() {
    //font-style font-weight font-size font-family
    let fontStyleStr = 'normal'
    let fontWeightStr = 'normal'
    let fontSizeStr = this.fontSize + 'px'
    return fontStyleStr + ' ' + fontWeightStr + ' ' + fontSizeStr + ' ' + "HarmonyOS Sans"
  }
}
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.
53.
54.