Canvas Drawing for Fun and Profit
summary
Shows how Android Canvas APIs draw a fully parametric donut: base circle + clipPath difference for the hole, icing generated by a compose PathEffect (discrete + corner) and sprinkles placed by rotating/translating the canvas so each rounded rect is drawn at the origin. Uses a single cached Paint per role, avoids per-frame allocations, and scales via Canvas.scale matrix so one drawing routine fits many sizes. Demonstrates drawing to bitmap for caching, and notes paths often rasterize to textures on the GPU. Sample app "M" on GitHub and slides on SpeakerDeck.
AI-written summary · about
chapters (15)
- 0:00Introduction to Canvas
- 2:12Canvas and Skia Overview
- 3:22Getting a Canvas
- 5:09Canvas Drawing Basics
- 6:34Why Draw a Donut
- 8:23Drawing the Donut Base
- 11:13Creating the Donut Hole
- 14:23Save and Restore Canvas
- 15:27Adding Icing to the Donut
- 17:58Path Effects for Icing
- 19:42Drawing Sprinkles
- 22:10Positioning Sprinkles
- 28:16Finalizing the Donut
- 28:57Scaling the Donut
- 32:12Q&A Session
related talks
41mGraphics for Android Developers, Part Deux
49mCustom Drawing with Canvas
31mComposing in your Canvas!
40mPlease, Draw Me a View
42mAndroid Graphics: the Path to [UI] Riches
44mAdvanced Drawing Techniques with UIBezierPath and Apple Pencil
11mHow to Draw a Circle!!!
38mIn a World of Pure Android Animation 🍭🍫