概念
- 描边类型：纯色（Color）或渐变（Gradient），由最后设置的决定。
- 宽度：路径两侧各扩展 Width/2，默认 1.0。
- 仅描边：不设置 FillColor 时只绘制描边轮廓。
API 速查
| 函数 | 说明 |
|---|---|
int xgeShapeExStrokeColor(xge_shape_ex pShape, uint32_t iColor) | 设置描边颜色 |
int xgeShapeExStrokeColorGet(xge_shape_ex pShape, uint32_t* pColor) | 获取描边颜色 |
int xgeShapeExStrokeTypeGet(xge_shape_ex pShape, int* pType) | 获取描边类型（纯色/渐变） |
int xgeShapeExStrokeWidth(xge_shape_ex pShape, float fWidth) | 设置描边宽度 |
int xgeShapeExStrokeWidthGet(xge_shape_ex pShape, float* pWidth) | 获取描边宽度 |
编译本章示例
gcc -O2 -I. -o ch46.exe ch46_main.c build\xge.lib -lm -lws2_32 -liphlpapi -lgdi32 -luser32 -lshell32 -lopengl32 -lole32 -lwinmm -lavrt
.\ch46.exe示例 1：基础描边
xge_shape_ex shape = NULL;
xgeShapeExCreate(&shape);
// 构建一个圆角矩形路径
xgeShapeExAppendRect(shape, 150,150, 500,300, 20,20, 1);
// 设置描边：青色 3px
xgeShapeExStrokeColor(shape, 0x4FD8C2FF);
xgeShapeExStrokeWidth(shape, 3.0f);
// 不设置 FillColor → 仅描边
xgeShapeExDraw(shape, 0.25f);示例 2：填充 + 描边组合
xge_shape_ex shape = NULL;
xgeShapeExCreate(&shape);
xgeShapeExAppendCircle(shape, 400, 300, 100, 100, 1);
// 半透明填充
xgeShapeExFillColor(shape, 0x4FD8C240);
// 实色描边
xgeShapeExStrokeColor(shape, 0xFFB454FF);
xgeShapeExStrokeWidth(shape, 5.0f);
xgeShapeExDraw(shape, 0.25f);
// 查询当前描边宽度
float fW;
xgeShapeExStrokeWidthGet(shape, &fW); // fW == 5.0完整代码
将以下代码保存为 ch46_main.c，编译后运行即可看到描边颜色与宽度效果：
#include "xge.h"
static int onFrame(void* pUser) {
(void)pUser;
xgeClear(0x081114FF);
// 示例 1：纯描边圆角矩形
xge_shape_ex s1 = NULL;
xgeShapeExCreate(&s1);
xgeShapeExAppendRect(s1, 80,60, 300,200, 20,20, 1);
xgeShapeExStrokeColor(s1, 0x4FD8C2FF);
xgeShapeExStrokeWidth(s1, 3.0f);
xgeShapeExDraw(s1, 0.25f);
xgeShapeExDestroy(s1);
// 示例 2：填充 + 描边组合
xge_shape_ex s2 = NULL;
xgeShapeExCreate(&s2);
xgeShapeExAppendCircle(s2, 580, 160, 100, 100, 1);
xgeShapeExFillColor(s2, 0x4FD8C240);
xgeShapeExStrokeColor(s2, 0xFFB454FF);
xgeShapeExStrokeWidth(s2, 5.0f);
xgeShapeExDraw(s2, 0.25f);
xgeShapeExDestroy(s2);
// 示例 3：不同宽度对比
float widths[] = { 1.0f, 3.0f, 6.0f, 10.0f };
for (int i = 0; i < 4; i++) {
xge_shape_ex s = NULL;
xgeShapeExCreate(&s);
xgeShapeExAppendRect(s, 80, 320+i*65, 640, 45, 8,8, 1);
xgeShapeExStrokeColor(s, 0x4FD8C2FF);
xgeShapeExStrokeWidth(s, widths[i]);
xgeShapeExDraw(s, 0.25f);
xgeShapeExDestroy(s);
}
return XGE_OK;
}
int main(void) {
xge_desc_t d = {0};
d.iWidth = 800;
d.iHeight = 600;
d.sTitle = "ch46 - Stroke Color & Width";
d.iFlags = XGE_INIT_VSYNC;
xgeInit(&d);
xgeRun(onFrame, NULL);
xgeUnit();
return 0;
}代码讲解
- 纯描边：只设置 StrokeColor/Width，不设置 FillColor，则仅绘制轮廓。
- 填充+描边：同时设置 FillColor 和 StrokeColor，默认先填充后描边。
- StrokeWidth：描边宽度以像素为单位，默认 1.0，设为 0 则不绘制描边。
- StrokeWidthGet：可查询当前描边宽度，用于动态调整。
要点与陷阱
- 默认宽度 1.0：不设置 StrokeWidth 时描边很细。
- 宽度为 0：不绘制描边。
- StrokeColor 覆盖渐变：设置纯色后，之前的描边渐变被替换（反之亦然）。
- 绘制顺序：默认先填充后描边，可用 PaintOrder 调整（第 52 章）。
进阶练习
- 绘制一组同心圆，每圈描边宽度递增。
- 实现"霓虹灯"效果：粗描边 + 低透明度 + 细描边叠加。
