Click here to Skip to main content
Click here to Skip to main content
Go to top

Splitter Window Tutorial

, 13 Jan 2003
Rate this:
Please Sign up or sign in to vote.
Implementing CSplitterWnd controls in MFC SDI applications.

Sample Image - SplitterWindowTutorial.gif

Introduction

This article was written to cover the basics of using the default MFC CSplitterWnd objects. I looked for a long time for a basic introduction to using the objects but could only find subclasses or otherwise adapted CSplitterWnd tutorials. I hope this article helps those who, like me, just want a basic introduction to the basic object.

Background

A CSplitterWnd or splitter window is a way to split the screen into two or more different panes (see screenshot or applications such as 3D editors). A pane itself is usually filled with a CView or CWnd derived object to provide different views of a document (or user interface functionality).

Splitter windows come in two forms - static and dynamic. This tutorial will only cover static splitters since the dynamic ones are slightly more complex. The main difference between the two is that a dynamic splitter can be split and collapsed by the user while a static splitter cannot.

Using the code

Step 1- Declare the data

Use AppWizard to create a new single document application with document/view support. Add a CSplitterWnd object to your Main Frame header file and a boolean flag for splitter management.

CSplitterWnd m_mainSplitter;
BOOL m_bInitSplitter;

m_mainSplitter will be used to split the window into two panes like the screenshot above. The boolean flag will be used for checking that the splitter has been setup before managing resizing. Ensure that in the constructor of your Main Frame class you initialize the boolean value to FALSE.

Step 2- Create the splitter

A splitter window should be created during the initialization of the client area of the main frame window. Add a function for the OnCreateClient message in your Main Frame class and insert splitter creation code as follows:

//calculate client size 
CRect cr; 
GetClientRect( &cr);

if ( !m_mainSplitter.CreateStatic( this, 1, 2 ) ) 
{ 
    MessageBox( "Error setting up splitter frames!", 
                  "Init Error!", MB_OK | MB_ICONERROR ); 
    return FALSE; 
}

The parameters to CreateStatic() are the parent window (this) and the number or rows and columns. The client rectangle size is obtained to help with sizing later on.

Step 3- Create the views

Each pane in the splitter, unless it has a splitter nested inside, must have a view attached to it before it can be displayed. After the CreateStatic call, use the following code to create a default view for the pane. Notice that each column in the splitter must have a view created since it doesn't have a nested splitter inside. This caused me a lot of problems (understanding the requirements on views), so take some time to look at various code samples to gain a deeper understanding. The boolean flag is then updated to TRUE to indicate that the splitters have been created.

if ( !m_mainSplitter.CreateView( 0, 0, 
       RUNTIME_CLASS(CSplitterWindowTutorialView), 
       CSize(cr.Width()/2, cr.Height()), pContext ) ) 
{ 
    MessageBox( "Error setting up splitter frames!", 
                "Init Error!", MB_OK | MB_ICONERROR );
    return FALSE; 
}

if ( !m_mainSplitter.CreateView( 0, 1, 
        RUNTIME_CLASS(CSplitterWindowTutorialView), 
        CSize(cr.Width()/2, cr.Height()), pContext ) ) 
{ 
    MessageBox( "Error setting up splitter frames!", 
        "Init Error!", MB_OK | MB_ICONERROR );
    return FALSE; 
}

m_bInitSplitter = TRUE;

To use RUNTIME_CLASS(CSplitterWindowTutorialView) you must include your view class header file in MainFrm.cpp and include your document class in your view class header just before:

#endif // _MSC_VER > 1000.

This will allow you to use your view class in the Main Frame class. Lots of problems occur if you do not include your document class in the view class header though - another thing to watch out for!

Step 4 - Replace the return value

Replace

return CFrameWnd::OnCreateClient(lpcs, pContext);

with

return TRUE;

The default return value from the existing code will not show our work since it returns the default method to the frame window.

Step 5 - Manage resizing

SetRowInfo and SetColumnInfo are responsible for managing the size of the splitters. Add a handler for the WM_ONSIZE message and add the following code:

void CMainFrame::OnSize(UINT nType, int cx, int cy) 
{
    CFrameWnd::OnSize(nType, cx, cy);
    CRect cr;
    GetWindowRect(&cr);

    if (  m_bInitSplitter && nType != SIZE_MINIMIZED )
    {
        m_mainSplitter.SetRowInfo( 0, cy, 0 );
        m_mainSplitter.SetColumnInfo( 0, cr.Width() / 2, 50);
        m_mainSplitter.SetColumnInfo( 1, cr.Width() / 2, 50);

        m_mainSplitter.RecalcLayout();
    }
}

In the above code, we first check that the splitters have been initialized by checking the boolean value. This check is required since I think a WM_SIZE message is passed to the frame before the create method is ran - therefore the object won't exist the first time this code runs and would crash if you didn't check for its existence.

The application should now run and provide something resembling the screenshot at the start of the article! I will probably add a second article in this series to add further nested splitters and other views based on forms! Stay tuned...

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

Share

About the Author

Paul R Thompson
Web Developer
United Kingdom United Kingdom
I am a software developer in the United Kingdom with 4 years experience programming in various languages including C++ and Java. I have an interested in coding theory, graphics programming, computer games, software security and cryptography.

Comments and Discussions

 
QuestionRc Resource PinmemberSteven Wongsun10-Jul-13 22:09 
GeneralNew Message Format PinmemberMember 1005455628-May-13 5:23 
GeneralMy vote of 4 Pinmemberiampradeepsharma4-Feb-13 18:39 
GeneralMy vote of 5 PinmemberJon3456021-Oct-12 12:27 
QuestionSeriously How Stupid [modified] Pinmemberxox_c0bra_xox22-Jun-12 16:14 
GeneralMy vote of 4 PinmemberDai Yan26-Apr-11 17:18 
GeneralSplitter window Pinmembercj_aviraj8-Jan-08 23:39 
GeneralRe: Splitter window PinmemberDCP2-Mar-08 23:00 
GeneralRe: Splitter window Pinmemberzyh2331-Jul-08 20:57 
GeneralRe: Splitter window Pinmemberangel42013-Oct-08 9:26 
GeneralRe: Splitter window Pinmemberangel42013-Oct-08 11:54 
Generalnested splitters Pinmembersaggy216-May-07 20:13 
GeneralMissing Resource files... PinmemberSatheeshCodeMFC22-Nov-06 18:08 
GeneralSome issues, but fundamentally ok PinmemberIntelliBot9-Oct-06 7:47 
GeneralBlinking when resizing Pinmembernomind21-Aug-06 1:22 
GeneralMissing res subdirectory PinmemberHans Dietrich5-Jul-06 22:06 
If you look at the sample project .dsp file (open with your favorite text editor), you will see these lines:
SOURCE=.\res\SplitterWindowTutorial.ico
# End Source File
# Begin Source File
 
SOURCE=.\res\SplitterWindowTutorial.rc2
# End Source File
# Begin Source File
 
SOURCE=.\res\SplitterWindowTutorialDoc.ico
# End Source File
# Begin Source File
 
SOURCE=.\res\Toolbar.bmp
# End Source File
# End Group
# Begin Source File
So the author simply neglected to include the res subdirectory in the zip. The good news is that these files are generic - you can generate them yourself by simply creating another MFC SDI app, and then copying its res directory (with appropriate file renaming, to match the above file names).
 

GeneralRe: Missing res subdirectory PinmemberIntelliBot9-Oct-06 7:44 
Generalmissing rc2 file Pinmemberehsan_kh5-Jul-06 21:36 
Generalsubdirectories Pinmemberruede10-Mar-06 4:38 
QuestionHow CFormView SDI create splitter?is it possible Pinmemberemilie560220-Oct-05 22:37 
AnswerRe: How CFormView SDI create splitter?is it possible Pinmemberkencocomputers26-Aug-06 12:13 
Questionhow to imlement in MDI Pinmembervikas4117923-Aug-05 2:04 
Generalvery helpful! PinmemberBob Meglio11-Apr-05 18:50 
GeneralFor me ........ Kickass !! Pinmemberxytras21-Jan-05 4:17 
GeneralUpdating both windows PinmemberMichael Hendrickx22-Dec-04 9:15 
QuestionMissing rc files? Pinmemberjoli746911-Jul-04 4:47 
AnswerRe: Missing rc files? Pinmemberjeykumars15-May-06 0:21 
GeneralRuntime error PinmemberSeve Ho7-Jun-04 17:36 
GeneralRe: Runtime error PinmemberSeve Ho7-Jun-04 18:52 
Questiondownloadable files wrong? PinmemberMister Transistor6-Jun-04 23:27 
AnswerRe: downloadable files wrong? PinmemberCWiC22-Jul-05 2:32 
QuestionDifferent view classes? PinmemberArash Salarian28-May-04 7:12 
AnswerRe: Different view classes? Pinmemberlwille@p-labor.de28-Oct-04 8:36 
GeneralRe: Different view classes? Pinmemberplasma117-May-05 16:24 
AnswerRe: Different view classes? PinmemberLeonhardt Wille4-Apr-06 2:22 
GeneralRe: Different view classes? PinmemberTann29-Aug-07 3:35 
GeneralRight Pane Question Pinmemberchicken_chicken25-Mar-04 11:05 
GeneralTouch the other Pane PinmemberDo Manh Hung30-Sep-03 3:29 
GeneralDebug Assert Failed PinsussAnonymous3-Sep-03 6:09 
GeneralRe: Debug Assert Failed Pinmemberstrik13-Jan-04 13:21 
GeneralExcellent starting point to learn splitters! Pinmembermellertson27-Aug-03 19:58 
Generalresize dialog in the splitter PinsussAnonymous13-Aug-03 3:48 
GeneralRe: resize dialog in the splitter PinmemberY_R3-Oct-05 5:18 
GeneralRe: resize dialog in the splitter (Urika) PinmemberY_R3-Oct-05 10:33 
QuestionHow to add third window? Pinmemberfatimah6-Aug-03 1:03 
Generalthx PinsussAnonymous26-Jun-03 6:21 
QuestionHow can I get the height of the splitter bar? PinmemberPascal Weiss7-May-03 4:23 
QuestionProblem? PinsussElirian26-Apr-03 23:18 
AnswerRe: Problem? PinsussAnonymous14-May-03 6:49 
GeneralRe: Problem? PinmemberMannyZanny10-Jul-03 14:35 

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

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

| Advertise | Privacy | Mobile
Web03 | 2.8.140916.1 | Last Updated 14 Jan 2003
Article Copyright 2003 by Paul R Thompson
Everything else Copyright © CodeProject, 1999-2014
Terms of Service
Layout: fixed | fluid