Click here to Skip to main content
15,886,799 members
Articles / Desktop Programming / MFC

A Flat Splitter Window

Rate me:
Please Sign up or sign in to vote.
4.91/5 (53 votes)
30 Jan 2003 325.8K   13.6K   124   44
A small class that gives splitter-windows a flat look

Sample Image - FlatSplitter.gif

Introduction

This is a small class that replaces the default MFC splitter window CSplitterWnd with a splitter that has a small (flat) border. It's a very small class (only about 10 lines of code excluding all the standard MFC stuff), but I thought this might be useful for someone.

Basically, you would use this splitter if you want a GUI like the one in the (newest) "Start->Find->Files or Folders" window. This effect can't be achieved with the standard splitter window, because it draws a WS_EX_CLIENTEDGE-like border.

Usage

This is very simple to use, just do whatever you would do with a normal splitter, but replace CSplitterWnd with CFlatSplitterWnd, and don't forget to #include "FlatSplitterWnd.h".

Update & Credits

This latest version now supports multiple CFlatSplitterWnds inside of each other, like the demo app shows it. All of this thanks to Kris (http://krisoftware.w.interia.pl) - Cheers!

License

This article has no explicit license attached to it, but may contain usage terms in the article text or the download files themselves. If in doubt, please contact the author via the discussion board below.

A list of licenses authors might use can be found here.


Written By
Engineer Nokia
Denmark Denmark
My programming experience started a long time ago in
QBasic (on a 25MHz 486).
I'm now mainly using Java, C++, C, MFC, Perl and PHP, but have used quite a number of other languages as well for various projects.

Comments and Discussions

 
QuestionGreat class , I found how to narrow the border (in the constructor , where else ?) Pin
Member 223039914-May-19 23:32
Member 223039914-May-19 23:32 
QuestionGreat - but how can I make it more narrow ? Pin
Member 223039914-May-19 23:18
Member 223039914-May-19 23:18 
AnswerRe: Great - but how can I make it more narrow ? Pin
Rubayat2625-Aug-23 10:49
Rubayat2625-Aug-23 10:49 
QuestionNokia is goiong down.aren't you afraid Pin
ldw1986hf12328-Mar-12 6:00
ldw1986hf12328-Mar-12 6:00 
QuestionLayoutRolCol() Pin
Zaihuan Yu26-Sep-08 19:53
Zaihuan Yu26-Sep-08 19:53 
GeneralThanks! Great example, very useful. Pin
yuban4-May-07 13:34
yuban4-May-07 13:34 
GeneralChane Orientation Pin
Ashok Jaiswal7-Apr-07 5:47
Ashok Jaiswal7-Apr-07 5:47 
GeneralDecorated Splitter Bar Pin
#realJSOP8-Sep-06 9:12
mve#realJSOP8-Sep-06 9:12 
I added the following code so that I could have text on a row splitter bar. The following code is VERY specific to my needs, and I leave it as an exercise for the programmer to make it work on a column splitter bar.

First, I had to increase the height of the bar to accomdate the font and a surrounding rectangle (project requirements). In the constructor, I changed the 3 to a 15:

m_cxSplitter    = m_cySplitter    = 15 + 1 + 1;
m_cxBorderShare = m_cyBorderShare = 0;
m_cxSplitterGap = m_cySplitterGap = 15 + 1 + 1;
m_cxBorder      = m_cyBorder      = 1;


Next, I added a function I use to build fonts for output:

//------------------------------------------------------------------------------
//------------------------------------------------------------------------------
BOOL CFlatSplitterWnd::BuildFont(CDC* pDC, CFont* pFont, int nFontHeight, bool bBold, bool bItalic)
{
	nFontHeight = -MulDiv(nFontHeight, pDC->GetDeviceCaps(LOGPIXELSY), 72);
	CString sFontName = _T("Arial");

	int   nWeight = (bBold) ? FW_BOLD : FW_NORMAL;
	BYTE  nItalic = (bItalic) ? 1 : 0;

	return pFont->CreateFont(nFontHeight, 0, 0, 0, nWeight, nItalic, 0, 0, DEFAULT_CHARSET,
                             OUT_CHARACTER_PRECIS, CLIP_CHARACTER_PRECIS, DEFAULT_QUALITY,
                             DEFAULT_PITCH | FF_DONTCARE, sFontName);
}


Finally, I changed the OnDrawSplitter() function as follows:

//------------------------------------------------------------------------------
//------------------------------------------------------------------------------
void CFlatSplitterWnd::OnDrawSplitter(CDC* pDC, ESplitType nType, const CRect& rectArg)
{
	if((nType != splitBorder && nType != splitBar) || (pDC == NULL))
	{
		CSplitterWnd::OnDrawSplitter(pDC, nType, rectArg);
		return;
	}

	ASSERT_VALID(pDC);

	switch (nType)
	{
		case splitBorder :
			{
				pDC->Draw3dRect(rectArg, GetSysColor(COLOR_BTNSHADOW), GetSysColor(COLOR_BTNHIGHLIGHT));
			}
			break;
		case splitBar :
		{
			// let the base class have first crack
			pDC->Draw3dRect(rectArg, GetSysColor(COLOR_BTNSHADOW), GetSysColor(COLOR_BTNHIGHLIGHT));

			CFont docFont;
			CFont* pOldFont;
			CBrush newBrush;
			CBrush* pOldBrush;

			// construct and select our font
			BuildFont(pDC, &docFont, 9, false, false);
			pOldFont = pDC->SelectObject(&docFont);

			// make the brush yellow and select it
			newBrush.CreateSolidBrush(RGB(255,255,0));
			pOldBrush = pDC->SelectObject(&newBrush);

			// build our title text
			CString sTitle = "INFO";
			CSize sz = pDC->GetTextExtent(sTitle);

			// get ready to draw our yellow rectangle
			CRect tempRect = rectArg;
			tempRect.DeflateRect(1,1,1,1);

			// we need to get the window rect so we can center our text
			CRect wndRect;
			GetWindowRect(&wndRect);

			// calc start pos for text
			int xPos = (int)((wndRect.Width() - sz.cx) * 0.50);

			// make the text black, and the background (for drawing text) transparent
			pDC->SetTextColor(RGB(0,0,0));
			pDC->SetBkMode(TRANSPARENT);

			// draw our rectangle (uses default black pen)
			pDC->Rectangle(&tempRect);
			// draw our text
			pDC->TextOut(xPos, tempRect.top, sTitle);

			// free the resources
			pDC->SelectObject(pOldBrush);
			newBrush.DeleteObject();
			pDC->SelectObject(pOldFont);

			// now create a brush for ourdown arrows
			newBrush.CreateSolidBrush(RGB(0,0,0));
			pOldBrush = pDC->SelectObject(&newBrush);

			// adjust the rect some more
			tempRect.DeflateRect(0,5,0,4);
			CPoint pts[4];

			// position and draw the left-side arrow
			int x = (int)((tempRect.Width() - sz.cx - 30) * 0.50);
			int y = tempRect.top;
			pts[0] = CPoint(x,      y);
			pts[1] = CPoint(x + 10, y);
			pts[2] = CPoint(x + 5,  y + 5);
			pts[3] = CPoint(x,      y);
			pDC->Polygon(pts, 4);

			// position and draw the right-side arrow
			x = (int)((tempRect.Width() + sz.cx + 15) * 0.50);
			y = tempRect.top;
			pts[0] = CPoint(x,      y);
			pts[1] = CPoint(x + 10, y);
			pts[2] = CPoint(x + 5,  y + 5);
			pts[3] = CPoint(x,      y);
			pDC->Polygon(pts, 4);

			// free the resources
			pDC->SelectObject(pOldBrush);
			newBrush.DeleteObject();
		}
		break;
	}
}


The result is a splitter bar with a yellow rectangle showing the word "INFO", which itself is centered and flanked by two arrowheads pointing down.



"Why don't you tie a kerosene-soaked rag around your ankles so the ants won't climb up and eat your candy ass..." - Dale Earnhardt, 1997
-----
"...the staggering layers of obscenity in your statement make it a work of art on so many levels." - Jason Jystad, 10/26/2001


General很好呀 Pin
lovexinqing30-May-03 6:52
lovexinqing30-May-03 6:52 
GeneralRe: œkD™Þ Pin
Tsinghero3-Jun-03 20:23
Tsinghero3-Jun-03 20:23 
QuestionHow to change the style of the splitter between each view. Pin
Jack_Cai24-Apr-03 16:36
Jack_Cai24-Apr-03 16:36 
Generalgood Pin
zhongl15-Jul-02 14:38
zhongl15-Jul-02 14:38 
QuestionMouse click? Pin
mohanrajh4-May-02 17:23
mohanrajh4-May-02 17:23 
Generalinside nested splitter Pin
19-Mar-02 11:29
suss19-Mar-02 11:29 
GeneralRe: inside nested splitter Pin
Bartosz Bien21-Jun-02 21:01
Bartosz Bien21-Jun-02 21:01 
GeneralRe: inside nested splitter Pin
willi27-Nov-02 1:50
willi27-Nov-02 1:50 
GeneralRe: inside nested splitter Pin
vinodkbyreddy17-Mar-04 19:54
vinodkbyreddy17-Mar-04 19:54 
GeneralRe: inside nested splitter Pin
WarChildWTS1-Sep-05 18:59
WarChildWTS1-Sep-05 18:59 
GeneralLimiting splitter bar moves Pin
TBiker10-Dec-01 11:07
TBiker10-Dec-01 11:07 
GeneralRe: Limiting splitter bar moves Pin
Marc Richarme12-Dec-01 4:15
Marc Richarme12-Dec-01 4:15 
GeneralRe: Limiting splitter bar moves Pin
TBiker12-Dec-01 4:51
TBiker12-Dec-01 4:51 
GeneralRe: Limiting splitter bar moves Pin
TBiker14-Dec-01 5:51
TBiker14-Dec-01 5:51 
GeneralRe: Limiting splitter bar moves Pin
xiang_yan26-Dec-10 16:41
xiang_yan26-Dec-10 16:41 
GeneralCHtmlView Pin
Peder Alm19-Jun-01 2:05
Peder Alm19-Jun-01 2:05 
GeneralRe: CHtmlView Pin
Marc Richarme23-Aug-01 14:39
Marc Richarme23-Aug-01 14:39 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.