如何比较两种图像，突出新图像在颤振中的差异？

Question

我是个爱动的开发人员。我的需要是比较两个图像和突出区别(两个图像)在一个新的形象颤音？

两个图像第一图像和第二图像。

我的要求是比较这些图像，并突出显示在另一个图像差异图像中的差异区域。我试图实现基于屏幕截图的UI测试在颤振和需要失败的测试用例，如果有任何不同的两个图像。

请找到下面的截图供参考。

​

​

是否有任何在颤振/飞镖中实现相同输出的包？

感谢并致以问候

阿什温

Answer 1

几个月前，我读到了你的问题，今天我刚刚上传了一个套餐，可以做你想做的事情。

import 'package:diff_image/diff_image.dart';

final FIRST_IMAGE = 'https://raw.githubusercontent.com/nicolashahn/diffimg/master/images/mario-circle-cs.png';
final SECOND_IMAGE = 'https://raw.githubusercontent.com/nicolashahn/diffimg/master/images/mario-circle-node.png';

num getDiff() async{
  try{
      var diff = await DiffImage.compareFromUrl(
            FIRST_IMAGE,
            SECOND_IMAGE,
            saveDiff:True
      );
      print('The difference between images is: $diff %');
      return diff;
  } catch(e){
      print(e);
  }
}

main() {
  getDiff();
}

以两个图像作为输入，它返回它们之间的差值比，并且完全按照您的需要将"diff映像“保存为png。

我想它可以解决你的问题，但是如果你需要更具体的东西，可以问我你需要的功能。

Answer 2

我相信你要找的是黄金文件测试

• 颤振/编写包装的黄金文件测试:颤振
• 中等/你看到区别了吗？-颤振快照测试
• 中/颤振:黄金测试-比较小部件和快照

基本上，您可以创建您的黄金小部件并对其进行图像快照。

然后，在测试期间，检查应用程序是否显示完全相同的内容：

await expectLater(
    find.byType(RepaintBoundary),
    matchesGoldenFile('golden-file.png'),
  );

所以，虽然这不是您的需求，image==image?，但它至少是image==live app display?

对于侧奇观，Facebook也为本地Android创造了类似的东西：http://facebook.github.io/screenshot-tests-for-android/。

Answer 3

我的团队和我创建了比较包来计算两个图像之间的差异。实现这一任务的算法有多种，如与重叠图像的百分比差，欧几里得。颜色距离，RGB直方图比较，和哈希比较，如知觉散列。

下面是一个简单的例子：

import 'package:image_compare/image_compare.dart';

// ...

Future<double> compare() async {
  var a = File('../images/tiger.jpg');
  var b = Uri.parse('https://fujifilm-x.com/wp-content/uploads/2019/08/x-t30_sample- images03.jpg');

  return compareImages(src1: a, src2: b);
}

// ...