title: color overlapping when drawing multiple path
body: <p><strong>ArrayList</strong></p>
  
  <pre><code>ArrayList&lt;Pair&lt;Path, Float&gt;&gt; foregroundPaths = new ArrayList&lt;Pair&lt;Path, Float&gt;&gt;();
  </code></pre>
  
  <p><strong>Paint initilization</strong></p>
  
  <pre><code>    mPaint = new Paint();
      mPaint.setAntiAlias(false);
      mPaint.setDither(true);
      mPaint.setColor(0x0FFF0000);
      mPaint.setStyle(Paint.Style.STROKE);
      mPaint.setStrokeJoin(Paint.Join.BEVEL);
      mPaint.setStrokeCap(Paint.Cap.ROUND);
      mPaint.setStrokeWidth(Math.abs(ImageViewTouch.brushSize
                      / getScale()));
  
      mPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_ATOP));
  
      mPaint.setAlpha(0x80);
  </code></pre>
  
  <p><strong>OnDraw</strong> </p>
  
  <pre><code>  canvas.save();
  
  
      displayRectF = new RectF();
  
  
      canvas.concat(getDisplayMatrix());
  
      rect = canvas.getClipBounds();
      displayRectF.set(rect);
  
      for (Pair&lt;Path, Float&gt; p : foregroundPaths) {
          mPaint.setStrokeWidth(p.second);
          canvas.drawPath(p.first, mPaint);
      }
  
  
  
      canvas.restore();
  </code></pre>
  
  <p><img src="https://i.stack.imgur.com/q41EZ.png" alt="enter image description here"></p>
  
  <p>Above codes are capable of drawing on canvas using finger. But the problem is when multiple path crossing each other its overlap. I have attached a link of my app snapshot.
  Overlapping is inside the green rectangle. I set Xfermode to paint but not working as i expect. </p>
  
  <p>Please help me and suggest me, what should i do to remove this problem. 
  any suggestion will be appreciated. 
  Thanks</p>