从零开始学习GDI+ （一）我的第一个GDI+程序

前言：

GDI+从Windows XP操作系统（大概2002-2003年）开始引入的，现在都9102年了，再学习这么古老的技术肯定是过时了。windows桌面程序没落了，随着移动的兴起，用户被惯坏了，现在，用户对界面的要求不只是可以用，

而且天生（自发、自然而然）的希望界面能够顺滑、流畅、微动画、抽屉效果、淡入淡出等等。使用GDI+去实现这些高端的界面需求是十分困难而工作量巨大的。因此，建议转前端学习html5，跨平台，效果又炫。如果硬要在windows

上开发，可以关注下NUI（natural user interface）。

那，我为什么仍然写这个博客呢。额，一言难尽，个人目前面临转型的困难。一直都在windows平台上开发与工作，去转个前端新手肯定不太乐意。而且，也没系统得学习过GDI+，觉得花一个月系统学习下还是值得的吧。人，

往往想的太多，做的太少。写这个系列也为了督促自己。如果对他人有益就更好了。

我接触GDI+是因为最近的两个需求，项目是基于网易云信Duilib开发的。

一个是圆角矩形（GDI+抗锯齿比较好） github：https://github.com/netease-im/NIM_Duilib_Framework/pull/98

另外个是圆形进度条。 github：https://github.com/netease-im/NIM_Duilib_Framework/pull/105

ok，废话不多说，开始学习吧。（本文的源码可以参考github：https://github.com/xuhuajie-NetEase/GDI-Study/）

GDI+ 提供二维的矢量图形，改进旧有的GDI，加强的可视化属性，例如边界，渐变和透明。通过GDI+，能够直接将BMP转成JPG或其它格式的图片，还能够生成SVG、Flash等。GDI+ 使用ARGB的值来表示颜色。GDI+的双缓

冲技术可以提高绘图效率，可避免屏幕闪烁。关于GDI的详细使用可以参考《windows程序设计》一书，该书非常的有质量。也是我从事windows客户端开发的启蒙书。最重要的就是DC的概念（一般翻译成设备上下文），通过往DC里

面加画笔、画刷、字体等等元素，然后就可以画画了。对，整个窗口（准确的说是窗口有效区域【额，更准确的说是刷新区域】）可以理解为一张画布，你可以通过DC（提前准备好笔【粗细、颜色】）然后在合适的位置做画。GDI+

最重要的概念则是Graphics对象（所以这个UI模型称为GUI，注意与目前流行的NUI的区别），再新建额外的笔（pen）对象，通过Graphics去画画。

void GDIDrawLine(HDC hdc)
{
HPEN hPen, hPenOld;
hPen = CreatePen(PS_SOLID,3,RGB(255,0,0));
hPenOld=(HPEN)::SelectObject(hdc, hPen); //往DC放画笔对象
::MoveToEx(hdc, 50, 50, NULL);
::LineTo(hdc, 700, 50);
::SelectObject(hdc, hPenOld); //这是个好习惯
::DeleteObject(hPen); //释放画笔
hPen = CreatePen(PS_SOLID, 3, RGB(0, 255, 0));
hPenOld = (HPEN)::SelectObject(hdc, hPen); //往DC放画笔对象
::MoveToEx(hdc, 50, 100, NULL);
::LineTo(hdc, 700, 100);
::SelectObject(hdc, hPenOld); //这是个好习惯
::DeleteObject(hPen); //释放画笔
}

void GDIPlusDrawLine(HDC hdc)
{
Graphics graphics(hdc);
Pen blue(Color(255/*不透明*/, 255, 0, 0), 3);
graphics.DrawLine(&blue, 50, 150, 700, 150);
Pen green(Color(255/*不透明*/, 0, 255, 0), 3);
graphics.DrawLine(&green, 50, 200, 700, 200);
}

如上可见，GDI+对于复杂地绘画，逻辑简单了很多，GDI的DC与各类绘画工具强绑定，而 GDI+则取消了这种关联。

我们先来简单的试试吧。1、打开vs工具，新建一个窗口程序（win32），点击确定。再点击完成。

2、在cpp上加上引用项与库文件

#include <objidl.h>
#include <gdiplus.h> 
#pragma comment(lib, "gdiplus.lib")  
using namespace Gdiplus;

3、在合适地方加上GDI+的初始化

    // Initialize GDI+  
    GdiplusStartupInput gdiplusStartupInput;
    ULONG_PTR gdiplusToken;
    GdiplusStartup(&gdiplusToken, &gdiplusStartupInput, NULL);

4、在WM_PAINT方法下面非常加上GDI与GDI+的函数

5、编译运行看下效果吧。

从零开始学习GDI+ （一） 我的第一个GDI+程序

从零开始学习GDI+ （一）我的第一个GDI+程序