flutter 实现文本贴图

关键代码

js 复制代码
var maxWordHeight = 0.0;

    for(var i = 0; i < line.length;i++){
      var char = line.substring(i,i+1);
      final textPainter = TextPainter(
        text: TextSpan(text: char, style: textStyle.apply(
            color: Colors.black
        )),
        textDirection: TextDirection.ltr,
      );
      textPainter.layout();
      textPainter.paint(canvas, Offset(offsetX,0));
      offsetX+= (textPainter.width + wordSpace);
      maxWordHeight = max(maxWordHeight, textPainter.height);
    }

    canvas.drawImageRect(
      labelItem.image!,
      Rect.fromLTWH(0, 0, labelItem.image!.width.toDouble(), labelItem.image!.height.toDouble()),
      Rect.fromLTWH(0, 0, labelItem.width, maxWordHeight),
      Paint()
      ..blendMode = BlendMode.plus,
    );

或者

js 复制代码
   canvas.saveLayer(Rect.fromLTWH(0, 0, labelItem.width, labelItem.height), Paint());
    for(var i = 0; i < line.length;i++){
      var char = line.substring(i,i+1);
      final textPainter = TextPainter(
        text: TextSpan(text: char, style: textStyle.apply(
            color: Colors.black
        )),
        textDirection: TextDirection.ltr,
      );
      textPainter.layout();
      textPainter.paint(canvas, Offset(offsetX,0));
      offsetX+= (textPainter.width + wordSpace);
      maxWordHeight = max(maxWordHeight, textPainter.height);
    }

    canvas.drawImageRect(
      labelItem.image!,
      Rect.fromLTWH(0, 0, labelItem.image!.width.toDouble(), labelItem.image!.height.toDouble()),
      Rect.fromLTWH(0, 0, labelItem.width, maxWordHeight),
      Paint()
      ..blendMode = BlendMode.srcIn,
    );
    canvas.restore();
相关推荐
大龄秃头程序员12 小时前
一次 Flutter 动画 Demo 的整理与复盘
flutter
AlexMaybeBot15 小时前
躺在沙发上开发 Openclaw 的移动端APP
前端·flutter
天空之城--16 小时前
Android Flutter行业动态与学习参考(2026年8月)
android·flutter
FungLeo16 小时前
Flutter Web token 存储陷阱:crypto.subtle 在非安全上下文失效排查实录
前端·安全·flutter
FungLeo17 小时前
Flutter Web 中文字体困境与渲染器选择:CanvasKit vs HTML renderer 实战
前端·flutter·html
杉氧18 小时前
原生交互:如何在 Flutter 中嵌入 Android/iOS 原生组件并解决手势冲突
android·flutter·dart
恋猫de小郭19 小时前
Flutter iOS Deep Link 为什么会突然失效:一系列难以言喻的问题
android·前端·flutter
FungLeo1 天前
Flutter fl_chart 0.70 破坏性 API 迁移实录:duration/getTooltipColor/withValues 全解
flutter·fl_chart
FungLeo2 天前
Flutter 吸顶分组列表实战:语义桶分组 + 点击头平滑滚动
android·flutter
FungLeo2 天前
Flutter 超长 StatefulWidget 拆分术:part of + extension on State 实战
android·flutter·dart