使用image.dart包处理图片：Uint8List转PNG获null及绘图求助

问题根源 #

你直接使用PngDecoder解码，但从URL下载的图片不一定是PNG格式（比如可能是JPG、WebP等），导致解码器无法识别格式，最终返回null。

修复步骤 #

1. 替换指定格式解码器为通用的img_package.decodeImage函数，它会自动识别图片格式并完成解码。
2. 解码成功后执行矩形绘制操作，最后将处理后的图片编码回Uint8List返回。

完整代码示例 #

import 'package:image/image.dart' as img_package;
import 'package:http/http.dart' as http;

Future<Uint8List> getPictureWithFrame() async {
  // 步骤1：从URL下载图片
  http.Response response = await http.get(Uri.parse(EXAMPLE_URL));
  Uint8List imageBytes = response.bodyBytes;

  // 步骤2：通用格式解码（自动适配JPG/PNG/WebP等）
  img_package.Image? image = img_package.decodeImage(imageBytes);
  if (image == null) {
    throw Exception("图片解码失败");
  }

  // 步骤3：根据目标坐标绘制矩形（示例参数可替换为你的识别结果）
  int targetX = 50;
  int targetY = 50;
  int targetWidth = 200;
  int targetHeight = 150;
  img_package.drawRect(
    image,
    x1: targetX,
    y1: targetY,
    x2: targetX + targetWidth,
    y2: targetY + targetHeight,
    color: img_package.ColorInts.red,
    thickness: 3,
  );

  // 步骤4：编码为PNG格式的Uint8List并返回
  return img_package.encodePng(image);
}

关键说明 #

• decodeImage支持主流图片格式的自动识别，无需手动指定解码器，彻底解决格式不匹配导致的null问题。
• 绘制矩形时，需确保targetX + targetWidth和targetY + targetHeight不超过图片的实际宽高，避免绘制异常。
• 如果需要输出JPG格式，可将encodePng替换为encodeJpg，还能通过quality参数调整输出质量（如encodeJpg(image, quality: 90)）。

内容的提问来源于stack exchange，提问作者mzkaoq