More masks and matte improvements (airbnb#169)

Uses multiple levels of offscreen buffers instead of a bitmap to further improve mask and matte performance. There are now no bitmaps created for masks or mattes! Performance is comparable but memory is greatly reduced.

Multiple masks were broken because they were applied sequentially rather than together. Fixes airbnb#161.

README.md

@@ -246,7 +246,8 @@ If you use `LottieDrawable` directly, you must call `recycleBitmaps` when you ar
 
 ## Performance and Memory
 1. If the composition has no masks or mattes then the performance and memory overhead should be quite good. No bitmaps are created and most operations are simple canvas draw operations.
-2. If the composition has masks or mattes, a bitmap will be created and there will be a minor performance hit has it gets drawn.  
+2. If the composition has masks or mattes, offscreen buffers will be used and there will 
+be a performance hit has it gets drawn.  
 3. If you are using your animation in a list, it is recommended to use a CacheStrategy in 
 LottieAnimationView.setAnimation(String, CacheStrategy) so the animations do not have to be deserialized every time.
 

lottie/src/main/java/com/airbnb/lottie/LayerView.java

@@ -17,23 +17,21 @@
 import java.util.List;
 
 class LayerView extends AnimatableLayer {
-  private static final int SAVE_FLAGS = Canvas.CLIP_SAVE_FLAG | Canvas.CLIP_TO_LAYER_SAVE_FLAG;
+  private static final int SAVE_FLAGS = Canvas.CLIP_SAVE_FLAG | Canvas.CLIP_TO_LAYER_SAVE_FLAG |
+      Canvas.MATRIX_SAVE_FLAG;
   private MaskKeyframeAnimation mask;
   private LayerView matteLayer;
 
-  private final PorterDuffXfermode DST_OUT = new PorterDuffXfermode(PorterDuff.Mode.DST_OUT);
-  private final PorterDuffXfermode DST_IN = new PorterDuffXfermode(PorterDuff.Mode.DST_IN);
   private final RectF rect = new RectF();
   private final List<LayerView> transformLayers = new ArrayList<>();
-  private final Paint mainCanvasPaint = new Paint();
+  private final Paint mainCanvasPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
   private final Paint mattePaint = new Paint(Paint.ANTI_ALIAS_FLAG);
   private final Paint maskPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
   private final Paint imagePaint =
       new Paint(Paint.ANTI_ALIAS_FLAG | Paint.FILTER_BITMAP_FLAG);
 
   private final Layer layerModel;
   private final LottieComposition composition;
-  private final CanvasPool canvasPool;
 
   @Nullable private LayerView parentLayer;
   /**
@@ -44,18 +42,18 @@ class LayerView extends AnimatableLayer {
   private int precompWidth;
   private int precompHeight;
 
-  LayerView(Layer layerModel, LottieComposition composition, Callback callback, CanvasPool canvasPool) {
+  LayerView(Layer layerModel, LottieComposition composition, Callback callback) {
     super(callback);
     this.layerModel = layerModel;
     this.composition = composition;
-    this.canvasPool = canvasPool;
     setBounds(composition.getBounds());
 
     if (layerModel.getMatteType() == Layer.MatteType.Invert) {
-      mattePaint.setXfermode(DST_OUT);
+      mattePaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.DST_OUT));
     } else {
-      mattePaint.setXfermode(DST_IN);
+      mattePaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.DST_IN));
     }
+    maskPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.DST_IN));
 
     setupForModel();
   }
@@ -172,7 +170,7 @@ private void setupPreCompLayer() {
     for (int i = precompLayers.size() - 1; i >= 0; i--) {
       Layer layer = precompLayers.get(i);
       LayerView layerView =
-          new LayerView(layer, composition, getCallback(), canvasPool);
+          new LayerView(layer, composition, getCallback());
       layerView.setPrecompSize(layerModel.getPreCompWidth(), layerModel.getPreCompHeight());
       if (mattedLayer != null) {
         mattedLayer.setMatteLayer(layerView);
@@ -248,11 +246,12 @@ void setMatteLayer(LayerView matteLayer) {
       parent = parent.getParentLayer();
     }
 
+    if (precompWidth != 0 || precompHeight != 0) {
+      canvas.clipRect(0, 0, precompWidth, precompHeight);
+    }
+
     if (!hasMasks() && !hasMatte()) {
       int mainCanvasCount = saveCanvas(canvas);
-      if (precompWidth != 0 || precompHeight != 0) {
-        canvas.clipRect(0, 0, precompWidth, precompHeight);
-      }
       // Now apply the parent transformations from the top down.
       for (int i = transformLayers.size() - 1; i >= 0; i--) {
         LayerView layer = transformLayers.get(i);
@@ -264,60 +263,55 @@ void setMatteLayer(LayerView matteLayer) {
       return;
     }
 
-
-    BitmapCanvas bitmapCanvas =
-        canvasPool.acquire(canvas.getWidth(), canvas.getHeight(), Bitmap.Config.ARGB_8888);
-
     // Now apply the parent transformations from the top down.
-    bitmapCanvas.save();
-    drawImageIfNeeded(bitmapCanvas);
+    rect.set(0, 0, composition.getBounds().width(), composition.getBounds().height());
+    canvas.saveLayer(rect, mainCanvasPaint, Canvas.ALL_SAVE_FLAG);
+
+    drawImageIfNeeded(canvas);
+    canvas.save();
     for (int i = transformLayers.size() - 1; i >= 0; i--) {
       LayerView layer = transformLayers.get(i);
-      applyTransformForLayer(bitmapCanvas, layer);
+      applyTransformForLayer(canvas, layer);
     }
-    super.draw(bitmapCanvas);
+    super.draw(canvas);
+    canvas.restore();
 
-    rect.set(0, 0, canvas.getWidth(), canvas.getHeight());
     if (hasMasks()) {
-      List<Mask> masks = mask.getMasks();
-      List<BaseKeyframeAnimation<?, Path>> maskAnimations = mask.getMaskAnimations();
-      for (int i = 0; i < masks.size(); i++) {
-        applyMask(bitmapCanvas, masks.get(i), maskAnimations.get(i));
-      }
+      applyMasks(canvas);
     }
-    bitmapCanvas.restore();
 
     if (hasMatte()) {
-      bitmapCanvas.saveLayer(rect, mattePaint, SAVE_FLAGS);
-      matteLayer.draw(bitmapCanvas);
-      bitmapCanvas.restore();
+      canvas.saveLayer(rect, mattePaint, SAVE_FLAGS);
+      matteLayer.draw(canvas);
+      canvas.restore();
     }
-
-    if (precompWidth != 0 || precompHeight != 0) {
-      canvas.clipRect(0, 0, precompWidth, precompHeight);
-    }
-    canvas.drawBitmap(bitmapCanvas.getBitmap(), 0, 0, null);
-    canvasPool.release(bitmapCanvas);
+    canvas.restore();
   }
 
-  private void applyMask(BitmapCanvas canvas, Mask mask,
-      BaseKeyframeAnimation<?, Path> maskAnimation) {
-    switch (mask.getMaskMode()) {
-      case MaskModeSubtract:
-        maskPaint.setXfermode(DST_OUT);
-        break;
-      case MaskModeAdd:
-      default:
-        maskPaint.setXfermode(DST_IN);
-    }
-
+  private void applyMasks(Canvas canvas) {
     canvas.saveLayer(rect, maskPaint, SAVE_FLAGS);
+
     for (int i = transformLayers.size() - 1; i >= 0; i--) {
       LayerView layer = transformLayers.get(i);
       applyTransformForLayer(canvas, layer);
     }
     applyTransformForLayer(canvas, this);
-    canvas.drawPath(maskAnimation.getValue(), mainCanvasPaint);
+
+    int size = mask.getMasks().size();
+    for (int i = 0; i < size; i++) {
+      Mask mask = this.mask.getMasks().get(i);
+      BaseKeyframeAnimation<?, Path> maskAnimation = this.mask.getMaskAnimations().get(i);
+      Path maskPath = maskAnimation.getValue();
+      switch (mask.getMaskMode()) {
+        case MaskModeSubtract:
+          maskPath.setFillType(Path.FillType.INVERSE_WINDING);
+          break;
+        case MaskModeAdd:
+        default:
+          maskPath.setFillType(Path.FillType.WINDING);
+      }
+      canvas.drawPath(maskAnimation.getValue(), mainCanvasPaint);
+    }
     canvas.restore();
   }
 

lottie/src/main/java/com/airbnb/lottie/LottieDrawable.java

@@ -30,7 +30,6 @@ public class LottieDrawable extends AnimatableLayer implements Drawable.Callback
   private final ValueAnimator animator = ValueAnimator.ofFloat(0f, 1f);
   private float speed = 1f;
 
-  private final CanvasPool canvasPool = new CanvasPool();
   @Nullable private ImageAssetBitmapManager imageAssetBitmapManager;
   @Nullable private String imageAssetsFolder;
   private boolean playAnimationWhenLayerAdded;
@@ -109,7 +108,6 @@ public class LottieDrawable extends AnimatableLayer implements Drawable.Callback
    *
    */
   @SuppressWarnings("WeakerAccess") public void recycleBitmaps() {
-    canvasPool.recycleBitmaps();
     if (imageAssetBitmapManager != null) {
       imageAssetBitmapManager.recycleBitmaps();
     }
@@ -157,7 +155,7 @@ private void buildLayersForComposition(LottieComposition composition) {
     for (int i = composition.getLayers().size() - 1; i >= 0; i--) {
       Layer layer = composition.getLayers().get(i);
       LayerView layerView;
-      layerView = new LayerView(layer, composition, this, canvasPool);
+      layerView = new LayerView(layer, composition, this);
       layerMap.put(layerView.getId(), layerView);
       if (mattedLayer != null) {
         mattedLayer.setMatteLayer(layerView);