miniblink49 中的 Skia 图形基础SkPaint 样式属性、效果管线与引用计数管理【免费下载链接】miniblink49a lighter, faster browser kernel of blink to integrate HTML UI in your app. 一个小巧、轻量的浏览器内核用来取代wke和libcef项目地址: https://gitcode.com/GitHub_Trending/mi/miniblink49在 miniblink49 这类将 Blink 渲染管线裁剪并内嵌进应用的内核中所有几何图元、文本与位图的最终绘制都落到 Skia 上而决定怎么画的正是SkPaint对象它承载颜色、混合方式、描边样式、字体与各类效果shader、mask filter 等。本文基于仓库中随 Skia 附带的一篇经典教程 skpaint.md结合 SkPaint.h 头文件实现与 miniblink 合成/光栅化代码中的真实用法完整讲清 SkPaint 的职责边界、属性配置、六种效果对象及其引用计数规则读完后你能在 miniblink 的渲染路径上下文中独立写出并维护一个正确的绘制 Paint。一、SkPaint 的定位把样式状态从 Canvas 中剥离出来SkPaint 的核心文档注释给出了它的官方定义SkPaint.h/** \class SkPaint The SkPaint class holds the style and color information about how to draw geometries, text and bitmaps. */ class SK_API SkPaint {即SkPaint 持有如何绘制几何图形、文本和位图的全部样式与颜色信息。教程文档 skpaint.md 强调了一个关键设计决策——每次在 Skia 中绘制时如果你要指定颜色、与背景的混合方式、描边样式或字体这些属性都放在 paint 里而不是画布上与SkCanvas不同paint 内部不维护状态栈paint 没有 save/restore。但 paint 相对轻量客户端可以创建并维护任意多个 paint 对象每个配置好特定用途。把这些颜色与样式属性从 canvas 状态中剥离到多个paint 对象里使得 canvas 的 save/restore 更加高效因为它只需要维护矩阵与裁剪区域的栈。从源码结构看这一点在SkPaint的类定义中得到印证SkPaint.hclass SK_API SkPaint { public: SkPaint(); SkPaint(const SkPaint paint); // 值语义可自由拷贝 ~SkPaint(); SkPaint operator(const SkPaint);SkPaint是可拷贝、可赋值的值类型对象没有任何内部状态栈。这意味着为不同用途分别准备一个 paint比如一个填充红色、一个描边绿色、一个放大字形是零额外开销的设计习惯而SkCanvas::save()/restore()只需压栈 matrix 和 clip性能路径更短。二、最小绘制示例用三个 Paint 画同一段文本教程文档的第一个完整示例展示了三个配置不同的 paint各自用于绘制同一段文字。代码完整继承自 skpaint.mdvoid draw(SkCanvas* canvas) { canvas-clear(SK_ColorWHITE); SkPaint paint1, paint2, paint3; paint1.setTextSize(64.0f); paint1.setAntiAlias(true); paint1.setColor(0xFFFF0000); paint1.setStyle(SkPaint::kFill_Style); paint2.setTextSize(64.0f); paint2.setAntiAlias(true); paint2.setColor(0xFF008800); paint2.setStyle(SkPaint::kStroke_Style); paint2.setStrokeWidth(SkIntToScalar(3)); paint3.setTextSize(64.0f); paint3.setAntiAlias(true); paint3.setColor(0xFF888888); paint3.setTextScaleX(SkFloatToScalar(1.5f)); const char text[] Skia!; canvas-drawText(text, strlen(text), 20.0f, 64.0f, paint1); canvas-drawText(text, strlen(text), 20.0f, 144.0f, paint2); canvas-drawText(text, strlen(text), 20.0f, 224.0f, paint3); }三行文字分别呈现为红色填充、绿色 3 像素描边、灰色横向拉宽 1.5 倍。下面结合头文件逐一核对这些 API 的真实语义1. 样式Style填充 / 描边 / 填充并描边setStyle()的取值定义在 SkPaint.henum Style { kFill_Style, //! fill the geometry kStroke_Style, //! stroke the geometry kStrokeAndFill_Style, //! fill and stroke the geometry }; /** Set the paints style, used for controlling how primitives geometries are interpreted (except for drawBitmap, which always assumes Fill). */ void setStyle(Style style);注意头文件注释里的重要边界drawBitmap总是按kFill_Style处理Style 只对几何图元和文本有意义。2. 描边宽度setStrokeWidth()与 hairline 语义SkPaint.h 对描边宽度的说明给出了一个容易被忽略的细节/** Set the width for stroking. Pass 0 to stroke in hairline mode. Hairlines always draw 1-pixel wide, regardless of the matrix. */ void setStrokeWidth(SkScalar width);即宽度传 0 表示 hairline 模式——无论矩阵如何缩放始终画 1 像素宽。示例中paint2.setStrokeWidth(SkIntToScalar(3))用的是整数到浮点标量的转换函数SkIntToScalar因为 Skia 的坐标/尺寸量纲是SkScalar在 32 位平台上是定点数SkFixed体系SkIntToScalar/SkFloatToScalar负责整型、浮点与标量之间的换算。3. 抗锯齿与一整套位标志FlagssetAntiAlias(true)实际是操作Flags位域中的kAntiAlias_Flag值为0x01。完整的标志定义见 SkPaint.henum Flags { kAntiAlias_Flag 0x01, //! mask to enable antialiasing kDither_Flag 0x04, //! mask to enable dithering kUnderlineText_Flag 0x08, //! mask to enable underline text kStrikeThruText_Flag 0x10, //! mask to enable strike-thru text kFakeBoldText_Flag 0x20, //! mask to enable fake-bold text kLinearText_Flag 0x40, //! mask to enable linear-text kSubpixelText_Flag 0x80, //! mask to enable subpixel text positioning kDevKernText_Flag 0x100, //! mask to enable device kerning text kLCDRenderText_Flag 0x200, //! mask to enable subpixel glyph renderering kEmbeddedBitmapText_Flag 0x400, //! mask to enable embedded bitmap strikes kAutoHinting_Flag 0x800, //! mask to force Freetypes autohinter kVerticalText_Flag 0x1000, kGenA8FromLCD_Flag 0x2000, kAllFlags 0xFFFF };对于文本绘制而言这些位标志控制字距linear-text / dev-kern、LCD 子像素渲染、嵌入位图字形等是文本渲染调优的主要入口。每个标志都有对应的isXXX()/setXXX()便捷方法如 isAntiAlias()。4. 字体度量与setTextScaleX示例中paint3.setTextScaleX(1.5f)单独横向拉伸字形。此外SkPaint还持有SkTypeface引用见下文第四节并暴露setHinting()等字体级开关Hinting枚举的取值映射到 FreeType 的加载模式SkPaint.henum Hinting { kNo_Hinting 0, kSlight_Hinting 1, kNormal_Hinting 2, //! this is the default kFull_Hinting 3 };三、自由混用 Paint无 save/restore 的状态管理教程文档的第二段示例说明 paint 可以自由交替使用也可以在绘制过程中就地修改canvas-drawRect(..., paint1); canvas-drawRect(..., paint2); paint2.setStrokeWidth(SkIntToScalar(5)); canvas-drawOval(..., paint2); canvas-drawText(..., paint3); paint3.setColor(0xFF0000FF); canvas-drawText(..., paint3);这里体现了文档反复强调的使用模式多个 paint 各管一段调用者按需在两个 paint 之间切换而不必回退画布状态。由于 paint 是值类型还可以利用拷贝构造派生新样式而不污染原对象SkPaint fillPaint; fillPaint.setStyle(SkPaint::kFill_Style); fillPaint.setColor(0xFFFF0000); SkPaint strokePaint(fillPaint); // 拷贝构造 strokePaint.setStyle(SkPaint::kStroke_Style); strokePaint.setStrokeWidth(SkIntToScalar(3));SkPaint还提供了reset()恢复初始设置SkPaint.h以及带有意图的operator文档注释明确说明operator可能假阴性两个等价绘制的 paint 也可能返回 false但绝不会假阳性getHash()与之有相同的浅比较限制。从源码结构看这是因为 effects 指针等成员参与比较时只比较引用本身读者在做 paint 缓存键时应以getHash()为初筛、必要时回读属性确认。四、六种效果Effects引用计数对象接管绘制管线的各个阶段教程文档指出除了颜色、描边、文本这些简单属性paint 还支持effects——它们是绘制管线不同阶段的子类对象被 paint 引用每个都是引用计数对象后会被调用来覆盖管线的某一部分。文档完整列出的 6 种效果如下这也是原文档的核心内容之一须完整保留效果类型作用阶段典型用途SkPathEffect生成 alpha 掩码之前修改几何path虚线dashingSkRasterizer组合自定义掩码层阴影shadowsSkMaskFilter着色绘制之前修改 alpha 掩码模糊blur、浮雕embossSkShader提供源颜色渐变linear / radial / sweep、位图平铺clamp / repeat / mirrorSkColorFilter应用 xfermode 之前修改源颜色颜色矩阵SkXfermode与目标像素混合Porter-Duff 混合模式、blend modes从源码结构看SkPaint头文件顶部的前向声明与成员注释印证了这一组效果对象的地位——SkColorFilter、SkMaskFilter、SkPathEffect、SkShader、SkRasterizer、SkXfermode以及新增的SkImageFilter全部是SkPaint的组成部分SkPaint.hclass SkColorFilter; class SkMaskFilter; class SkPathEffect; class SkRasterizer; class SkShader; class SkImageFilter; class SkTypeface;在默认填充路径中这些效果对象会被 paint 主动感知例如computeFastBounds内部对填充样式图元会检查getLooper()、getMaskFilter()、getPathEffect()、getImageFilter()是否存在以决定包围盒能否走快速路径SkPaint.h——从源码结构看这意味着挂上效果对象后边界计算会更保守性能敏感代码应留意这一点。五、SkShader 与引用计数渐变绘制实战文档中最有代表性的效果用法是把一个SkShader赋给 paint用渐变代替纯色SkShader* shader SkGradientShader::CreateLinear(...); paint.setShader(shader); shader-unref();现在用该 paint 绘制的任何东西都会按照CreateLinear()中指定的渐变来绘制。返回的 shader 对象是引用计数的。每当任何 effects 对象如 shader被赋给 paint其引用计数会被 paint 加一。为平衡这一点调用者在上面的例子里于赋值后对 shader 调用一次unref()。此时 paint 是该 shader 唯一的所有者当 paint 超出作用域或者被重新赋以另一个 shader或 null时paint 会自动对 shader 调用unref()。用仓库头文件逐条核对这段所有权协议1.CreateLinear返回引用计数为 1 的对象SkGradientShader.h 的注释明确写道/** CreateLinear returns a shader with a reference count of 1. ... */ static SkShader* CreateLinear(const SkPoint pts[2], const SkColor colors[], const SkScalar pos[], int count, TileMode mode, const SkPoint* perlin nullptr, ...);所以工厂返回的初始 1 次引用属于调用者paint.setShader()内部ref()之后调用者必须unref()抵消自己的份额paint 才是唯一所有者——这正是文档示例中shader-unref()的由来。2.getShader()不改变引用计数setShader()返回被替换者SkPaint.h/** Get the paints shader. If there is a shader, its reference count is not changed. return the paints shader (or NULL) */ SkShader* getShader() const { return fShader; } /** Set or clear the shader object. * Shaders specify the source color(s) for what is being drawn. If a paint * has no shader, then the paints color is used. If the paint has a * shader, then the paints color is ignored. * param shader May be NULL. The shader to be installed in the paint * return shader */ SkShader* setShader(SkShader* shader);两条注释给出了两条实操规则有 shader 时 paint 的 color 被忽略——渐变/平铺覆盖纯色setShader(NULL)是清除 shader的标准方式且返回值是被替换掉的旧 shader引用计数不变便于链式交接所有权。综合起来一个可直接复制的渐变用法在 miniblink 这类内嵌渲染环境里绘制自绘控件背景时同样适用SkPoint pts[2] { { 0, 0 }, { 200, 0 } }; SkColor colors[2] { 0xFF00FF00, 0xFFFF8800 }; SkShader* shader SkGradientShader::CreateLinear(pts, colors, nullptr, 2, SkShader::kClamp_TileMode); paint.setShader(shader); // paint 内部 ref() shader-unref(); // 抵消工厂返回的初始引用paint 成为唯一所有者 canvas-drawRect(rect, paint); // 不再需要时清除恢复使用 paint 纯色 paint.setShader(nullptr);六、文本SkTypeface 持有与测量 API文档的最后一节指出paint 还持有一个SkTypeface的引用typeface 表示一个具体的字体样式用于文本的测量与绘制并且paint 不仅用于绘制文本也用于测量文本给出四个测量入口paint.measureText(...); paint.getTextBounds(...); paint.textToGlyphs(...); paint.getFontMetrics(...);这四个 API 覆盖了排版测量最常用的需求measureText求字符串总宽度、getTextBounds求包围盒、textToGlyphs完成文本到字形索引的映射字形缓存/自定义绘制的起点、getFontMetrics获取 ascent/descent 等行高数据。配合前文Hinting枚举与Flags中的kLinearText_Flag、kDevKernText_Flag、kLCDRenderText_Flag一个 paint 实际上完整定义了文本以何种字体、何种字距、何种渲染质量绘制的全部参数。七、miniblink 渲染路径中的真实用法文档讲的是通用 Skia 知识而 miniblink49 的 Blink/cc 裁剪层正是这些模式的大规模用户。以合成层绘制为例mc/layers/CompositingLayer.cpp 中每个图元绘制前都按文档描述的局部构造 paint模式操作SkPaint paint; paint.setAntiAlias(wke::g_rendererAntiAlias);同一文件中多处绘制路径L523-L524、L571-L572都重复这一模式说明paint 是函数级局部变量——印证文档所说 paint 轻量、可按用途即时创建抗锯齿开关由全局变量wke::g_rendererAntiAlias统一控制——从源码结构看miniblink 将文档中的每个 paint 自行决定 AA收敛为内核级统一开关这是嵌入式内核为一致性做出的取舍自绘控件与滚动条绘制同样如此如 mc/blink/WebScrollbarLayerImpl.cpp 与 mc/base/RecordDrawHelp.h 中均有SkPaint paint; paint.setAntiAlias(...)的构造。也就是说教程文档中的多 paint 混用 局部构造范式在 miniblink 的层合成与光栅化代码里是逐行可见的落地形态。八、要点速查结合 skpaint.md 与 SkPaint.h可将 SkPaint 的关键事实浓缩如下类别API / 事实出处定位持有几何、文本、位图的样式与颜色信息无内部状态栈无 save/restoreSkPaint.h样式kFill_Style/kStroke_Style/kStrokeAndFill_StyledrawBitmap恒按 fill 处理SkPaint.h描边setStrokeWidth(0) hairline恒 1 像素宽SkPaint.h位标志kAntiAlias_Flag(0x01) 起共 13 个语义位SkPaint.h效果SkPathEffect / SkRasterizer / SkMaskFilter / SkShader / SkColorFilter / SkXfermode 六类全部引用计数skpaint.mdshader 所有权工厂返回引用计数 1setShader()内部 ref调用者须unref()平衡paint 出作用域或再赋值时自动 unrefSkGradientShader.h、SkPaint.h文本持有SkTypefacemeasureText/getTextBounds/textToGlyphs/getFontMetrics同时用于绘制与测量skpaint.mdminiblink 落地局部构造 paint 全局g_rendererAntiAlias统一控制抗锯齿CompositingLayer.cpp掌握以上内容后无论是理解 miniblink 裁剪版 Blink 合成层里的每段绘制代码还是在自有窗口系统中基于该内核自绘控件都可以正确地配置、复用与释放SkPaint及其效果对象。【免费下载链接】miniblink49a lighter, faster browser kernel of blink to integrate HTML UI in your app. 一个小巧、轻量的浏览器内核用来取代wke和libcef项目地址: https://gitcode.com/GitHub_Trending/mi/miniblink49创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考