1 Tips & FAQ 2 ========== 3 4 + [Bitmap Subsetting](#bitmap-subsetting) 5 + [Capture a `.skp` file on a web page in Chromium](#skp-capture) 6 + [Capture a `.mskp` file on a web page in Chromium](#mskp-capture) 7 + [How to add hardware acceleration in Skia](#hw-acceleration) 8 + [Does Skia support Font hinting?](#font-hinting) 9 + [Does Skia shape text (kerning)?](#kerning) 10 + [How do I add drop shadow on text?](#text-shadow) 11 12 * * * 13 14 <span id="bitmap-subsetting">Bitmap Subsetting</span> 15 ----------------------------------------------------- 16 17 Taking a subset of a bitmap is effectively free - no pixels are copied or 18 memory is allocated. This allows Skia to offer an API that typically operates 19 on entire bitmaps; clients who want to operate on a subset of a bitmap can use 20 the following pattern, here being used to magnify a portion of an image with 21 drawBitmapNine(): 22 23 SkBitmap subset; 24 bitmap.extractSubset(&subset, rect); 25 canvas->drawBitmapNine(subset, ...); 26 27 [An example](https://fiddle.skia.org/c/@subset_example) 28 29 30 * * * 31 32 <span id="skp-capture">Capture a `.skp` file on a web page in Chromium</span> 33 ----------------------------------------------------------------------------- 34 35 1. Launch Chrome or Chromium with `--no-sandbox --enable-gpu-benchmarking` 36 2. Open the JS console (ctrl-shift-J) 37 3. Execute: `chrome.gpuBenchmarking.printToSkPicture('/tmp')` 38 This returns "undefined" on success. 39 40 Open the resulting file in the [Skia Debugger](/dev/tools/debugger), rasterize it with `dm`, 41 or use Skia's `SampleApp` to view it: 42 43 <!--?prettify lang=sh?--> 44 45 out/Release/dm --src skp --skps /tmp/layer_0.skp -w /tmp \ 46 --config 8888 gpu pdf --verbose 47 ls -l /tmp/*/skp/layer_0.skp.* 48 49 out/Release/SampleApp --picture /tmp/layer_0.skp 50 51 * * * 52 53 <span id="mskp-capture">Capture a `.mskp` file on a web page in Chromium</span> 54 ------------------------------------------------------------------------------- 55 56 Multipage Skia Picture files capture the commands sent to produce PDFs 57 and printed documents. 58 59 1. Launch Chrome or Chromium with `--no-sandbox --enable-gpu-benchmarking` 60 2. Open the JS console (ctrl-shift-J) 61 3. Execute: `chrome.gpuBenchmarking.printPagesToSkPictures('/tmp/filename.mskp')` 62 This returns "undefined" on success. 63 64 Open the resulting file in the [Skia Debugger](/dev/tools/debugger) or 65 process it with `dm`. 66 67 <!--?prettify lang=sh?--> 68 69 experimental/tools/mskp_parser.py /tmp/filename.mskp /tmp/filename.mskp.skp 70 ls -l /tmp/filename.mskp.skp 71 # open filename.mskp.skp in the debugger. 72 73 out/Release/dm --src mskp --mskps /tmp/filename.mskp -w /tmp \ 74 --config pdf --verbose 75 ls -l /tmp/pdf/mskp/filename.mskp.pdf 76 77 * * * 78 79 <span id="hw-acceleration">How to add hardware acceleration in Skia</span> 80 -------------------------------------------------------------------------- 81 82 There are two ways Skia takes advantage of specific hardware. 83 84 1. Custom bottleneck routines 85 86 There are sets of bottleneck routines inside the blits of Skia 87 that can be replace on a platform in order to take advantage of 88 specific CPU features. One such example is the NEON SIMD 89 instructions on ARM v7 devices. See [src/opts/](https://skia.googlesource.com/skia/+/master/src/opts/) 90 91 * * * 92 93 <span id="font-hinting">Does Skia support Font hinting?</span> 94 -------------------------------------------------------------- 95 96 Skia has a built-in font cache, but it does not know how to actually render font 97 files like TrueType into its cache. For that it relies on the platform to 98 supply an instance of `SkScalerContext`. This is Skia's abstract interface for 99 communicating with a font scaler engine. In src/ports you can see support 100 files for FreeType, macOS, and Windows GDI font engines. Other font 101 engines can easily be supported in a like manner. 102 103 104 * * * 105 106 <span id="kerning">Does Skia shape text (kerning)?</span> 107 --------------------------------------------------------- 108 109 No. Skia provides interfaces to draw glyphs, but does not implement a 110 text shaper. Skia's client's often use 111 [HarfBuzz](http://www.freedesktop.org/wiki/Software/HarfBuzz/) to 112 generate the glyphs and their positions, including kerning. 113 114 [Here is an example of how to use Skia and HarfBuzz 115 together](https://github.com/aam/skiaex). In the example, a 116 `SkTypeface` and a `hb_face_t` are created using the same `mmap()`ed 117 `.ttf` font file. The HarfBuzz face is used to shape unicode text into 118 a sequence of glyphs and positions, and the `SkTypeface` can then be 119 used to draw those glyphs. 120 121 * * * 122 123 <span id="text-shadow">How do I add drop shadow on text?</span> 124 --------------------------------------------------------------- 125 126 <!--?prettify lang=cc?--> 127 128 void draw(SkCanvas* canvas) { 129 const char text[] = "Skia"; 130 const SkScalar radius = 2.0f; 131 const SkScalar xDrop = 2.0f; 132 const SkScalar yDrop = 2.0f; 133 const SkScalar x = 8.0f; 134 const SkScalar y = 52.0f; 135 const SkScalar textSize = 48.0f; 136 const uint8_t blurAlpha = 127; 137 canvas->drawColor(SK_ColorWHITE); 138 SkPaint paint; 139 paint.setAntiAlias(true); 140 paint.setTextSize(textSize); 141 SkPaint blur(paint); 142 blur.setAlpha(blurAlpha); 143 blur.setMaskFilter(SkBlurMaskFilter::Make( 144 kNormal_SkBlurStyle, 145 SkBlurMaskFilter::ConvertRadiusToSigma(radius), 0)); 146 canvas->drawText(text, strlen(text), x + xDrop, y + yDrop, blur); 147 canvas->drawText(text, strlen(text), x, y, paint); 148 } 149 150 <a href='https://fiddle.skia.org/c/@text_shadow'><img src='https://fiddle.skia.org/i/@text_shadow_raster.png'></a> 151 152 * * * 153 154 <div style="margin-bottom:99%"></div> 155