Flutter实现水印打卡照片

公司要求拍照以后返回加一层水印在照片上,网上找了几个组件本来都实现了结果发现只有英文不给写中文气得要死

整体来说就是这个方法,思路就是把照片当做画布然后再画一个水印出来设置透明背景把两张图拼在一起 copyImageToDocumentDirectory方法是为了解决ios图片地址的问题 有兴趣的小伙伴可以参考一下

复制代码
  Future<String> createAndSaveImageWithMerge(String imagePath) async {
    final image = await loadImage(imagePath);
    final imageWidth = image.width;
    final imageHeight = image.height;

    final recorder = ui.PictureRecorder();
    final canvas = Canvas(
        recorder,
        Rect.fromPoints(Offset(0, 0),
            Offset(imageWidth.toDouble(), imageHeight.toDouble())));

    final paint = Paint();
    canvas.drawImage(image, Offset.zero, paint);

    final textSpan = TextSpan(
      text:
          '${widget.watermarkModel?.siteName ?? "--"}\n${widget.watermarkModel?.watermarkTime}\n${widget.watermarkModel?.addressName}\n',
      style: const TextStyle(color: Colors.white, fontSize: 50),
    );
    final textPainter = TextPainter(
      text: textSpan,
      textAlign: TextAlign.left,
      textDirection: TextDirection.ltr,
    );
    textPainter.layout(minWidth: 0, maxWidth: imageWidth.toDouble());
    final offset = Offset(10, imageHeight.toDouble() - textPainter.height - 10);
    textPainter.paint(canvas, offset);
    LoadingUtil.hideLoading();
    final picture = recorder.endRecording();
    final img = await picture.toImage(imageWidth, imageHeight);
    final byteData = await img.toByteData(format: ui.ImageByteFormat.png);
    final pngBytes = byteData!.buffer.asUint8List();

    final mergedImage = imgs.decodeImage(pngBytes)!;
    final jpgBytes = imgs.encodeJpg(mergedImage);
    final path = imagePath;
    final file = File(path);
    LoadingUtil.showLoading("加载中",EasyLoadingIndicatorType.fadingCircle);

    await file.writeAsBytes(jpgBytes);

    // 使用 copyImageToDocumentDirectory 方法将图片保存到本地并获取新路径
    List<String> newPaths = await copyImageToDocumentDirectory([path]);
    return newPaths.first; // 返回保存后的新路径
  }

  Future<List<String>> copyImageToDocumentDirectory(
      List<String> oldPathList) async {
    if (Platform.isAndroid) return oldPathList;
    List<String> newListPath = [];
    await Future.forEach<String>(oldPathList, (oldPath) async {
      final oldImageFile = File(oldPath);
      String imageName = oldPath.substring(oldPath.indexOf('tmp') + 3);
      String basicPath = await ImageUtil.pictureInputBasicPath();
      String newPath = basicPath + imageName;
      final newDirectory = Directory(basicPath);
      newDirectory.createSync(recursive: true);
      await oldImageFile.copy(newPath);
      newListPath.add(imageName);
    });

    return newListPath;
  }
相关推荐
一只大侠的侠2 小时前
React Native开源鸿蒙跨平台训练营 Day16自定义 useForm 高性能验证
flutter·开源·harmonyos
子春一2 小时前
Flutter for OpenHarmony:绿氧 - 基于Flutter的呼吸训练应用开发实践与身心交互设计
flutter·交互
ujainu2 小时前
告别杂乱!Flutter + OpenHarmony 鸿蒙记事本的标签与分类管理(三)
android·flutter·openharmony
ZH15455891313 小时前
Flutter for OpenHarmony Python学习助手实战:API接口开发的实现
python·学习·flutter
一只大侠的侠4 小时前
Flutter开源鸿蒙跨平台训练营 Day11从零开发商品详情页面
flutter·开源·harmonyos
一只大侠的侠4 小时前
React Native开源鸿蒙跨平台训练营 Day18自定义useForm表单管理实战实现
flutter·开源·harmonyos
一只大侠的侠4 小时前
React Native开源鸿蒙跨平台训练营 Day20自定义 useValidator 实现高性能表单验证
flutter·开源·harmonyos
renke33644 小时前
Flutter for OpenHarmony:节奏方块 - 基于时间同步与连击机制的实时音乐游戏系统设计
flutter·游戏
晚霞的不甘5 小时前
Flutter for OpenHarmony 可视化教学:A* 寻路算法的交互式演示
人工智能·算法·flutter·架构·开源·音视频
千逐685 小时前
《Flutter for OpenHarmony:星轨天气的粒子化气象宇宙可视化系统》
flutter