MFC自绘圆形按钮

已于 2022-07-20 13:45:34 修改
阅读量1.2k 收藏 13
点赞数
文章标签： c++ mfc
于 2022-03-02 16:16:43 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_34790664/article/details/123232950
版权

MFC自绘圆形按钮

说明

这部分的功能参照了Qt的部分自绘控件进行的相关设计，可以很大程度上的提升按钮的显示效果。主要是通过渐变色和颜色雾化处理的方法进行的操作，经过测试，该方法使用在圆形按钮上会有不错的效果，但是用在方形按钮上就会难看的要死。

效果展示

正常状态下的按钮
在这里插入图片描述
按钮按下后的效果
在这里插入图片描述

程序

#pragma once


// CRoundButton

class CRoundButton : public CButton
{
	DECLARE_DYNAMIC(CRoundButton)

public:
	CRoundButton();
	virtual ~CRoundButton();

protected:
	DECLARE_MESSAGE_MAP()
public:
	virtual void DrawItem(LPDRAWITEMSTRUCT /*lpDrawItemStruct*/);
	virtual void PreSubclassWindow();
	virtual void DrawOutRing(CDC* pDC, CRect &rct); //绘制外环
	virtual void DrawInRing(CDC* pDC, CRect &rct); //绘制内环
	virtual void DrawInterArea(CDC* pDC, CRect &rct); //绘制内部区域
	virtual void DrawFogArea(CDC* pDC, CRect &rct); //雾化部分区域
	
private:
	
	COLORREF ringBrush1, ringBrush2;         //环的两个颜色
	COLORREF m_normalBrush, m_activeBrush;  //正常颜色， 按下颜色
	bool pushState;  //按下状态
};


//CRoundButton.h
include "pch.h"
#include "MFCApplication9.h"
#include "CRoundButton.h"

// CRoundButton

IMPLEMENT_DYNAMIC(CRoundButton, CButton)

CRoundButton::CRoundButton()
{
	m_normalBrush = RGB(120, 120, 255);
	m_activeBrush = RGB(255, 120, 120);
	ringBrush1 = RGB(255, 255, 255);
	ringBrush2 = RGB(125, 125, 125);
	pushState = false;
}

CRoundButton::~CRoundButton()
{
}


BEGIN_MESSAGE_MAP(CRoundButton, CButton)
END_MESSAGE_MAP()



// CRoundButton 消息处理程序

 


void CRoundButton::DrawItem(LPDRAWITEMSTRUCT lpDrawItemStruct)
{
	// TODO:  添加您的代码以绘制指定项
	pushState = false;
	CDC* pDC = CDC::FromHandle(lpDrawItemStruct->hDC);
	int nSaveDC = pDC->SaveDC();//存储当前设备环境，以便绘图结束时恢复原来状态</span>
	CPen m_Pen(PS_SOLID,1,RGB(0,0,0));
	pDC->SelectObject(&m_Pen);//选择画笔
	CRect rct = lpDrawItemStruct->rcItem;//获取按钮矩形区域
	if (lpDrawItemStruct->itemState&ODS_SELECTED)//绘制按钮按下时的颜色
	{
		pushState = true;
	}
	DrawOutRing(pDC, rct);
	DrawInRing(pDC, rct);
	DrawInterArea(pDC, rct);
	DrawFogArea(pDC, rct);
	//pDC->Ellipse(&rct);//画椭圆按钮，这一步用了之前选择的画笔和画刷

	重绘字体
	//pDC->SetBkMode(TRANSPARENT);//重绘文本时不擦除背景即透明模式，如果选择OPAQUE（不透明），在文本四周有白色矩形边框，十分之难看
	CString strText{};//c++11版本以下不支持此方法
	GetWindowText(strText);//获取按钮文本
	pDC->SetBkMode(TRANSPARENT);
	pDC->DrawText(strText, rct, DT_CENTER | DT_VCENTER | DT_SINGLELINE);//重绘按钮文本

	//恢复设备环境
	pDC->RestoreDC(nSaveDC);
}


void CRoundButton::PreSubclassWindow()
{
	// TODO: 在此添加专用代码和/或调用基类

	
	ModifyStyle(0, BS_OWNERDRAW);//改为自绘风格
	CRgn rgn;
	CRect rct;
	GetClientRect(&rct);
	rgn.CreateEllipticRgnIndirect(&rct);//在按钮矩形内创建椭圆区域
	::SetWindowRgn(GetSafeHwnd(), (HRGN)rgn, true);//将椭圆区域应用到按钮上
	CButton::PreSubclassWindow();
}

void CRoundButton::DrawOutRing(CDC * pDC, CRect & rct) //绘制外环
{
	int nSaveDC = pDC->SaveDC();//存储当前设备环境，以便绘图结束时恢复原来状态</span>
	CDC dcBAK;
	CBitmap bitmap;
	dcBAK.CreateCompatibleDC(pDC);
	bitmap.CreateCompatibleBitmap(pDC, rct.Width(), rct.Height());
	CBitmap*poldbmp = dcBAK.SelectObject(&bitmap);
	COLORREF color1, color2;
	color1 = ringBrush1;
	color2 = ringBrush2;
	int r1 = color1 & 255, g1 = color1 >> 8 & 255, b1 = color1 >> 16 & 255;
	int r2 = color2 & 255, g2 = color2 >> 8 & 255, b2 = color2 >> 16 & 255;
	for (int i = 0; i < rct.Height(); i++)
	{
		
		int r, g, b;
		r = r1 + (i * (r2 - r1) / rct.Height());
		g = g1 + (i * (g2 - g1) / rct.Height());
		b = b1 + (i * (b2 - b1) / rct.Height());
		dcBAK.FillSolidRect(0, i, rct.Height(), 1, RGB(r, g, b));
	}
	CRgn rgn;
	rgn.CreateEllipticRgn(rct.left, rct.top, rct.right, rct.bottom);
	CBrush brush;
	brush.CreatePatternBrush(&bitmap);
	pDC->FillRgn(&rgn, &brush);
	//恢复设备环境
	pDC->RestoreDC(nSaveDC);
}

void CRoundButton::DrawInRing(CDC * pDC, CRect & rct)
{
	int nSaveDC = pDC->SaveDC();//存储当前设备环境，以便绘图结束时恢复原来状态</span>
	CDC dcBAK;
	CBitmap bitmap;
	
	dcBAK.CreateCompatibleDC(pDC);
	bitmap.CreateCompatibleBitmap(pDC, rct.Width(), rct.Height());
	CBitmap*poldbmp = dcBAK.SelectObject(&bitmap);
	
	COLORREF color1, color2;
	color1 = ringBrush2;
	color2 = ringBrush1;
	int r1 = color1 & 255, g1 = color1 >> 8 & 255, b1 = color1 >> 16 & 255;
	int r2 = color2 & 255, g2 = color2 >> 8 & 255, b2 = color2 >> 16 & 255;
	for (int i = 0; i < rct.Height(); i++)
	{

		int r, g, b;
		r = r1 + (i * (r2 - r1) / rct.Height());
		g = g1 + (i * (g2 - g1) / rct.Height());
		b = b1 + (i * (b2 - b1) / rct.Height());
		dcBAK.FillSolidRect(0, i, rct.Height(), 1, RGB(r, g, b));
	}
	CRect rct1;
	POINT point1, point2;
	point1.x = rct.left + rct.Width()*0.05;
	point1.y = rct.top + rct.Height()*0.05;
	point2.x = rct.right - rct.Width()*0.05;
	point2.y = rct.bottom - rct.Height()*0.05;
	rct1.SetRect(point1, point2);
	CRgn rgn;
	rgn.CreateEllipticRgn(rct1.left, rct1.top, rct1.right, rct1.bottom);
	CBrush brush;
	brush.CreatePatternBrush(&bitmap);
	pDC->FillRgn(&rgn, &brush);
	//恢复设备环境
	pDC->RestoreDC(nSaveDC);
}

void CRoundButton::DrawInterArea(CDC * pDC, CRect & rct)
{
	int nSaveDC = pDC->SaveDC();//存储当前设备环境，以便绘图结束时恢复原来状态</span>
	CBrush brush;
	if (pushState)
		brush.CreateSolidBrush(m_activeBrush);
	else
		brush.CreateSolidBrush(m_normalBrush);
	//brush.CreateSolidBrush(RGB(122, 122, 255));

	CRect rct1;
	POINT point1, point2;
	point1.x = rct.left + rct.Width()*0.1;
	point1.y = rct.top + rct.Height()*0.1;
	point2.x = rct.right - rct.Width()*0.1;
	point2.y = rct.bottom - rct.Height()*0.1;
	rct1.SetRect(point1, point2);
	CRgn rgn;
	rgn.CreateEllipticRgn(rct1.left, rct1.top, rct1.right, rct1.bottom);
	pDC->FillRgn(&rgn, &brush);
	//恢复设备环境
	pDC->RestoreDC(nSaveDC);
}

void CRoundButton::DrawFogArea(CDC * pDC, CRect & rct)
{
	int nSaveDC = pDC->SaveDC();//存储当前设备环境，以便绘图结束时恢复原来状态</span>
	CBrush brush;
	COLORREF color;
	if (pushState)
		color = m_activeBrush;
	else
		color = m_normalBrush;
	int r = color & 255, g = color >> 8 & 255, b = color >> 16 & 255;
	r = r + 10 > 255 ? 255 : r + 10;
	g = g + 10 > 255 ? 255 : g + 10;
	b = b + 10 > 255 ? 255 : b + 10;
	brush.CreateSolidBrush(RGB(r,g,b));

	CRect rct1;
	POINT point1, point2;
	point1.x = rct.left + rct.Width()*0.1;
	point1.y = rct.top + rct.Height()*0.1;
	point2.x = rct.right - rct.Width()*0.1;
	point2.y = rct.bottom - rct.Height()*0.1;
	rct1.SetRect(point1, point2);

	CRect rct2;
	POINT point3, point4;
	point3.x = rct.left + rct.Width()*0.1;
	point3.y = rct.top + rct.Height()*0.1;
	point4.x = (rct.right - rct.Width()*0.1)*2;
	point4.y = (rct.bottom - rct.Height()*0.1)*2.5;
	rct2.SetRect(point3, point4);
	CRgn rgn, rgn2;
	rgn2.CreateEllipticRgn(rct2.left, rct2.top, rct2.right, rct2.bottom);
	rgn.CreateEllipticRgn(rct1.left, rct1.top, rct1.right, rct1.bottom);
	rgn.CombineRgn(&rgn, &rgn2, RGN_DIFF);
	pDC->FillRgn(&rgn, &brush);
	//恢复设备环境
	pDC->RestoreDC(nSaveDC);
}

最后

目前的程序还比较简陋，使用的颜色的信息都是程序初始化给的颜色，如果需要自定义颜色，可以添加设置颜色的相关程序，一共设置四个颜色即可，其中外环的两个颜色不要做过大的改动，改动过大会影响显示的效果。

异想天开的余瑞银
关注
  • 0
    点赞
  • 踩
  • 13
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
【MFC】Button控件美化（自绘）
m0_72895175的博客
09-07 2287
在MFC中Button控件不能通过OnCtlColor（）函数对外观做太多的改变。欲设置按钮的背景为紫色，文字为红色，但是通过OnCtlColor（）函数并不能实现预期的结果为了能够修改Button控件字体、字体大小、背景色、背景图片，需要对Button控件进行自绘。
MFC 圆形按钮
wdk496986722的博客
02-07 1730
实现自绘界面中已有按钮控件为圆形按钮参考网络一些大佬的资料，整理了篇学习记录，保存一下！
MFC实现按钮自绘
StarWang的博客
09-29 972
【代码】MFC实现按钮自绘。
VS 2019 MFC 圆形按钮指示灯继承CButton类自绘例程
lzc881012的博客
02-16 1546
例程图片 继承类H文件 #pragma once class CRoundButton : public CButton { DECLARE_DYNAMIC(CRoundButton) public: CRoundButton(); virtual ~CRoundButton(); protected: DECLARE_MESSAGE_MAP() public: virtual void DrawItem(LPDRAWITEMSTRUCT /*lpDrawItemS...
MFC自绘按钮
qq_33012981的博客
05-20 2441
1.建立一个基于对话框的程序2.在这里，我是将确定按钮重绘，拉大确定按钮修改为自绘3.添加位图文件ID为IIDB_BITMAP14.添加类CMYButton基类为CButton后面两个函数是我自己添加的，其中DrawItem函数在基类中为虚函数，我们在派生类中重载，负责按钮的绘制void CMYButton::DrawItem(LPDRAWITEMSTRUCT lpDrawItemStruct) ...
【MFC开发（4）】按钮控件BUTTON
Demo.demo的博客
05-03 4876
【MFC开发（4）】按钮控件BUTTON
自绘按钮的实现
rollor_phoe的专栏
05-29 801
自绘按钮的实现如果你希望能够在自己的程序中表现出新意，那么你一定不会仅仅满足于MFC提供那些标准控件。这时，我们就必须自己另外多做些工作了。就改变控件外观这一点来说，主要是利用控件的自绘功能（Owner Draw）实现的。本篇将和各位一起定义一个XP风格的CXPButton按钮类，目的不在于介绍CXPButton类的使用技巧，而在于向各位阐述实现自绘按钮的方法。当然如果你觉得CXPButton有用
mfc 自绘控件 圆形button
10-27
然而，通过自绘控件，我们可以突破这一限制，实现更具个性化的圆形按钮。自绘控件是指程序员通过重写控件的OnDraw()函数，自行控制控件的绘制过程，从而实现非标准外观的效果。本主题将深入探讨如何在MFC中创建一个...
自绘圆形按钮
01-18
本示例中，我们探讨的是如何在MFC（Microsoft Foundation Classes）框架下创建一个“自绘圆形按钮”。MFC是微软提供的一个C++库，用于简化Windows应用程序开发。下面我们将详细解释如何实现这个“自绘圆形按钮”。 ...
MFC实现漂亮界面之美化按钮
08-26
MFC实现漂亮界面之美化按钮 MFC实现漂亮界面之美化按钮是指在MFC中使用按钮控件美化对话框界面...MFC实现漂亮界面之美化按钮需要使用Owner Draw模式、继承CButton类、使用PNG格式的图片和自绘制函数来实现按钮的美化。
MFC自绘Button按钮分析和实现
12-31
对于按压式的Button按钮，WM_CTLCOLOR无法完成按钮控件的背景颜色和字体颜色修改，若想要完成外观定制需要添加WM_DRAWITEM消息或者重写CButton类中的DrawItem函数完成按钮外观修改，下面逐一介绍。 自绘制知识基础 自绘制需要的两个基础步骤： 1.控件类型设置为 BS_OWNERDRAW 2.添加WM_DRAWITEM消息响应函数或者重写DrawItem函数。 WM_DRAWITEM消息响应原型如下： afx_msg void OnDrawItem( int nIDCtl, LPDRAWITEMSTRUCT lpDrawItemStruct ); 参数： nID
圆形按钮VC源代码
03-15
圆形按钮源代码,支持椭圆! 关键字：round button,圆形按钮,椭圆形
vc++圆形按钮源代码
06-24
圆形按钮， 源代码，有一个简单的实例，你可以用这个类来设计圆形按钮。
MFC重绘Button为圆形。
01-14
MFC中重绘Button为圆形Button,可以修改背景颜色、文本颜色、边框颜色等。
MFC重载Button实现圆形按钮 椭圆按钮类
09-11
在这个特定的情况下，我们讨论的是如何重载MFC中的标准按钮控件，即CButton类，以实现自定义形状的按钮，如圆形或椭圆形。 MFC中的CButton类是Windows API中常见按钮控件的封装，通常显示为矩形。然而，为了满足...
MFC中画出圆形按钮，告别方形普通按钮
weixin_43186817的博客
07-10 999
感谢大神分享，特别详细的内容，画出来啦！！！ 如何在MFC上画出圆形按钮
MFC Button控件自绘
cai_huan_123的专栏
12-20 404
   VC下的界面着实难看 有时候我们不得不自己进行控件的绘制 以前 一直不理解最近再次看了学了一遍终于明白了一点   与大家分享下...       需要源代码的Q我 寻找一起学VC的朋友    比如说   我们要改变一个编辑框的背景 我们响应WM_CTLCOLOR函数 进行OnCtlColor进行修改但是对与 Button控件就不行了 ..   这时候我们要进行自绘制    相关函数   ...
MFC无标题栏自绘对话框可拖动按钮三态仿QQ弹窗样式
panshiqu的专栏
08-13 3742
看我前几天的bolg我实现了右下角弹窗功能，但是怎么美化自己的弹窗呢，像腾讯QQ右下角弹腾讯大豫网新闻那样的样式。     首先感谢一篇重要的文章：http://bbs.csdn.net/topics/390170722   作者：邓学彬     但是也需要指出的大凡已经很牛的人，对初学者的求助往往是漠不关心的，我对他文章的回复至今还没有回我的问题，我给的留言也没有收到回音，为什么要感谢他，
MFC Button控件自绘制----详细讲解
weixin_33845477的博客
05-05 157
VC下的界面着实难看 有时候我们不得不自己进行控件的绘制 以前 一直不理解最近再次看了学了一遍终于明白了一点   与大家分享下...       需要源代码的Q我 寻找一起学VC的朋友     比如说 我们要改变一个编辑框的背景 我们响应WM_CTLCOLOR函数 进行OnCtlColor进行修改但是对与 Button控件就不行了 ..      这时候我们要进行自绘制    相关函数   v...
MFC创建圆角矩形按钮
最新发布
05-31
在 MFC 中创建圆角矩形按钮，可以使用 `CButton` 类的派生类，自定义绘制函数来实现。下面是一份示例代码： 1. 创建一个自定义按钮类 `CRoundRectButton` ```c++ class CRoundRectButton : public CButton { public: CRoundRectButton(); virtual ~CRoundRectButton(); protected: virtual void DrawItem(LPDRAWITEMSTRUCT lpDrawItemStruct); }; ``` 2. 在 `CRoundRectButton` 类中实现 `DrawItem` 函数，用于绘制圆角矩形按钮 ```c++ void CRoundRectButton::DrawItem(LPDRAWITEMSTRUCT lpDrawItemStruct) { CDC* pDC = CDC::FromHandle(lpDrawItemStruct->hDC); CRect rect = lpDrawItemStruct->rcItem; if (lpDrawItemStruct->itemState & ODS_SELECTED) // 按下状态 { pDC->FillSolidRect(rect, ::GetSysColor(COLOR_BTNFACE)); pDC->DrawEdge(rect, EDGE_SUNKEN, BF_RECT); } else // 正常状态 { pDC->FillSolidRect(rect, ::GetSysColor(COLOR_BTNFACE)); pDC->DrawEdge(rect, EDGE_RAISED, BF_RECT); } // 绘制圆角矩形 int nRound = 10; // 圆角大小 CRect roundRect(rect.left + 2, rect.top + 2, rect.right - 2, rect.bottom - 2); pDC->RoundRect(roundRect, CPoint(nRound, nRound)); } ``` 3. 在对话框类中添加 `CRoundRectButton` 控件，并设置样式 ```c++ CRoundRectButton m_btnRound; m_btnRound.Create(_T("圆角按钮"), WS_CHILD | WS_VISIBLE | BS_OWNERDRAW, CRect(50, 50, 150, 80), this, IDC_BTN_ROUNDRECT); ``` 在上面的代码中，`m_btnRound` 是一个 `CRoundRectButton` 类的对象，通过 `Create` 函数创建一个圆角矩形按钮，并设置样式为 `WS_CHILD | WS_VISIBLE | BS_OWNERDRAW`，其中 `BS_OWNERDRAW` 表示该按钮使用自定义绘制函数。 运行程序后即可看到一个圆角矩形按钮。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值