Flutter图片水印插件stamp_image的使用

Flutter图片水印插件stamp_image的使用

stamp_image 是一个用于在图片上添加水印的Flutter库。你可以使用任何小部件来自定义水印的位置，并且可以在一张图片上设置多个水印。

示例用例

1. 为从相机或图库获取的图片设置地址名称
2. 为产品图片设置公司标志
3. 为图片设置温度信息

完整示例Demo

以下是一个完整的示例代码，展示了如何使用 stamp_image 插件来为图片添加水印：

import 'dart:io';
import 'dart:ui';

import 'package:flutter/material.dart';
import 'package:image_picker/image_picker.dart';
import 'package:stamp_image/stamp_image.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Stamp Image',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: HomeScreen(),
    );
  }
}

class HomeScreen extends StatefulWidget {
  @override
  _HomeScreenState createState() => _HomeScreenState();
}

class _HomeScreenState extends State<HomeScreen> {
  final picker = ImagePicker();
  File? image;

  void takePicture() async {
    // 从图库中选择图片
    final pickedFile = await picker.getImage(source: ImageSource.gallery);
    if (pickedFile != null) {
      await resetImage();

      // 创建水印图片
      StampImage.create(
        context: context,
        image: File(pickedFile.path),
        children: [
          Positioned(
            bottom: 0,
            right: 0,
            child: _watermarkItem(),
          ),
          Positioned(
            top: 0,
            left: 0,
            child: _logoFlutter(),
          )
        ],
        onSuccess: (file) => resultStamp(file),
      );
    }
  }

  /// 重置图片文件
  Future resetImage() async {
    setState(() {
      image = null;
    });
  }

  /// 处理水印图片生成完成后的回调
  void resultStamp(File? file) {
    print(file?.path);
    setState(() {
      image = file;
    });
  }

  /// 创建时间戳水印
  Widget _watermarkItem() {
    return Padding(
      padding: const EdgeInsets.all(10),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.end,
        children: [
          Text(
            DateTime.now().toString(),
            style: TextStyle(color: Colors.white, fontSize: 15),
          ),
          SizedBox(height: 5),
          Text(
            "Made By Stamp Image",
            maxLines: 2,
            overflow: TextOverflow.ellipsis,
            style: TextStyle(
              color: Colors.blue,
              fontWeight: FontWeight.bold,
              fontSize: 15,
            ),
          ),
        ],
      ),
    );
  }

  /// 创建Flutter标志水印
  Widget _logoFlutter() {
    return Container(
      margin: EdgeInsets.all(10),
      decoration: BoxDecoration(shape: BoxShape.circle, color: Colors.white),
      child: Padding(
        padding: const EdgeInsets.all(8),
        child: FlutterLogo(),
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Stamp Imager"),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            _imageWidget(),
            SizedBox(height: 10),
            _buttonTakePicture()
          ],
        ),
      ),
    );
  }

  /// 创建“选择图片”按钮
  Widget _buttonTakePicture() {
    return Container(
      margin: EdgeInsets.symmetric(horizontal: 20),
      width: MediaQuery.of(context).size.width,
      child: ElevatedButton(
        onPressed: () => takePicture(),
        style: ElevatedButton.styleFrom(
          primary: Colors.blue,
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.circular(5),
          ),
        ),
        child: Text(
          "选择图片",
          style: TextStyle(color: Colors.white, fontSize: 20),
        ),
      ),
    );
  }

  /// 显示图片
  Widget _imageWidget() {
    return Container(
      width: MediaQuery.of(context).size.width / 1.1,
      child: image != null ? Image.file(image!) : SizedBox(),
    );
  }
}

保存到指定位置

如果你希望将生成的带有水印的图片自动保存到特定位置，可以使用 path_provider 插件来获取保存路径。以下是修改后的代码示例：

import 'dart:io';
import 'dart:ui';

import 'package:flutter/material.dart';
import 'package:image_picker/image_picker.dart';
import 'package:path_provider/path_provider.dart';
import 'package:stamp_image/stamp_image.dart';

void generate() async {
  Directory? directory = await getDownloadsDirectory(); // 获取下载目录
  StampImage.create(
    context: context, 
    image: imageFile,
    savePath: directory?.path, // 设置保存路径
    saveFile: true, // 启用保存功能
    children: [
      Positioned(
        bottom: 0,
        right: 0,
        child: _watermarkItem(),
      ),
    ],
    onSuccess: (file) => resultStamp(file),
  );
}