title: How do the pieces of Android's (2D) Canvas drawing pipeline fit together?
body: <p>I would like to have a better understanding of how the components of Android's (2D) Canvas drawing pipeline fit together.</p>
  
  <p>For example, how do <a href="http://developer.android.com/reference/android/graphics/Xfermode.html" rel="noreferrer">XferMode</a>, <a href="http://developer.android.com/reference/android/graphics/Shader.html" rel="noreferrer">Shader</a>, <a href="http://developer.android.com/reference/android/graphics/MaskFilter.html" rel="noreferrer">MaskFilter</a> and <a href="http://developer.android.com/reference/android/graphics/ColorFilter.html" rel="noreferrer">ColorFilter</a> interact? The reference docs for these classes are pretty sparse and the docs for <a href="http://developer.android.com/reference/android/graphics/Canvas.html" rel="noreferrer">Canvas</a> and <a href="http://developer.android.com/reference/android/graphics/Paint.html" rel="noreferrer">Paint</a> don't really add any useful explanation.</p>
  
  <p>It's also not entirely clear to me how drawing operations that have intrinsic colors (eg: <code>drawBitmap</code>, versus the "vector" primitives like <code>drawRect</code>) fit into all of this -- do they always ignore the <code>Paint</code>'s color and use use their intrinsic color instead?</p>
  
  <p>I was also surprised by the fact that one can do something like this:</p>
  
  <pre><code>Paint eraser = new Paint();
  eraser.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR));
  canvas.drawOval(rectF, eraser);
  </code></pre>
  
  <p>This erases an oval. Before I noticed this my mental-model was that drawing to a canvas (conceptually) draws to a separate "layer" and then that layer is composed with the Canvas's Bitmap using the Paint's transfer mode. If it were as simple as that then the above code would erase the entire Bitmap (within the clipping region) as CLEAR <em>always</em> sets the color (and alpha) to 0 regardless of the source's alpha. So this implies that there's an additional sort of masking going on to constrain the erasing to an oval.</p>
  
  <p>I did find the <a href="http://developer.android.com/resources/samples/ApiDemos/src/com/example/android/apis/graphics/index.html" rel="noreferrer">API demos</a> but each demo works "in a vacuum" and doesn't show how the thing it focusses on (eg: XferModes) interacts with other stuff (eg: ColorFilters).</p>
  
  <p>With enough time and effort I could empirically figure out how these pieces relate or go decipher the source, but I'm hoping that someone else has already worked this out, or better yet that there's some actual documentation of the pipeline/drawing-model that I missed.</p>
  
  <p>This question was inspired by seeing the code in <a href="https://stackoverflow.com/questions/4560265/android-edit-bitmap-channels/4632210#4632210">this answer to another SO question</a>.</p>
  
  <h2>Update</h2>
  
  <p>While looking around for some documentation it occurred to me that since much the stuff I'm interested in here seems to be a pretty thin veneer on top of <a href="http://code.google.com/p/skia/" rel="noreferrer">skia</a>, maybe there's some skia documentation that would be helpful. The best thing I could find is <a href="http://code.google.com/p/skia/wiki/SkPaint" rel="noreferrer">the documentation for <code>SkPaint</code></a> which says:</p>
  
  <blockquote>
    <p>There are 6 types of effects that can
    be assigned to a paint:</p>
    
    <ul>
    <li>SkPathEffect - modifications to the geometry (path) before it generates an
    alpha mask (e.g. dashing)</li>
    <li>SkRasterizer - composing custom mask layers (e.g. shadows)</li>
    <li>SkMaskFilter - modifications to the alpha mask before it is colorized and
    drawn (e.g. blur, emboss)</li>
    <li>SkShader - e.g. gradients (linear, radial, sweep), bitmap patterns
    (clamp, repeat, mirror)</li>
    <li>SkColorFilter - modify the source color(s) before applying the xfermode
    (e.g. color matrix)</li>
    <li>SkXfermode - e.g. porter-duff transfermodes, blend modes</li>
    </ul>
  </blockquote>
  
  <p>It isn't stated explicitly, but I'm guessing that the order of the effects here is the order they appear in the pipeline.</p>