1. 项目背景与核心需求在Windows平台开发中GDIGraphics Device Interface作为经典图形绘制接口已经存在了近30年。虽然现代UI框架层出不穷但在某些特定场景下直接使用GDI绘制原生控件仍具有独特优势。最近我接到的需求是开发一个轻量级的作业协同界面经过技术选型后最终决定采用纯GDI方案实现。这个协同界面需要满足以下核心功能实时显示多用户操作痕迹光标位置、编辑区域支持基础文档标注工具矩形、箭头、高亮低延迟的视图同步每秒15帧以上更新兼容Windows 7及以上系统选择GDI主要基于三点考虑首先是系统级兼容性其次是绘制性能足够满足业务需求最重要的是可以完全掌控绘制逻辑避免第三方框架带来的依赖问题。2. GDI技术方案设计2.1 基础架构设计整个界面采用经典的MVC模式class CollaborationView { public: void Render(HDC hdc); // 主绘制入口 void UpdateCursorPos(int userId, POINT pt); void AddAnnotation(AnnotationType type, RECT rect); private: std::vectorUserCursor m_cursors; // 用户光标集合 std::vectorAnnotation m_annotations; // 标注对象集合 CRITICAL_SECTION m_cs; // 多线程保护 };关键设计要点使用双缓冲技术避免闪烁独立线程处理网络消息区域刷新代替全屏重绘2.2 核心绘制逻辑实现用户光标绘制采用异或模式实现高亮效果void DrawUserCursor(HDC hdc, const UserCursor cursor) { SetROP2(hdc, R2_XORPEN); SelectObject(hdc, GetStockObject(BLACK_PEN)); MoveToEx(hdc, cursor.pos.x - 10, cursor.pos.y, NULL); LineTo(hdc, cursor.pos.x 10, cursor.pos.y); MoveToEx(hdc, cursor.pos.x, cursor.pos.y - 10, NULL); LineTo(hdc, cursor.pos.x, cursor.pos.y 10); }标注工具的实现则更复杂些需要处理多种绘制模式void DrawAnnotation(HDC hdc, const Annotation anno) { switch (anno.type) { case RECTANGLE: Rectangle(hdc, anno.rect.left, anno.rect.top, anno.rect.right, anno.rect.bottom); break; case HIGHLIGHT: SetBkMode(hdc, TRANSPARENT); SetTextColor(hdc, RGB(255,255,0)); // 高亮绘制逻辑... break; } }3. 性能优化关键点3.1 脏矩形算法实现通过跟踪界面变化区域只重绘受影响的部分void CollaborationView::Render(HDC hdc) { CRect dirtyRect CalculateDirtyArea(); if (dirtyRect.IsRectEmpty()) return; HDC memDC CreateCompatibleDC(hdc); HBITMAP bmp CreateCompatibleBitmap(hdc, dirtyRect.Width(), dirtyRect.Height()); SelectObject(memDC, bmp); // 仅绘制脏区域 OffsetViewportOrgEx(memDC, -dirtyRect.left, -dirtyRect.top, NULL); DoRender(memDC); BitBlt(hdc, dirtyRect.left, dirtyRect.top, dirtyRect.Width(), dirtyRect.Height(), memDC, 0, 0, SRCCOPY); DeleteObject(bmp); DeleteDC(memDC); }3.2 对象分层绘制策略将界面元素分为三个绘制层级背景层文档内容标注层用户绘制内容光标层实时操作反馈每层使用独立的内存DC根据变更频率决定重绘策略背景层仅在文档变更时更新标注层增量更新光标层每帧更新4. 实际开发中的经验总结4.1 必须注意的GDI资源管理GDI对象泄漏是常见问题建议采用RAII包装class GDIObjGuard { public: GDIObjGuard(HGDIOBJ obj) : m_obj(obj) {} ~GDIObjGuard() { if(m_obj) DeleteObject(m_obj); } private: HGDIOBJ m_obj; }; // 使用示例 void Demo() { HBITMAP bmp CreateBitmap(100, 100, 1, 32, NULL); GDIObjGuard guard(bmp); // 自动释放 // ...其他操作 }4.2 多线程同步的实践方案界面更新与网络接收分属不同线程推荐方案使用临界区保护共享数据通过PostMessage通知UI线程更新批量处理网络消息减少锁竞争// 网络线程 void NetworkThread() { while(running) { Message msg RecvMessage(); EnterCriticalSection(m_cs); m_messages.push_back(msg); LeaveCriticalSection(m_cs); PostMessage(hWnd, WM_UPDATE_UI, 0, 0); } } // UI线程 LRESULT OnUpdateUI() { std::vectorMessage temp; EnterCriticalSection(m_cs); temp.swap(m_messages); LeaveCriticalSection(m_cs); for (auto msg : temp) { ProcessMessage(msg); } InvalidateRect(hWnd, NULL, FALSE); return 0; }5. 典型问题排查指南5.1 界面闪烁问题可能原因及解决方案未使用双缓冲 → 实现内存DC绘制背景擦除引起 → 处理WM_ERASEBKGND消息频繁全屏重绘 → 实现脏矩形算法5.2 绘制性能瓶颈性能优化检查清单使用GetStockObject替代频繁创建/销毁GDI对象减少SelectObject调用次数复杂路径采用BeginPath/EndPath批量处理文本绘制使用DrawText而非TextOut5.3 高DPI适配方案现代显示器需要支持缩放void InitDPIScaling() { typedef UINT (WINAPI* GetDpiForWindowFunc)(HWND); auto pGetDpiForWindow (GetDpiForWindowFunc) GetProcAddress(GetModuleHandle(user32), GetDpiForWindow); if (pGetDpiForWindow) { UINT dpi pGetDpiForWindow(hWnd); m_scale dpi / 96.0f; } } int Scale(int value) { return static_castint(value * m_scale); }6. 扩展功能实现思路6.1 实时光标追踪增强为不同用户分配颜色标识COLORREF GetUserColor(int userId) { static COLORREF palette[] { RGB(255,0,0), RGB(0,255,0), RGB(0,0,255), RGB(255,255,0), RGB(0,255,255) }; return palette[userId % _countof(palette)]; }添加用户名称标签void DrawUserName(HDC hdc, POINT pt, const string name) { SetBkMode(hdc, TRANSPARENT); TextOut(hdc, pt.x 15, pt.y - 8, name.c_str(), name.length()); }6.2 标注持久化方案实现标注序列化struct AnnotationHeader { int version; int count; // 其他元数据... }; void SaveAnnotations(const string path) { ofstream file(path, ios::binary); AnnotationHeader header{1, (int)m_annotations.size()}; file.write((char*)header, sizeof(header)); file.write((char*)m_annotations.data(), m_annotations.size() * sizeof(Annotation)); }7. 与现代技术栈的整合虽然采用传统GDI实现但仍可与现代技术结合7.1 与WebSocket集成使用libwebsockets实现实时通信void OnWebSocketReceive(const char* msg) { Json::Value root; Json::Reader reader; if (reader.parse(msg, root)) { int userId root[user].asInt(); int x root[x].asInt(); int y root[y].asInt(); PostMessage(hWnd, WM_UPDATE_CURSOR, userId, MAKELPARAM(x, y)); } }7.2 硬件加速后备方案当性能不足时可部分采用Direct2Dvoid CreateD2DResources() { D2D1_FACTORY_OPTIONS options; options.debugLevel D2D1_DEBUG_LEVEL_INFORMATION; D2D1CreateFactory(D2D1_FACTORY_TYPE_SINGLE_THREADED, options, m_pD2DFactory); m_pD2DFactory-CreateHwndRenderTarget( D2D1::RenderTargetProperties(), D2D1::HwndRenderTargetProperties(hWnd, size), m_pRT); } void DrawWithD2D() { m_pRT-BeginDraw(); // D2D绘制命令... m_pRT-EndDraw(); }这个项目给我的深刻体会是技术选型需要权衡多方因素传统技术在现代场景中经过合理设计依然可以焕发强大生命力。特别是在需要深度定制的场景下直接使用系统级API反而能获得更好的控制力和性能表现。