在抖动中创建图像蒙版

Question

Flutter提供了几种基于路径（即剪切路径）的蒙版方法。我正在尝试找出一种方法，可以像下面的示例一样使用透明层来拍摄图像，然后使用该图像遮罩另一个图像/视图或将其用作常规遮罩。

我的第一个直觉是看看CustomPaint class，但我无法从这个最初的想法中弄清楚。

Answer 1

Flutter具有BoxDecoration class的BlendMode enum。通过利用这些功能，您可以使用图像实现各种遮罩效果，对于我在dstIn以上的特殊情况，这是一个解决方案。

Answer 2

我通过使用带有防潮板和图像的自定义绘画类，发布了自己的问题here的答案。

  @override
  void paint(Canvas canvas, Size size) {
    if (image != null && mask != null) {
      var rect = Rect.fromLTRB(0, 0, 200, 200);
      Size outputSize = rect.size;
      Paint paint = new Paint();

      //Mask
      Size maskInputSize = Size(mask.width.toDouble(), mask.height.toDouble());
      final FittedSizes maskFittedSizes =
          applyBoxFit(BoxFit.cover, maskInputSize, outputSize);
      final Size maskSourceSize = maskFittedSizes.source;

      final Rect maskSourceRect = Alignment.center
          .inscribe(maskSourceSize, Offset.zero & maskInputSize);

      canvas.saveLayer(rect, paint);
      canvas.drawImageRect(mask, maskSourceRect, rect, paint);

      //Image
      Size inputSize = Size(image.width.toDouble(), image.height.toDouble());
      final FittedSizes fittedSizes =
          applyBoxFit(BoxFit.cover, inputSize, outputSize);
      final Size sourceSize = fittedSizes.source;
      final Rect sourceRect =
          Alignment.center.inscribe(sourceSize, Offset.zero & inputSize);

      canvas.drawImageRect(
          image, sourceRect, rect, paint..blendMode = BlendMode.srcIn);
      canvas.restore();
    }
  }

结果：