Flutter图像处理插件opencv_dart的使用

opencv_dart简介

opencv_dart是用于Flutter的OpenCV库，它包含了所有的OpenCV模块。如果你不需要videoio和highgui模块，可以考虑使用opencv_core。

注意事项

从版本v1.3.0开始，动态库将在本地构建，并在构建期间由Flutter调用。请注意：OpenCV SDK（约100M）将通过CMake的FetchContent下载，你可以设置DARTCV_CACHE_DIR环境变量来缓存它以避免重复下载。例如：export DARTCV_CACHE_DIR=$HOME/.cache/dartcv

• Q&A: #212 或者打开新问题。
• 如果你正在使用支持原生资源的Flutter特性，请考虑使用v2.x版本，详见native-assets分支，但此分支不会更新直到Native Assets稳定。

支持的平台

支持的模块

具体支持的模块列表请参阅这里

包大小

示例代码

下面是一个完整的示例demo，展示了如何使用opencv_dart进行图像处理：

// ignore_for_file: avoid_print

import 'package:flutter/material.dart';
import 'package:image_picker/image_picker.dart';
import 'package:opencv_dart/opencv.dart' as cv;

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

class MyApp extends StatefulWidget {
  const MyApp({super.key});

  @override
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  List<Uint8List> images = [];

  Future<(cv.Mat, cv.Mat)> heavyTaskAsync(cv.Mat im, {int count = 1000}) async {
    late cv.Mat gray, blur;
    for (var i = 0; i < count; i++) {
      gray = await cv.cvtColorAsync(im, cv.COLOR_BGR2GRAY);
      blur = await cv.gaussianBlurAsync(im, (7, 7), 2, sigmaY: 2);
      if (i != count - 1) {
        gray.dispose(); // 手动释放
        blur.dispose(); // 手动释放
      }
    }
    return (gray, blur);
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text('OpenCV Dart Example'),
        ),
        body: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              ElevatedButton(
                onPressed: () async {
                  final picker = ImagePicker();
                  final img = await picker.pickImage(source: ImageSource.gallery);
                  if (img != null) {
                    final path = img.path;
                    final mat = cv.imread(path);
                    print("cv.imread: width: ${mat.cols}, height: ${mat.rows}, path: $path");
                    debugPrint("mat.data.length: ${mat.data.length}");
                    // 重计算任务
                    final (gray, blur) = await heavyTaskAsync(mat, count: 1);
                    setState(() {
                      images = [
                        cv.imencode(".png", mat).$2,
                        cv.imencode(".png", gray).$2,
                        cv.imencode(".png", blur).$2,
                      ];
                    });
                  }
                },
                child: const Text("Pick Image"),
              ),
              ElevatedButton(
                onPressed: () async {
                  final data = await DefaultAssetBundle.of(context).load("images/lenna.png");
                  final bytes = data.buffer.asUint8List();
                  // 重计算任务
                  final (gray, blur) = await heavyTaskAsync(cv.imdecode(bytes, cv.IMREAD_COLOR));
                  setState(() {
                    images = [bytes, cv.imencode(".png", gray).$2, cv.imencode(".png", blur).$2];
                  });
                },
                child: const Text("Process"),
              ),
              Expanded(
                flex: 2,
                child: Row(
                  children: [
                    Expanded(
                      child: ListView.builder(
                        itemCount: images.length,
                        itemBuilder: (ctx, idx) => Card(
                          child: Image.memory(images[idx]),
                        ),
                      ),
                    ),
                    Expanded(
                      child: SingleChildScrollView(
                        child: Text(cv.getBuildInformation()),
                      ),
                    ),
                  ],
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

说明

• heavyTaskAsync：该函数执行了颜色转换和高斯模糊操作，并返回灰度图和模糊后的图像。
• Pick Image按钮：允许用户从图库中选择图片，并对其进行颜色转换和高斯模糊处理，最后显示原始图像、灰度图像和模糊图像。
• Process按钮：加载内置的lenna.png图像并对其进行相同的处理。

更多示例可以参考官方示例或awesome-opencv_dart。

许可证

opencv_dart遵循Apache-2.0 License。

希望这些信息对你有帮助！如果你有任何问题或需要进一步的帮助，请随时提问。