简介一份以MFC自绘技术为核心的CListCtrl控件示例源码适合有一定Windows界面开发经验、希望摆脱系统默认外观的程序员。资源基于CListCtrl与CHeaderCtrl两个关键控件给出从自绘Item、列头到网格线的完整实现思路覆盖LVS_OWNERDRAWFIXED风格、OnDrawItem/OnDrawColumnHeader重载、LVN_DRAWITEM消息处理以及CDC绘图等核心环节便于读者快速理解自绘控件的运行机制并将这些技巧迁移到实际项目中。压缩包共22个文件包含7个头文件、6个C源文件、2个位图及图标文件另有资源脚本、工程文件和说明文档整体仅49KB结构精简、便于直接编译学习。该示例已获得749人浏览学习对于想掌握自绘控件细节、优化表格界面视觉效果的MFC开发者是一份直观且可运行的参考代码。 第一次把 CListCtrl 放上对话框时我差点以为工程哪里配错了白底黑字选中一条就是一大块浅蓝鼠标只要点一下旁边按钮那条选中的记录立刻变成灰蒙蒙的像被禁用了一样。很多做 MFC 界面的人都有过这个经历搜来绕去逃不开三个词CListCtrl、MFC、自绘制。这篇文章把我在这条路上的完整实践写下来从自绘机制选型、失焦变灰的处理到可以直接抄的 DrawItem 核心代码以及表头、复选框这些连带问题一并讲清楚。适合被列表控件丑到头疼的上位机和桌面工具开发者也适合刚接触 MFC 自绘、想找一份能直接跑通的源码参考的朋友。1. 默认CListCtrl的观感问题为什么非自绘不可1.1 系统绘制只保证“可读”不保证“好看”默认的 CListCtrl 在不同 Windows 主题下表现差异很大。经典主题下字体偏小、行间距紧凑到了新系统上又被主题强制套了一层样式跟软件整体风格往往对不上。更麻烦的是它的高亮逻辑控件有焦点时用 COLOR_HIGHLIGHT 的蓝色失焦后立刻换成灰色。对数据类界面来说这几乎等于让用户找不到当前操作的数据行所以很多需求单上会直接写“选中后要保持蓝色”。表格是窗口里最常用的信息容器一个界面好不好看列表占了一半观感。默认控件能完成“点击、选中、滚轮”这些基本交互但离“能直接放进正式产品”还有很长的距离。自绘不是炫技而是 CListCtrl 这类老控件在产品化过程中绕不开的一步。1.2 三个常见硬伤失焦高亮不稳定这是搜索“丢去焦点变灰”的来源后面单独用一整章来讲。文字排版受限行高默认由字体决定想给行内加一点内边距非常难。传统做法是用一张透明位图放进 ImageList 去撑行高很别扭。网格和底色单调没有交替底色没有悬停变化视觉上完全没有层次。界面里没有对比用户就会觉得“死板”。看到这里你可能会想能不能先用 NM_CUSTOMDRAW 简单改个色答案是能。但一旦要画的东西多起来比如加图标、改行高、给选中行画一个高亮边框CustomDraw 那套“通知 返回标记”的逻辑会变得很绕。这时候就该 LVS_OWNERDRAWFIXED 登场了。2. 自绘方案选型DrawItem 与 CustomDraw 到底选谁2.1 两种机制的核心差异自绘 CListCtrl 有两条主流路线OwnerDrawLVS_OWNERDRAWFIXED DrawItem以及 CustomDrawNM_CUSTOMDRAW 通知。两者不是替代关系更多是“精度”和“自由度”的取舍。对比项DrawItem 自绘NM_CUSTOMDRAW触发方式每行绘制时调用虚函数 DrawItem绘制过程中不断向父窗口发送通知控制粒度整行级别第一列最自由可精确到每个子项学习门槛需要完全自己画文本和图标只要改颜色、字体时很轻松典型场景做个性化皮肤、统一背景、图标的列表简单换色、热跟踪、列文字差异化子项处理第二列以后需要自己想办法CDDS_SUBITEM 阶段直接处理如果目标只是“选中行换一个颜色”CustomDraw 就够了。但如果目标是“整行的背景、圆角、图标、文字全部自己控制”DrawItem 更合适。我在项目里一般用混合方案DrawItem 负责整行背景、图标和第一列文字NM_CUSTOMDRAW 只处理第二列以后的文字颜色和字体。2.2 混合方案的渲染顺序DrawItem 先执行把整行背景、图标、第一列文本画完后续列交给 CustomDraw 系统绘制时它会把每个子项的文字背景再填一遍。这里容易踩坑CustomDraw 里设置的 clrTextBk 如果和 DrawItem 里画的整行背景色不一致文字周围就会多出一块“文字底”。所以混合方案里要么 CustomDraw 的 clrTextBk 严格复制 DrawItem 的背景颜色要么干脆不在 CustomDraw 里设置背景色只改文字颜色。试下来最省心的做法是DrawItem 里按“选中、交替行、默认行”三种状态定好背景色CustomDraw 里取同样逻辑只把 clrTextBk 设成相同值。这样视觉上是连续的代码也不复杂。3. 失焦变灰与“取消全部选中”的根治方案3.1 灰色的本质是“焦点判断”不是“状态丢失”很多人遇到失焦变灰第一反应是去查 LVIS_SELECTED 状态是不是丢了。其实状态一直在只是系统默认绘制规则把“控件有焦点”当成了高亮的前提条件。你点旁边的按钮列表失焦系统就自动把选中行的底色从蓝色换成灰色。解决思路很简单把绘制高亮色的判断条件从“控件有焦点”换成“程序窗口是否处于激活状态”。如果程序本身还激活着只是焦点跑到其他控件上选中行保持蓝色只有整个程序切到后台时才用淡蓝色弱化一下。自绘的意义就在这里——高亮的决定权回到你手上。这里给出一段参考逻辑BOOL bActive (::GetActiveWindow() ! NULL) (::IsWindowEnabled(m_hWnd)); COLORREF crBk bSelected ? (bActive ? RGB(51, 153, 255) : RGB(166, 202, 240)) : RGB(255, 255, 255);以这个背景色为基准在 DrawItem 里用 FillSolidRect 填充整行就能绕开系统的失焦灰色逻辑。3.2 清除所有选中行的正确姿势CListCtrl 没有内置的“取消所有选中”接口需要自己遍历。网上常见的做法是循环 SetItemState但直接这么写经常会遇到问题如果列表监听了 LVN_ITEMCHANGED遍历过程中每改一行都会触发一次通知如果通知里又做了刷新就会出现递归或者界面闪烁。解决办法是加一个保护标志。完整实现如下void CMyListCtrl::ClearAllSelection() { if (m_bUpdating) return; m_bUpdating TRUE; for (int i 0; i GetItemCount(); i) SetItemState(i, 0, LVIS_SELECTED); m_bUpdating FALSE; Invalidate(FALSE); }对应的 LVN_ITEMCHANGED 处理里第一行判断 m_bUpdating如果为真就直接返回void CMyListCtrl::OnItemChanged(NMHDR* pNMHDR, LRESULT* pResult) { if (m_bUpdating) { *pResult 0; return; } NMLISTVIEW* pNMLV reinterpret_castNMLISTVIEW*(pNMHDR); // 其他业务处理... *pResult 0; }3.3 点击空白区域取消选中“打开列表后点一下空白处让所有行取消选中”是很常见的交互。处理方式是在鼠标按下时判断命中位置如果 HitTest 返回的点击位置不在任何行内就调用 ClearAllSelection。示例如下void CMyListCtrl::OnLButtonDown(UINT nFlags, CPoint point) { UINT uFlags 0; int nIndex HitTest(point, uFlags); if (nIndex 0) ClearAllSelection(); CListCtrl::OnLButtonDown(nFlags, point); }这里要注意 HitTest 的返回值。多选模式下用户可能点击在某一行的行号上也可能点击在表格右侧空白处后者正是我们需要清选中的位置。点击行号时正常交给 CListCtrl 处理点击空白则清空选中。4. DrawItem 核心绘制代码逐段拆解4.1 类声明与初始化风格子类化 CListCtrl重写 DrawItem。在构造函数或 OnCreate 里设置风格class CMyListCtrl : public CListCtrl { public: CMyListCtrl(); protected: virtual void DrawItem(LPDRAWITEMSTRUCT lpDIS); afx_msg BOOL OnEraseBkgnd(CDC* pDC); DECLARE_MESSAGE_MAP() };初始化时启动自绘风格SetExtendedStyle(GetExtendedStyle() | LVS_EX_DOUBLEBUFFER | LVS_EX_FULLROWSELECT); SetStyle(GetStyle() | LVS_OWNERDRAWFIXED | LVS_REPORT);把 LVS_OWNERDRAWFIXED 加进来之后系统不再按默认方式绘制每行内容而是每行调用一次 DrawItem。LVS_EX_FULLROWSELECT 则保证点击子项时选中整行。同时建议重写 OnEraseBkgnd 并直接返回 TRUE。自绘列表的每一行已经在 DrawItem 里填充了背景如果背景擦除还去刷白色滚动时就会出现闪烁。当然代价是列表空白区域的背景色也要自己处理可以在 OnEraseBkgnd 里 FillSolidRectBOOL CMyListCtrl::OnEraseBkgnd(CDC* pDC) { CRect rc; GetClientRect(rc); pDC-FillSolidRect(rc, RGB(255, 255, 255)); return TRUE; }4.2 DrawItem 完整实现下面这段是核心我按绘制顺序拆开讲解。完整替换到你的子类里就能跑出基本效果void CMyListCtrl::DrawItem(LPDRAWITEMSTRUCT lpDIS) { CDC* pDC CDC::FromHandle(lpDIS-hDC); CRect rcItem lpDIS-rcItem; // 获取行文本、图标索引和状态 CString strText; LVITEM lvi {0}; lvi.mask LVIF_TEXT | LVIF_IMAGE | LVIF_STATE; lvi.iItem lpDIS-itemID; lvi.iSubItem 0; lvi.pszText strText.GetBuffer(MAX_PATH); lvi.cchTextMax MAX_PATH; lvi.stateMask LVIS_SELECTED | LVIS_FOCUSED | LVIS_STATEIMAGEMASK; GetItem(lvi); strText.ReleaseBuffer(); BOOL bSelected (lvi.state LVIS_SELECTED); BOOL bFocus (lvi.state LVIS_FOCUSED); // 背景选中、交替行、默认行 BOOL bActive (::GetActiveWindow() ! NULL) (::IsWindowEnabled(m_hWnd)); COLORREF crBk; if (bSelected) crBk bActive ? RGB(51, 153, 255) : RGB(166, 202, 240); else if (lpDIS-itemID % 2 0) crBk RGB(248, 248, 248); else crBk RGB(255, 255, 255); pDC-FillSolidRect(rcItem, crBk); // 图标 CRect rcIcon rcItem; rcIcon.left 4; rcIcon.right rcIcon.left 20; CImageList* pImg GetImageList(LVSIL_SMALL); if (pImg lvi.iImage 0) { ImageList_Draw(pImg-GetSafeHandle(), lvi.iImage, pDC-GetSafeHdc(), rcIcon.left, rcIcon.top (rcItem.Height() - 16) / 2, ILD_TRANSPARENT); } // 第一列文字 CRect rcText rcItem; rcText.left 30; rcText.right - 8; pDC-SetBkMode(TRANSPARENT); pDC-SetTextColor(bSelected ? RGB(255, 255, 255) : RGB(40, 40, 40)); CFont* pOldFont pDC-SelectObject(m_font); pDC-DrawText(strText, rcText, DT_LEFT | DT_VCENTER | DT_SINGLELINE | DT_END_ELLIPSIS); pDC-SelectObject(pOldFont); // 焦点虚线框 if (bFocus bActive (lpDIS-itemAction ODA_FOCUS)) { CRect rcFocus rcItem; rcFocus.DeflateRect(3, 2); pDC-DrawFocusRect(rcFocus); } }几个细节值得展开lvi.mask 里同时要了 LVIF_TEXT、LVIF_IMAGE、LVIF_STATE这样 GetItem 一次就能拿到行文本、图标索引和状态。如果只调 GetItemText 取文本就还得再调一遍 GetItem 拿状态又多一次接口调用。DrawText 用 DT_END_ELLIPSIS文本过长时在右侧显示省略号。没有这个标记超长文本会直接画到下一列区域去。图标绘制用 ImageList_Draw 而不是 pImg-Draw因为自绘时的 DC 可能是内存兼容 DC直接调用封装方法可能出现刷子、画刷状态残留ImageList_Draw 更底层效果更稳定。m_font 是类成员变量。不要在 DrawItem 里反复创建字体对象那样滚动 100 行就会创建销毁 100 次会出现肉眼可见的卡顿。4.3 第二列之后的 CustomDraw 补充DrawItem 最自由的是第一列。第二列以后系统会继续用自己的逻辑画这时可以用 NM_CUSTOMDRAW 补充处理文字颜色NMLVCUSTOMDRAW* pLVCD reinterpret_castNMLVCUSTOMDRAW*(pNMHDR); LONG_PTR nResult 0; switch (pLVCD-nmcd.dwDrawStage) { case CDDS_PREPAINT: nResult CDRF_NOTIFYITEMDRAW; break; case CDDS_ITEMPREPAINT: nResult CDRF_NOTIFYSUBITEMDRAW; break; case CDDS_ITEMPREPAINT | CDDS_SUBITEM: { BOOL bSelected (pLVCD-nmcd.uItemState CDIS_SELECTED); pLVCD-clrText bSelected ? RGB(255, 255, 255) : RGB(60, 60, 60); pLVCD-clrTextBk bSelected ? RGB(51, 153, 255) : pLVCD-nmcd.dwItemSpec % 2 ? RGB(255, 255, 255) : RGB(248, 248, 248); nResult CDRF_NEWFONT; break; } default: nResult CDRF_DODEFAULT; break; } *pResult nResult;注意 clrTextBk 必须和 DrawItem 里的背景色保持一致否则会出现文字底块。如果你不希望子项背景有任何脏颜色可以把 DrawItem 里的行背景逻辑提取成一个公共函数两处调用。4.4 行高和悬停效果Report 模式下列表默认行高受字体影响想加大行高并不直观。常见的做法是给 LVSIL_SMALL 的 ImageList 塞一张宽度 16、高度为期望行高的透明位图整行行高就会被撑起来。位图不用画任何东西透明即可CBitmap bmp; bmp.CreateBitmap(16, 26, 1, 32, NULL); m_imgDummy.Create(16, 26, ILC_COLOR32, 1, 0); m_imgDummy.Add(bmp, RGB(0, 0, 0)); SetImageList(m_imgDummy, LVSIL_SMALL);悬停高亮可以在 DrawItem 里通过 lpDIS-itemState 判断也可以直接在 CustomDraw 的 CDDS_ITEMPREPAINT 阶段看 uItemState 是否包含 CDIS_HOT。我习惯在 DrawItem 里处理因为整行背景在那边画逻辑更集中。5. 从行自绘延伸到表头和复选框5.1 表头自绘要整张列表风格统一表头光靠系统默认多少有些突兀。做法是给 CHeaderCtrl 设置 HDS_OWNERDRAWFIXED然后子类化 CHeaderCtrl 重写 DrawItem。取表头文本用 HDITEMvoid CMyHeaderCtrl::DrawItem(LPDRAWITEMSTRUCT lpDIS) { CDC* pDC CDC::FromHandle(lpDIS-hDC); CRect rcItem lpDIS-rcItem; // 背景 pDC-FillSolidRect(rcItem, RGB(230, 230, 230)); // 分隔线 pDC-Draw3dRect(rcItem, RGB(200, 200, 200), RGB(160, 160, 160)); // 文本 HDITEM hd {0}; hd.mask HDI_TEXT | HDI_FORMAT; TCHAR szText[128] {0}; hd.pszText szText; hd.cchTextMax 127; GetItem((int)lpDIS-itemID, hd); pDC-SetBkMode(TRANSPARENT); pDC-SetTextColor(RGB(50, 50, 50)); pDC-DrawText(szText, rcItem, DT_CENTER | DT_VCENTER | DT_SINGLELINE); }这里有一个很隐蔽的问题CHeaderCtrl 的 DrawItem 是保护虚函数不能直接从 CListCtrl 内部调用。通常做法是单独写一个 CMyHeaderCtrl 类在 CMyListCtrl 创建时把表头 SubclassWindow 到这个类上。否则你需要在父窗口的 WM_DRAWITEM 里判断控件 ID 和 ODT_HEADER再拿到 CHeaderCtrl 指针来画逻辑会散落一地。5.2 复选框自绘如果开启 LVS_EX_CHECKBOXES在 OwnerDraw 模式下系统并不会自动帮你画好看的状态框至少很难和新的自绘风格融合。更可控的是自己在 DrawItem 里判断状态图像UINT nState (lvi.state LVIS_STATEIMAGEMASK) 12; // nState 1 表示未勾选2 表示勾选3 表示不确定然后调用 DrawFrameControl 绘制UINT uStyle DFCS_BUTTONCHECK; if (nState 2) uStyle | DFCS_CHECKED; else if (nState 3) uStyle | DFCS_BUTTON3STATE | DFCS_CHECKED; CRect rcCheck(rcItem.left 6, rcItem.top (rcItem.Height() - 14) / 2, rcItem.left 20, rcItem.top (rcItem.Height() - 14) / 2 14); pDC-DrawFrameControl(rcCheck, DFC_BUTTON, uStyle);注意开启复选框自绘后第一列的文本位置要往右再挪 20 像素左右否则文字会和复选框重叠。鼠标点击切换状态也不要依赖系统默认而是自己根据 HitTest 和点击区域判断。5.3 统一风格的最后一公里自绘的最后阶段往往是打磨那些不起眼的位置表头字重、行间距、选中状态下的左侧色条、图标与文字的垂直对齐、DPI 缩放后字体大小。Windows 桌面应用开发就是这样一个“细节决定观感”的活。CListCtrl 自绘到这里已经不是能不能画的问题而是画得统一不统一的问题。6. 我在实际项目里收尾时最看重的几点起初我做自绘列表一上来就追求圆角、渐变、阴影最后发现性能开销先不说光是各种边缘状态就够写几百行。做上位机和桌面工具类软件我越来越觉得自绘的目的是“一致性”和“清晰性”不是堆视觉效果。整套代码跑通之后有几条经验是实打实踩出来的第一DrawItem 里不要频繁创建临时对象。字体、画刷、位图这些尽量做成类成员列表滚动时每一行创建一次临时对象几十行滚下来卡顿感就出来了。第二不要同时在父窗口和 CListCtrl 子类里处理同一套绘制逻辑。刚开始我把 WM_DRAWITEM 放在主对话框里后来列表行为越来越多主对话框的 switch 变得越来越长。最后把所有绘制逻辑收进 CMyListCtrl 子类父窗口只负责创建和填充数据改动起来舒服很多。第三发布前要测试不同系统字体。自绘代码里如果硬编码了字体大小或行高换到高 DPI 屏幕或者系统字体从雅黑切到宋体后文字非常容易上下偏移。最稳妥的办法是行高用一个可配置变量初始值从 GetTextMetrics 里读取而不是拍脑袋写死。最后再分享一个小技巧如果你需要在 DrawItem 里绘制网格线不要直接用 pDC-MoveTo/LineTo 逐行画。网格线太多时逐像素绘制会让滚动时的 CPU 占用率明显升高。更稳的方式是设置一个颜色接近背景的 Pen或者干脆只画列之间的竖线横线用交替背景色替代视觉上既干净又省性能。CListCtrl 自绘这条路走通一次之后再做其他控件自绘心里就有底了。希望这篇能帮你少走几步弯路。本文还有配套的精品资源点击获取
简介一份以MFC自绘技术为核心的CListCtrl控件示例源码适合有一定Windows界面开发经验、希望摆脱系统默认外观的程序员。资源基于CListCtrl与CHeaderCtrl两个关键控件给出从自绘Item、列头到网格线的完整实现思路覆盖LVS_OWNERDRAWFIXED风格、OnDrawItem/OnDrawColumnHeader重载、LVN_DRAWITEM消息处理以及CDC绘图等核心环节便于读者快速理解自绘控件的运行机制并将这些技巧迁移到实际项目中。压缩包共22个文件包含7个头文件、6个C源文件、2个位图及图标文件另有资源脚本、工程文件和说明文档整体仅49KB结构精简、便于直接编译学习。该示例已获得749人浏览学习对于想掌握自绘控件细节、优化表格界面视觉效果的MFC开发者是一份直观且可运行的参考代码。 第一次把 CListCtrl 放上对话框时我差点以为工程哪里配错了白底黑字选中一条就是一大块浅蓝鼠标只要点一下旁边按钮那条选中的记录立刻变成灰蒙蒙的像被禁用了一样。很多做 MFC 界面的人都有过这个经历搜来绕去逃不开三个词CListCtrl、MFC、自绘制。这篇文章把我在这条路上的完整实践写下来从自绘机制选型、失焦变灰的处理到可以直接抄的 DrawItem 核心代码以及表头、复选框这些连带问题一并讲清楚。适合被列表控件丑到头疼的上位机和桌面工具开发者也适合刚接触 MFC 自绘、想找一份能直接跑通的源码参考的朋友。1. 默认CListCtrl的观感问题为什么非自绘不可1.1 系统绘制只保证“可读”不保证“好看”默认的 CListCtrl 在不同 Windows 主题下表现差异很大。经典主题下字体偏小、行间距紧凑到了新系统上又被主题强制套了一层样式跟软件整体风格往往对不上。更麻烦的是它的高亮逻辑控件有焦点时用 COLOR_HIGHLIGHT 的蓝色失焦后立刻换成灰色。对数据类界面来说这几乎等于让用户找不到当前操作的数据行所以很多需求单上会直接写“选中后要保持蓝色”。表格是窗口里最常用的信息容器一个界面好不好看列表占了一半观感。默认控件能完成“点击、选中、滚轮”这些基本交互但离“能直接放进正式产品”还有很长的距离。自绘不是炫技而是 CListCtrl 这类老控件在产品化过程中绕不开的一步。1.2 三个常见硬伤失焦高亮不稳定这是搜索“丢去焦点变灰”的来源后面单独用一整章来讲。文字排版受限行高默认由字体决定想给行内加一点内边距非常难。传统做法是用一张透明位图放进 ImageList 去撑行高很别扭。网格和底色单调没有交替底色没有悬停变化视觉上完全没有层次。界面里没有对比用户就会觉得“死板”。看到这里你可能会想能不能先用 NM_CUSTOMDRAW 简单改个色答案是能。但一旦要画的东西多起来比如加图标、改行高、给选中行画一个高亮边框CustomDraw 那套“通知 返回标记”的逻辑会变得很绕。这时候就该 LVS_OWNERDRAWFIXED 登场了。2. 自绘方案选型DrawItem 与 CustomDraw 到底选谁2.1 两种机制的核心差异自绘 CListCtrl 有两条主流路线OwnerDrawLVS_OWNERDRAWFIXED DrawItem以及 CustomDrawNM_CUSTOMDRAW 通知。两者不是替代关系更多是“精度”和“自由度”的取舍。对比项DrawItem 自绘NM_CUSTOMDRAW触发方式每行绘制时调用虚函数 DrawItem绘制过程中不断向父窗口发送通知控制粒度整行级别第一列最自由可精确到每个子项学习门槛需要完全自己画文本和图标只要改颜色、字体时很轻松典型场景做个性化皮肤、统一背景、图标的列表简单换色、热跟踪、列文字差异化子项处理第二列以后需要自己想办法CDDS_SUBITEM 阶段直接处理如果目标只是“选中行换一个颜色”CustomDraw 就够了。但如果目标是“整行的背景、圆角、图标、文字全部自己控制”DrawItem 更合适。我在项目里一般用混合方案DrawItem 负责整行背景、图标和第一列文字NM_CUSTOMDRAW 只处理第二列以后的文字颜色和字体。2.2 混合方案的渲染顺序DrawItem 先执行把整行背景、图标、第一列文本画完后续列交给 CustomDraw 系统绘制时它会把每个子项的文字背景再填一遍。这里容易踩坑CustomDraw 里设置的 clrTextBk 如果和 DrawItem 里画的整行背景色不一致文字周围就会多出一块“文字底”。所以混合方案里要么 CustomDraw 的 clrTextBk 严格复制 DrawItem 的背景颜色要么干脆不在 CustomDraw 里设置背景色只改文字颜色。试下来最省心的做法是DrawItem 里按“选中、交替行、默认行”三种状态定好背景色CustomDraw 里取同样逻辑只把 clrTextBk 设成相同值。这样视觉上是连续的代码也不复杂。3. 失焦变灰与“取消全部选中”的根治方案3.1 灰色的本质是“焦点判断”不是“状态丢失”很多人遇到失焦变灰第一反应是去查 LVIS_SELECTED 状态是不是丢了。其实状态一直在只是系统默认绘制规则把“控件有焦点”当成了高亮的前提条件。你点旁边的按钮列表失焦系统就自动把选中行的底色从蓝色换成灰色。解决思路很简单把绘制高亮色的判断条件从“控件有焦点”换成“程序窗口是否处于激活状态”。如果程序本身还激活着只是焦点跑到其他控件上选中行保持蓝色只有整个程序切到后台时才用淡蓝色弱化一下。自绘的意义就在这里——高亮的决定权回到你手上。这里给出一段参考逻辑BOOL bActive (::GetActiveWindow() ! NULL) (::IsWindowEnabled(m_hWnd)); COLORREF crBk bSelected ? (bActive ? RGB(51, 153, 255) : RGB(166, 202, 240)) : RGB(255, 255, 255);以这个背景色为基准在 DrawItem 里用 FillSolidRect 填充整行就能绕开系统的失焦灰色逻辑。3.2 清除所有选中行的正确姿势CListCtrl 没有内置的“取消所有选中”接口需要自己遍历。网上常见的做法是循环 SetItemState但直接这么写经常会遇到问题如果列表监听了 LVN_ITEMCHANGED遍历过程中每改一行都会触发一次通知如果通知里又做了刷新就会出现递归或者界面闪烁。解决办法是加一个保护标志。完整实现如下void CMyListCtrl::ClearAllSelection() { if (m_bUpdating) return; m_bUpdating TRUE; for (int i 0; i GetItemCount(); i) SetItemState(i, 0, LVIS_SELECTED); m_bUpdating FALSE; Invalidate(FALSE); }对应的 LVN_ITEMCHANGED 处理里第一行判断 m_bUpdating如果为真就直接返回void CMyListCtrl::OnItemChanged(NMHDR* pNMHDR, LRESULT* pResult) { if (m_bUpdating) { *pResult 0; return; } NMLISTVIEW* pNMLV reinterpret_castNMLISTVIEW*(pNMHDR); // 其他业务处理... *pResult 0; }3.3 点击空白区域取消选中“打开列表后点一下空白处让所有行取消选中”是很常见的交互。处理方式是在鼠标按下时判断命中位置如果 HitTest 返回的点击位置不在任何行内就调用 ClearAllSelection。示例如下void CMyListCtrl::OnLButtonDown(UINT nFlags, CPoint point) { UINT uFlags 0; int nIndex HitTest(point, uFlags); if (nIndex 0) ClearAllSelection(); CListCtrl::OnLButtonDown(nFlags, point); }这里要注意 HitTest 的返回值。多选模式下用户可能点击在某一行的行号上也可能点击在表格右侧空白处后者正是我们需要清选中的位置。点击行号时正常交给 CListCtrl 处理点击空白则清空选中。4. DrawItem 核心绘制代码逐段拆解4.1 类声明与初始化风格子类化 CListCtrl重写 DrawItem。在构造函数或 OnCreate 里设置风格class CMyListCtrl : public CListCtrl { public: CMyListCtrl(); protected: virtual void DrawItem(LPDRAWITEMSTRUCT lpDIS); afx_msg BOOL OnEraseBkgnd(CDC* pDC); DECLARE_MESSAGE_MAP() };初始化时启动自绘风格SetExtendedStyle(GetExtendedStyle() | LVS_EX_DOUBLEBUFFER | LVS_EX_FULLROWSELECT); SetStyle(GetStyle() | LVS_OWNERDRAWFIXED | LVS_REPORT);把 LVS_OWNERDRAWFIXED 加进来之后系统不再按默认方式绘制每行内容而是每行调用一次 DrawItem。LVS_EX_FULLROWSELECT 则保证点击子项时选中整行。同时建议重写 OnEraseBkgnd 并直接返回 TRUE。自绘列表的每一行已经在 DrawItem 里填充了背景如果背景擦除还去刷白色滚动时就会出现闪烁。当然代价是列表空白区域的背景色也要自己处理可以在 OnEraseBkgnd 里 FillSolidRectBOOL CMyListCtrl::OnEraseBkgnd(CDC* pDC) { CRect rc; GetClientRect(rc); pDC-FillSolidRect(rc, RGB(255, 255, 255)); return TRUE; }4.2 DrawItem 完整实现下面这段是核心我按绘制顺序拆开讲解。完整替换到你的子类里就能跑出基本效果void CMyListCtrl::DrawItem(LPDRAWITEMSTRUCT lpDIS) { CDC* pDC CDC::FromHandle(lpDIS-hDC); CRect rcItem lpDIS-rcItem; // 获取行文本、图标索引和状态 CString strText; LVITEM lvi {0}; lvi.mask LVIF_TEXT | LVIF_IMAGE | LVIF_STATE; lvi.iItem lpDIS-itemID; lvi.iSubItem 0; lvi.pszText strText.GetBuffer(MAX_PATH); lvi.cchTextMax MAX_PATH; lvi.stateMask LVIS_SELECTED | LVIS_FOCUSED | LVIS_STATEIMAGEMASK; GetItem(lvi); strText.ReleaseBuffer(); BOOL bSelected (lvi.state LVIS_SELECTED); BOOL bFocus (lvi.state LVIS_FOCUSED); // 背景选中、交替行、默认行 BOOL bActive (::GetActiveWindow() ! NULL) (::IsWindowEnabled(m_hWnd)); COLORREF crBk; if (bSelected) crBk bActive ? RGB(51, 153, 255) : RGB(166, 202, 240); else if (lpDIS-itemID % 2 0) crBk RGB(248, 248, 248); else crBk RGB(255, 255, 255); pDC-FillSolidRect(rcItem, crBk); // 图标 CRect rcIcon rcItem; rcIcon.left 4; rcIcon.right rcIcon.left 20; CImageList* pImg GetImageList(LVSIL_SMALL); if (pImg lvi.iImage 0) { ImageList_Draw(pImg-GetSafeHandle(), lvi.iImage, pDC-GetSafeHdc(), rcIcon.left, rcIcon.top (rcItem.Height() - 16) / 2, ILD_TRANSPARENT); } // 第一列文字 CRect rcText rcItem; rcText.left 30; rcText.right - 8; pDC-SetBkMode(TRANSPARENT); pDC-SetTextColor(bSelected ? RGB(255, 255, 255) : RGB(40, 40, 40)); CFont* pOldFont pDC-SelectObject(m_font); pDC-DrawText(strText, rcText, DT_LEFT | DT_VCENTER | DT_SINGLELINE | DT_END_ELLIPSIS); pDC-SelectObject(pOldFont); // 焦点虚线框 if (bFocus bActive (lpDIS-itemAction ODA_FOCUS)) { CRect rcFocus rcItem; rcFocus.DeflateRect(3, 2); pDC-DrawFocusRect(rcFocus); } }几个细节值得展开lvi.mask 里同时要了 LVIF_TEXT、LVIF_IMAGE、LVIF_STATE这样 GetItem 一次就能拿到行文本、图标索引和状态。如果只调 GetItemText 取文本就还得再调一遍 GetItem 拿状态又多一次接口调用。DrawText 用 DT_END_ELLIPSIS文本过长时在右侧显示省略号。没有这个标记超长文本会直接画到下一列区域去。图标绘制用 ImageList_Draw 而不是 pImg-Draw因为自绘时的 DC 可能是内存兼容 DC直接调用封装方法可能出现刷子、画刷状态残留ImageList_Draw 更底层效果更稳定。m_font 是类成员变量。不要在 DrawItem 里反复创建字体对象那样滚动 100 行就会创建销毁 100 次会出现肉眼可见的卡顿。4.3 第二列之后的 CustomDraw 补充DrawItem 最自由的是第一列。第二列以后系统会继续用自己的逻辑画这时可以用 NM_CUSTOMDRAW 补充处理文字颜色NMLVCUSTOMDRAW* pLVCD reinterpret_castNMLVCUSTOMDRAW*(pNMHDR); LONG_PTR nResult 0; switch (pLVCD-nmcd.dwDrawStage) { case CDDS_PREPAINT: nResult CDRF_NOTIFYITEMDRAW; break; case CDDS_ITEMPREPAINT: nResult CDRF_NOTIFYSUBITEMDRAW; break; case CDDS_ITEMPREPAINT | CDDS_SUBITEM: { BOOL bSelected (pLVCD-nmcd.uItemState CDIS_SELECTED); pLVCD-clrText bSelected ? RGB(255, 255, 255) : RGB(60, 60, 60); pLVCD-clrTextBk bSelected ? RGB(51, 153, 255) : pLVCD-nmcd.dwItemSpec % 2 ? RGB(255, 255, 255) : RGB(248, 248, 248); nResult CDRF_NEWFONT; break; } default: nResult CDRF_DODEFAULT; break; } *pResult nResult;注意 clrTextBk 必须和 DrawItem 里的背景色保持一致否则会出现文字底块。如果你不希望子项背景有任何脏颜色可以把 DrawItem 里的行背景逻辑提取成一个公共函数两处调用。4.4 行高和悬停效果Report 模式下列表默认行高受字体影响想加大行高并不直观。常见的做法是给 LVSIL_SMALL 的 ImageList 塞一张宽度 16、高度为期望行高的透明位图整行行高就会被撑起来。位图不用画任何东西透明即可CBitmap bmp; bmp.CreateBitmap(16, 26, 1, 32, NULL); m_imgDummy.Create(16, 26, ILC_COLOR32, 1, 0); m_imgDummy.Add(bmp, RGB(0, 0, 0)); SetImageList(m_imgDummy, LVSIL_SMALL);悬停高亮可以在 DrawItem 里通过 lpDIS-itemState 判断也可以直接在 CustomDraw 的 CDDS_ITEMPREPAINT 阶段看 uItemState 是否包含 CDIS_HOT。我习惯在 DrawItem 里处理因为整行背景在那边画逻辑更集中。5. 从行自绘延伸到表头和复选框5.1 表头自绘要整张列表风格统一表头光靠系统默认多少有些突兀。做法是给 CHeaderCtrl 设置 HDS_OWNERDRAWFIXED然后子类化 CHeaderCtrl 重写 DrawItem。取表头文本用 HDITEMvoid CMyHeaderCtrl::DrawItem(LPDRAWITEMSTRUCT lpDIS) { CDC* pDC CDC::FromHandle(lpDIS-hDC); CRect rcItem lpDIS-rcItem; // 背景 pDC-FillSolidRect(rcItem, RGB(230, 230, 230)); // 分隔线 pDC-Draw3dRect(rcItem, RGB(200, 200, 200), RGB(160, 160, 160)); // 文本 HDITEM hd {0}; hd.mask HDI_TEXT | HDI_FORMAT; TCHAR szText[128] {0}; hd.pszText szText; hd.cchTextMax 127; GetItem((int)lpDIS-itemID, hd); pDC-SetBkMode(TRANSPARENT); pDC-SetTextColor(RGB(50, 50, 50)); pDC-DrawText(szText, rcItem, DT_CENTER | DT_VCENTER | DT_SINGLELINE); }这里有一个很隐蔽的问题CHeaderCtrl 的 DrawItem 是保护虚函数不能直接从 CListCtrl 内部调用。通常做法是单独写一个 CMyHeaderCtrl 类在 CMyListCtrl 创建时把表头 SubclassWindow 到这个类上。否则你需要在父窗口的 WM_DRAWITEM 里判断控件 ID 和 ODT_HEADER再拿到 CHeaderCtrl 指针来画逻辑会散落一地。5.2 复选框自绘如果开启 LVS_EX_CHECKBOXES在 OwnerDraw 模式下系统并不会自动帮你画好看的状态框至少很难和新的自绘风格融合。更可控的是自己在 DrawItem 里判断状态图像UINT nState (lvi.state LVIS_STATEIMAGEMASK) 12; // nState 1 表示未勾选2 表示勾选3 表示不确定然后调用 DrawFrameControl 绘制UINT uStyle DFCS_BUTTONCHECK; if (nState 2) uStyle | DFCS_CHECKED; else if (nState 3) uStyle | DFCS_BUTTON3STATE | DFCS_CHECKED; CRect rcCheck(rcItem.left 6, rcItem.top (rcItem.Height() - 14) / 2, rcItem.left 20, rcItem.top (rcItem.Height() - 14) / 2 14); pDC-DrawFrameControl(rcCheck, DFC_BUTTON, uStyle);注意开启复选框自绘后第一列的文本位置要往右再挪 20 像素左右否则文字会和复选框重叠。鼠标点击切换状态也不要依赖系统默认而是自己根据 HitTest 和点击区域判断。5.3 统一风格的最后一公里自绘的最后阶段往往是打磨那些不起眼的位置表头字重、行间距、选中状态下的左侧色条、图标与文字的垂直对齐、DPI 缩放后字体大小。Windows 桌面应用开发就是这样一个“细节决定观感”的活。CListCtrl 自绘到这里已经不是能不能画的问题而是画得统一不统一的问题。6. 我在实际项目里收尾时最看重的几点起初我做自绘列表一上来就追求圆角、渐变、阴影最后发现性能开销先不说光是各种边缘状态就够写几百行。做上位机和桌面工具类软件我越来越觉得自绘的目的是“一致性”和“清晰性”不是堆视觉效果。整套代码跑通之后有几条经验是实打实踩出来的第一DrawItem 里不要频繁创建临时对象。字体、画刷、位图这些尽量做成类成员列表滚动时每一行创建一次临时对象几十行滚下来卡顿感就出来了。第二不要同时在父窗口和 CListCtrl 子类里处理同一套绘制逻辑。刚开始我把 WM_DRAWITEM 放在主对话框里后来列表行为越来越多主对话框的 switch 变得越来越长。最后把所有绘制逻辑收进 CMyListCtrl 子类父窗口只负责创建和填充数据改动起来舒服很多。第三发布前要测试不同系统字体。自绘代码里如果硬编码了字体大小或行高换到高 DPI 屏幕或者系统字体从雅黑切到宋体后文字非常容易上下偏移。最稳妥的办法是行高用一个可配置变量初始值从 GetTextMetrics 里读取而不是拍脑袋写死。最后再分享一个小技巧如果你需要在 DrawItem 里绘制网格线不要直接用 pDC-MoveTo/LineTo 逐行画。网格线太多时逐像素绘制会让滚动时的 CPU 占用率明显升高。更稳的方式是设置一个颜色接近背景的 Pen或者干脆只画列之间的竖线横线用交替背景色替代视觉上既干净又省性能。CListCtrl 自绘这条路走通一次之后再做其他控件自绘心里就有底了。希望这篇能帮你少走几步弯路。本文还有配套的精品资源点击获取
