How to create a simple list view in C++ / MFC

These instructions pertain to the use of Visual Studio 2010, but barring one or two differences should be reasonably applicable to other versions of Visual Studio as well. Much of the following instructions can also be found over at the functionx site, but more screenshots are included here to give a clearer understanding.

1. Create a new MFC project

And start working through it’s Application Wizard:

Set the Application Type to dialog-based, (for reasons of clarity, I have left unchecked other options on this section as well, just to minimize the amount of generated code.):

Then set the User Interface features, again I have adopted the minimalist approach by leaving the additional options unchecked:

And then Advanced Features:

And click Finish to generate the dialog classes:

2. Add the List View control

In the resource editor, select the List Control from the Toolbox, and draw it on your ListView dialog:

Right-click on the List View control you have just inserted and select properties.

Under the Appearance > View property, make sure this is selected to ‘Report’:

On building and running the Visual Studio project the Dialog containing the List view will look like this:

3. Write the code to initialize the List View.

Right-click the List View control and this time select Class Wizard. The screen shot below is what the Class Wizard for Visual Studio 2010 looks like these days.

Select the member variables tab, and then select the Object ID of the List View that was created (in my example it is IDC_LIST1) and press the ‘Add Variable’ button:

Give the List View control variable a name, and click on OK:

The Click Apply and OK on the main Class Wizard dialog.

4. Initialize the List View

Locate the OnInitDialog method in the main dialog class code, in my case ListViewDlg.cpp:

BOOL CListViewDlg::OnInitDialog()
{
	CDialogEx::OnInitDialog();

	// Set the icon for this dialog.  The framework does this automatically
	//  when the application's main window is not a dialog
	SetIcon(m_hIcon, TRUE);			// Set big icon
	SetIcon(m_hIcon, FALSE);		// Set small icon

	// TODO: Add extra initialization here

	return TRUE;  // return TRUE  unless you set the focus to a control
}

Underneath where it says to add extra initialization, we will create the headers for the list view:

BOOL CListViewDlg::OnInitDialog()
{
	CDialogEx::OnInitDialog();

	// Set the icon for this dialog.  The framework does this automatically
	//  when the application's main window is not a dialog
	SetIcon(m_hIcon, TRUE);			// Set big icon
	SetIcon(m_hIcon, FALSE);		// Set small icon

	// Ask Mfc to create/insert a column
	m_List.InsertColumn(	
				0,				// Rank/order of item
				"Name",			// Caption for this header
				LVCFMT_LEFT,	// Relative position of items under header
				100 );			// Width of items under header

	m_List.InsertColumn( 1, "Profession", LVCFMT_CENTER, 80 );
	m_List.InsertColumn( 2, "Fav. Sport", LVCFMT_LEFT, 100 );
	m_List.InsertColumn( 3, "Hobby", LVCFMT_LEFT, 80 );

	return TRUE;  // return TRUE  unless you set the focus to a control
}

If we re-run the application, we can see our headers created:

5. Insert items under the headers

And then we may wish to create and display some items under the headers. To do this simply use the list control’s InsertItem method, setting the item text for each of these:

BOOL CListViewDlg::OnInitDialog()
{
	CDialogEx::OnInitDialog();

	// Set the icon for this dialog.  The framework does this automatically
	//  when the application's main window is not a dialog
	SetIcon(m_hIcon, TRUE);			// Set big icon
	SetIcon(m_hIcon, FALSE);		// Set small icon

	// Ask Mfc to create/insert a column
	m_List.InsertColumn(	
				0,				// Rank/order of item
				"Name",			// Caption for this header
				LVCFMT_LEFT,	// Relative position of items under header
				100 );			// Width of items under header

	m_List.InsertColumn( 1, "Profession", LVCFMT_CENTER, 80 );
	m_List.InsertColumn( 2, "Fav. Sport", LVCFMT_LEFT, 100 );
	m_List.InsertColumn( 3, "Hobby", LVCFMT_LEFT, 80 );

	int nItem;

	nItem = m_List.InsertItem( 0, "Sandra C. Anschwitz" );
	m_List.SetItemText( nItem, 1, "Singer" );
	m_List.SetItemText( nItem, 2, "HandBall" );
	m_List.SetItemText( nItem, 3, "Beach" );

	nItem = m_List.InsertItem(0, "Roger A. Miller" );
	m_List.SetItemText( nItem, 1, "FootBaller" );
	m_List.SetItemText( nItem, 2, "Tennis" );
	m_List.SetItemText( nItem, 3, "Teaching" );

	nItem = m_List.InsertItem(0, "Marie-Julie W. Gross" );
	m_List.SetItemText( nItem, 1, "Student" );
	m_List.SetItemText( nItem, 2, "Boxing" );
	m_List.SetItemText( nItem, 3, "Programming" );

	nItem = m_List.InsertItem(0, "Ella Pius Roger" );
	m_List.SetItemText( nItem, 1, "Architect" );
	m_List.SetItemText( nItem, 2, "Ping-Pong" );
	m_List.SetItemText( nItem, 3, "Songo" );

	return TRUE;  // return TRUE  unless you set the focus to a control
}

Giving us our example usage of the List View control in action:

Sample downloadable Visual Studio 2010 project downloadable from here.