Flutter 開発の実践 - TextPainter はテキスト コンテンツの幅を計算します

Flutter 開発の実践 - TextPainter はテキスト コンテンツの幅を計算します

最近の開発ではTextの文字の大きさに応じてマーキー効果を表示する必要があるかどうかを判断しており、文字のサイズを取得するにはTextPainterでSizeを取得する必要があります。

1. テキストペインタ

TextPainter は主にテキストの描画を実現するために使用されます。TextPainter クラスは、TextSpan をキャンバスにレンダリングできます。
TextPainter は、TextSpan ツリーを Canvas キャンバスに描画できます。
使用手順

• 1 [TextSpan]ツリーを作成し、[TextPainter]に渡す
• 2 [layout] を呼び出して段落を準備します
• 3 段落を描画するために必要なだけペイントを呼び出します。
• 4 オブジェクトにアクセスできなくなったら [display] を呼び出して Dispose を解除します

2、TextPainter はテキストの幅を計算します

私が使用している TextSpan では、Text と style を指定し、TextPainter の size でサイズを取得し、テキスト コンテンツの幅を取得します。

Size calculateTextSize(String text, TextStyle style) {
    
    
    final TextPainter textPainter = TextPainter(
        text: TextSpan(text: text, style: style),
        maxLines: 1,
        textDirection: TextDirection.ltr)
      ..layout(minWidth: 0, maxWidth: double.infinity);
    return textPainter.size;
  }

3. まとめ

Flutter 開発実践 - TextPainter はテキスト コンテンツの幅を計算します。TextPainter クラスは、TextSpan をキャンバスにレンダリングし、TextPainter に従ってテキスト コンテンツの幅を取得できます。
学習記録、日々改善を続けてください。