1 SkCanvas 2 ======== 3 4 *The drawing context* 5 6 <!-- Updated Mar 4, 2011 --> 7 8 Preview 9 ------- 10 11 Here is an example of a set of drawing commands to draw a filled 12 heptagram. This function can be cut and pasted into 13 [fiddle.skia.org](https://fiddle.skia.org/). 14 15 <!--?prettify lang=cc?--> 16 17 void draw(SkCanvas* canvas) { 18 const SkScalar scale = 256.0f; 19 const SkScalar R = 0.45f * scale; 20 const SkScalar TAU = 6.2831853f; 21 SkPath path; 22 path.moveTo(R, 0.0f); 23 for (int i = 1; i < 7; ++i) { 24 SkScalar theta = 3 * i * TAU / 7; 25 path.lineTo(R * cos(theta), R * sin(theta)); 26 } 27 path.close(); 28 SkPaint p; 29 p.setAntiAlias(true); 30 canvas->clear(SK_ColorWHITE); 31 canvas->translate(0.5f * scale, 0.5f * scale); 32 canvas->drawPath(path, p); 33 } 34 35 <a href="https://fiddle.skia.org/c/d7b4ccb6d6281b68a274a72b187fc450"> 36 <img src="https://fiddle.skia.org/i/d7b4ccb6d6281b68a274a72b187fc450_raster.png"></a> 37 38 Details 39 ------- 40 41 SkCanvas is the drawing context for Skia. It knows where to direct the 42 drawing (i.e. where the screen of offscreen pixels are), and maintains 43 a stack of matrices and clips. Note however, that unlike similar 44 contexts in other APIs like postscript, cairo, or awt, Skia does not 45 store any other drawing attributes in the context (e.g. color, pen 46 size). Rather, these are specified explicitly in each draw call, via a 47 SkPaint. 48 49 <!--?prettify lang=cc?--> 50 51 void draw(SkCanvas* canvas) { 52 canvas->save(); 53 canvas->translate(SkIntToScalar(128), SkIntToScalar(128)); 54 canvas->rotate(SkIntToScalar(45)); 55 SkRect rect = SkRect::MakeXYWH(-90.5f, -90.5f, 181.0f, 181.0f); 56 SkPaint paint; 57 paint.setColor(SK_ColorBLUE); 58 canvas->drawRect(rect, paint); 59 canvas->restore(); 60 } 61 62 <a href="https://fiddle.skia.org/c/6af99894b40ea1331f6a79d55a4cbfd7"> 63 <img src="https://fiddle.skia.org/i/6af99894b40ea1331f6a79d55a4cbfd7_raster.png"></a> 64 65 The code above will draw a rectangle rotated by 45 degrees. Exactly 66 what color and style the rect will be drawn in is described by the 67 paint, not the canvas. 68 69 Check out more detailed info on [creating a SkCanvas object](canvas). 70 71 To begin with, we might want to erase the entire canvas. We can do 72 this by drawing an enormous rectangle, but there are easier ways to do 73 it. 74 75 <!--?prettify lang=cc?--> 76 77 void draw(SkCanvas* canvas) { 78 SkPaint paint; 79 paint.setColor(SK_ColorWHITE); 80 canvas->drawPaint(paint); 81 } 82 83 This fills the entire canvas (though respecting the current clip of 84 course) with whatever color or shader (and xfermode) is specified by 85 the paint. If there is a shader in the paint, then it will respect the 86 current matrix on the canvas as well (see SkShader). If you just want 87 to draw a color (with an optional xfermode), you can just call 88 drawColor(), and save yourself having to allocate a paint. 89 90 <!--?prettify lang=cc?--> 91 92 void draw(SkCanvas* canvas) { 93 canvas->drawColor(SK_ColorWHITE); 94 } 95 96 All of the other draw APIs are similar, each one ending with a paint 97 parameter. 98 99 <!--?prettify lang=cc?--> 100 101 SkBitmap source; 102 103 void draw(SkCanvas* canvas) { 104 canvas->drawColor(SK_ColorWHITE); 105 106 SkPaint paint; 107 paint.setStyle(SkPaint::kStroke_Style); 108 paint.setStrokeWidth(4); 109 paint.setColor(SK_ColorRED); 110 111 SkRect rect = SkRect::MakeXYWH(50, 50, 40, 60); 112 canvas->drawRect(rect, paint); 113 114 SkRRect oval; 115 oval.setOval(rect); 116 oval.offset(40, 60); 117 paint.setColor(SK_ColorBLUE); 118 canvas->drawRRect(oval, paint); 119 120 paint.setColor(SK_ColorCYAN); 121 canvas->drawCircle(180, 50, 25, paint); 122 123 rect.offset(80, 0); 124 paint.setColor(SK_ColorYELLOW); 125 canvas->drawRoundRect(rect, 10, 10, paint); 126 127 SkPath path; 128 path.cubicTo(768, 0, -512, 256, 256, 256); 129 paint.setColor(SK_ColorGREEN); 130 canvas->drawPath(path, paint); 131 132 canvas->drawBitmap(source, 128, 128, &paint); 133 134 SkRect rect2 = SkRect::MakeXYWH(0, 0, 40, 60); 135 canvas->drawBitmapRect(source, rect2); 136 137 SkPaint paint2; 138 const char text[] = "Hello, Skia!"; 139 canvas->drawText(text, strlen(text), 50, 25, paint2); 140 } 141 142 <a href="https://fiddle.skia.org/c/35b614d41e60289461d658a9d509e28d"> 143 <img src="https://fiddle.skia.org/i/35b614d41e60289461d658a9d509e28d_raster.png"></a> 144 145 In some of the calls, we pass a pointer, rather than a reference, to 146 the paint. In those instances, the paint parameter may be null. In all 147 other cases the paint parameter is required. 148 149 Next: [SkPaint](/user/api/skpaint) 150
