GDI+绘制圆角矩形

1、最近，用到GDI+绘图，但是发现没有绘制圆角矩形的函数，故自己写了一个。下面贴出原理和代码，以作备份。

2、要绘制圆角矩形，基础是普通的直角矩形，需要做的就是将直角画成弧形。

3、绘制圆角矩形可以由两个部分组成：第一部分是绘制四个圆角（左上、右上、右下、左下）；第二部分是用直线连接四个圆角。

4、绘制第一部分用到Graphics.DrawArc 方法：

本例用到的是下面这个重载函数：

Graphics.DrawArc 方法 (Pen, Single, Single, Single, Single, Single, Single)

定义如下：

public:void DrawArc(Pen^ pen, float x, float y, float width, float height, float startAngle, float sweepAngle)

参数说明：

参数penPen，它确定弧线的颜色、宽度和样式。x定义椭圆的矩形的左上角的 x 坐标。y定义椭圆的矩形的左上角的 y 坐标。width定义椭圆的矩形的宽度。height定义椭圆的矩形的高度。startAngle从 x 轴到弧线的起始点沿顺时针方向度量的角（以度为单位）。sweepAngle从 startAngle 参数到弧线的结束点沿顺时针方向度量的角（以度为单位）。

5、第二部分用到Graphics.DrawLine 方法：

本例用到的是下面这个重载函数：

Graphics.DrawLine 方法 (Pen, Single, Single, Single, Single)

定义如下：

public:void DrawLine (Pen^ pen, float x1, float y1, float x2, float y2)

参数说明：

参数penPen，它确定线条的颜色、宽度和样式。x1第一个点的 x 坐标。y1第一个点的 y 坐标。x2第二个点的 x 坐标。y2第二个点的 y 坐标。

6、具体绘制，先看一张图：

说明：

首先，大矩形即是我们要画的矩形（图中是直角的，要将其画成圆角），大矩形的4个角上各有一个小矩形，这4个小矩形即是用来画圆角的。

其次，用DrawArc画圆角，因为矩形相邻两边是垂直的，所以绘制的圆弧必须是90度的，也就是参数sweepAngle必须是90度。

再次，图中标出的4个红点的坐标即是DrawArc函数定义的椭圆的矩形的左上角的坐标。

由上可知，绘制圆角矩形需要几个值：

一是矩形左上角的坐标，即图中的（x，y）；

二是4个红点的坐标。

三是蓝点的坐标（用于画连接圆角的直线，即矩形的边）。

7、具体代码：

函数声明：

////////////////////////////////////////////////////////////////////////////////////------------------------------------ 绘制圆角矩形-------------------------------// 作者：Kaven// 创建时间：2014.07.08// 参数：//     pDC：     设备环境//     x:        矩形的起点横坐标（即矩形左上角的横坐标x）//     y:        矩形的起点纵坐标（即矩形左上角的纵坐标y）//     Width：   矩形的宽度（halfWidth表示矩形宽度的一半）//     Height：  矩形的高度（halfHeight表示矩形高度的一半）//     arcSize:  调整圆角的弧度（0时弧度最大，为椭圆）//     lineColor:线条颜色//     lineWidth：线条宽度/////////////////////////////////////////////////////////////////////////////////void DrawRoundRectange(CDC* pDC, float x, float y, float Width, float Height, float arcSize, Color lineColor, float lineWidth);

函数定义：

// 绘制圆角矩形void DrawRoundRectange(CDC* pDC, float x, float y, float Width, float Height, float arcSize, Color lineColor, float lineWidth){// 圆角矩形的半宽（hew）和半高（heh）float hew = Width/arcSize/2;float heh = Height/arcSize/2;// 圆角修正if(fabs(hew-heh)>10){hew = heh = hew>heh ? heh : hew;}// 边线修正int lineMove = 1;// 创建GDI+对象Graphics  g(pDC->GetSafeHdc());//设置画图时的滤波模式为消除锯齿现象g.SetSmoothingMode(Gdiplus::SmoothingModeHighQuality);//创建画笔Pen pen(lineColor, lineWidth);//////////////////////////////////////////////////////////////////////////// 画圆角//////////////////////////////////////////////////////////////////////////// 画左上圆角g.DrawArc(&pen, x, y, 2*hew, 2*heh, 180, 90);// 画右上圆角g.DrawArc(&pen, x+Width-2*hew, y, 2*hew, 2*heh, 270, 90);// 画右下圆角g.DrawArc(&pen, x+Width-2*hew, y+Height-2*heh, 2*hew, 2*heh, 0, 90);// 画左下圆角g.DrawArc(&pen, x, y+Height-2*heh, 2*hew, 2*heh, 90, 90);//////////////////////////////////////////////////////////////////////////// 画直线（连接4个圆角）//////////////////////////////////////////////////////////////////////////// 画顶部横线g.DrawLine(&pen, x+hew-lineMove, y, x+Width-hew+lineMove, y);// 画右侧竖线g.DrawLine(&pen, x+Width, y+heh-lineMove, x+Width, y+Height-heh+lineMove);// 画底部横线g.DrawLine(&pen, x+Width-hew+lineMove, y+Height, x+hew-lineMove, y+Height);// 画左侧竖线g.DrawLine(&pen, x, y+Height-heh+lineMove, x, y+heh-lineMove);}

调用示例：

CDC *pDC = GetWindowDC();DrawRoundRectange(pDC, 10, 100, 348, 60, 2, Color(255,0,0,0), 14);DrawRoundRectange(pDC,100.2, 40.5, 45.4, 22.8, 6.34, Color(255,255,0,0), 2);DrawRoundRectange(pDC, 35, 250, 60, 60, 2, Color(255,0,0,0), 4);DrawRoundRectange(pDC, 400, 50, 60, 260, 2, Color(255,0,0,0), 3);ReleaseDC(pDC);

结果：

最后，实例代码：http://download.csdn.net/detail/wwkaven/7609287

另外，GDI+的使用参阅：http://blog.csdn.net/wwkaven/article/details/37507209

注意：追加内容：

优化上述函数：

声明：

        ////////////////////////////////////////////////////////////////////////////////////------------------------------------ 绘制圆角矩形-------------------------------// 作者：Kaven// 创建时间：2014.07.08// 参数：//     pDC：      设备环境//     x:         矩形的起点横坐标（即矩形左上角的横坐标x）//     y:         矩形的起点纵坐标（即矩形左上角的纵坐标y）//     Width：    矩形的宽度（halfWidth表示矩形宽度的一半）//     Height：   矩形的高度（halfHeight表示矩形高度的一半）//     arcSize:   调整圆角的弧度（0时弧度最大，为椭圆）//     lineColor: 线条颜色//     lineWidth：线条宽度//     fillPath； 是否填充//     fillColor：填充颜色/////////////////////////////////////////////////////////////////////////////////void DrawRoundRectange(CDC* pDC, float x, float y, float Width, float Height, float arcSize, Color lineColor, float lineWidth, bool fillPath, Color fillColor);

定义：

// 绘制及填充圆角矩形void DrawRoundRectange(CDC* pDC, float x, float y, float Width, float Height, float arcSize, Color lineColor, float lineWidth, bool fillPath, Color fillColor){// 小矩形的半宽（hew）和半高（heh）float hew = Width/arcSize/2;float heh = Height/arcSize/2;// 圆角修正if(fabs(hew-heh)>10){hew = heh = hew>heh ? heh : hew;}// 创建GDI+对象Graphics  g(pDC->GetSafeHdc());//设置画图时的滤波模式为消除锯齿现象g.SetSmoothingMode(Gdiplus::SmoothingModeHighQuality);// 绘图路径GraphicsPath roundRectPath;// 保存绘图路径roundRectPath.AddLine(x+hew, y, x+Width-hew, y);  // 顶部横线roundRectPath.AddArc(x+Width-2*hew, y, 2*hew, 2*heh, 270, 90); // 右上圆角roundRectPath.AddLine(x+Width, y+heh, x+Width, y+Height-heh);  // 右侧竖线roundRectPath.AddArc(x+Width-2*hew, y+Height-2*heh, 2*hew, 2*heh, 0, 90); // 右下圆角roundRectPath.AddLine(x+Width-hew, y+Height, x+hew, y+Height);  // 底部横线roundRectPath.AddArc(x, y+Height-2*heh, 2*hew, 2*heh, 90, 90); // 左下圆角roundRectPath.AddLine(x, y+Height-heh, x, y+heh);  // 左侧竖线roundRectPath.AddArc(x, y, 2*hew, 2*heh, 180, 90); // 左上圆角//创建画笔Pen pen(lineColor, lineWidth);// 绘制矩形g.DrawPath(&pen, &roundRectPath);// 是否填充if(!fillPath){return;}else if(fillColor.GetAlpha() == 0){fillColor = lineColor; // 若未指定填充色，则用线条色填充}// 创建画刷SolidBrush brush(fillColor);// 填充g.FillPath(&brush, &roundRectPath);}

调用示例：

DrawRoundRectange(pDC, 10, 100, 348, 60, 2, Color(255,0,0,0), 14, true , Color(255,255,255,0)); DrawRoundRectange(pDC, 10, 200, 348, 60, 4, Color(255,0,0,0), 4, true , Color(255,0,0,0)); DrawRoundRectange(pDC, 10.2, 40.5, 145.4, 22.8, 2.34, Color(255,255,0,0), 2, true, NULL);DrawRoundRectange(pDC, 210.2, 40.5, 145.4, 22.8, 2.34, Color(255,255,0,0), 2, true, Color(255,255,182,0));

结果：

完整示例工程：http://download.csdn.net/detail/wwkaven/7610005