8/11/2019 Cs 1 Gui Programming
1/32
Lesson 15
Graphical User Interface Programming
John Cole
CS1 -- GUI Programming 1
8/11/2019 Cs 1 Gui Programming
2/32
GUI Basics
The C++ standard, unlike Java, does not definea graphical interface. If youre programmingunder Linux, you have your choice of several:
Gnome, KDE, Qt, etc. etc. In the Microsoft world, nearly everyone uses
the Microsoft Foundation Classes (MFC)
These are provided by Microsoft andencapsulate the entire Windows ApplicationProgrammer Interface (API)
CS1 -- GUI Programming 2
8/11/2019 Cs 1 Gui Programming
3/32
Creating a GUI Project in Visual Studio
These instructions are for Visual Studio 2010Professional Edition and will also work with VS2010 Express edition
Do NOT use Visual Studio 2012 ExpressEdition.
Visual Studio Professional Edition 2012 has
slightly different options when you start theproject, but you get essentially the samething.
CS1 -- GUI Programming 3
8/11/2019 Cs 1 Gui Programming
4/32
Creating a GUI Project in Visual Studio
Go to the File menu and click New Project.
In the New Project screen select MFC
Application (center option in VS2010)
Give it a name (such as GUIDemo)
Click OK
A screen will appear with various settings.Click Next, since we will change these
CS1 -- GUI Programming 4
8/11/2019 Cs 1 Gui Programming
5/32
Creating a GUI Project (continued)
In this screen, click the radio button next to
Dialog based.
Leave all the other settings alone and click Next.
In this screen, uncheck the About Box
checkbox, then click Next.
In this next screen, you can leave the defaults and
click Next. The final screen shows generatedclasses. These are fine. Click Finish.
CS1 -- GUI Programming 5
8/11/2019 Cs 1 Gui Programming
6/32
Creating a GUI Project (continued)
You should now have a dialog box that looks
like this:
CS1 -- GUI Programming 6
8/11/2019 Cs 1 Gui Programming
7/32
Creating a GUI Project (continued)
Click on the TODO: Place dialog controls
here text in the center of the screen and
delete it by pressing the Delete key. This is a
placeholder and we dont need it.
You should now have a dialog with an OK and
a Cancel button and nothing else.
CS1 -- GUI Programming 7
8/11/2019 Cs 1 Gui Programming
8/32
Notes About the Program
If you look at the project in the Solution
Explorer (the left-side bar that shows you the
projects and source files) youll see a section
called Resource Files. Under this you have
three files, including a .rc file. This is where
the definition of your dialog is stored. It isnt
in the source code.
CS1 -- GUI Programming 8
8/11/2019 Cs 1 Gui Programming
9/32
The Resource View
The Resource View shows you program
resources, such as dialogs, icons, and strings.
This is where you can change the program
icon, and how you would do
internationalization.
One of the views shows Dialogs. You can use
the various dialogs listed (one , in our case) toget back to the design of your window.
CS1 -- GUI Programming 9
8/11/2019 Cs 1 Gui Programming
10/32
Controls
Controls are on-screen objects that do
different things. Well explore several.
As well see later, you can have a variable
associated with a control that makes it easy to
use.
CS1 -- GUI Programming 10
8/11/2019 Cs 1 Gui Programming
11/32
Building the Interface
Also on the left side, one of the tabs is the
Toolbox. This shows all of the different
kinds of controls you can put onto a dialog.
Click and drag the Static Text onto your
dialog near the top.
Youll now see the properties. One is
Caption. Change this to Enter Your Name
CS1 -- GUI Programming 11
8/11/2019 Cs 1 Gui Programming
12/32
Building the Interface
Also in the toolbox is an Edit Control
(equivalent to the Java TextBox)
Drag this so that it is to the right of the static
control you created.
You now have a program that lets you enter a
name and press an OK button and a Cancel
button.
CS1 -- GUI Programming 12
8/11/2019 Cs 1 Gui Programming
13/32
Building the Interface
The ID property of this control defaults to
IDC_EDIT1. You can change it if you like, to
something like IDC_NAME. Always use capital
letters. Visual Studio creates these as
constants in your project. I prefer to give
control IDs meaningful names.
CS1 -- GUI Programming 13
8/11/2019 Cs 1 Gui Programming
14/32
Variables for Controls
Right-click on the Edit Control you created. Inthe pop-up menu, click Add Variable.
In the screen that pops up, the only thing you
need to change is the variable name, on thelower left. Enter ctlName without thequotes. (My personal naming convention isthat every control variable starts with ctl.
You now have a variable you can use tomanipulate this Edit Control.
CS1 -- GUI Programming 14
8/11/2019 Cs 1 Gui Programming
15/32
Notes About the Code
The other interesting function Visual Studio
generates for you is the OnInitDialog function.
This does some initialization for the dialog.
For example, if you need to read configuration
information, this is the place to do it.
This is not the constructor of the class, so on-
screen controls will already have beencreated.
CS1 -- GUI Programming 15
8/11/2019 Cs 1 Gui Programming
16/32
The Header File
Visual Studio generates a header file for you
when you create an MFC program, something
it does not do for console programs.
This contains definitions for all functions in
your program, and all fields.
One of the things it contains is a variable
called name of type CEdit.
CS1 -- GUI Programming 16
8/11/2019 Cs 1 Gui Programming
17/32
Writing the Code
Double-click the OK button in the Resource
View
This will bring you to the code and create a
function for handling the button. You can also
look at the rest of the code.
For example, if we wanted to write the name
entered to a file, you could do it in this
handler.
CS1 -- GUI Programming 17
8/11/2019 Cs 1 Gui Programming
18/32
The CStringclass
In the C++ standard, you can use the stringclass. Since the Microsoft Foundation Classespre-date the standard, they defined their ownstring, the CString. It is very similar to the
string class, and you should use it whenwriting GUI programs. However, it is much richerthan the standard stringclass.
CStrings take a value that is either ASCII or
Unicode, depending upon how you set up yourproject. Thus when using strings in an MFCproject, code them as shown on the next slide.
CS1 -- GUI Programming 18
8/11/2019 Cs 1 Gui Programming
19/32
Formatting Numbers with CString
CString contains a member function for
formatting numeric data. The following codeformats the number in dTemp (31.75) and puts
it into csTemp with the string Value: in frontof it.
CString csTemp;
double dTemp = 31.75;csTemp.Format(_T("Value: %8.2f"),dTemp);
CS1 -- GUI Programming 19
8/11/2019 Cs 1 Gui Programming
20/32
Getting Data from the Control
Add the following code in the button handler:
CString strName;
name.GetWindowTextW(strName);CWnd::MessageBox(strName,_T("Message"));
This gets whatever you typed into the edit
control on the screen into a CString and shows
it in a message box.
CS1 -- GUI Programming 20
8/11/2019 Cs 1 Gui Programming
21/32
Putting Data Into a Control
You can easily change the contents of a
control. If you want to put something into an
edit control named ctlName, use the
following:
CString csContent = Say Hello;
ctlEdit.SetWindowTextW(csContent);
CS1 -- GUI Programming 21
8/11/2019 Cs 1 Gui Programming
22/32
Handling Numeric Data
Visual C++ works not in ASCII but Unicode, whichis a wide character set. Thus you cant use thestandard functions like atof to convert strings to
doubles. The following code will do the trick:CString csTemp;
doubledTemp;
wchar_t*stop;
ctlAmount.GetWindowTextW(csTemp);
dTemp = wcstod(csTemp, &stop);
CS1 -- GUI Programming 22
8/11/2019 Cs 1 Gui Programming
23/32
The OK Button
The default behavior of the OK is to close thedialog and return a code to the window thatcreated it. If this is the topmost dialog, the
program exits. The line of code that does this is:
CDialogEx::OnOK();
Which calls the default behavior for thebutton. If you comment it out, the programwill no longer exit.
CS1 -- GUI Programming 23
8/11/2019 Cs 1 Gui Programming
24/32
The Cancel Button
The default behavior of this button is to close
the current window and return a code of
cancel to the window that created it.
If the window being closed is the topmost
one, the program closes.
CS1 -- GUI Programming 24
8/11/2019 Cs 1 Gui Programming
25/32
Checkboxes
A checkbox has three states: checked,
unchecked, and indeterminate, although the
last is almost never used.
You can add a variable for the checkbox the
same way you did for the edit control.
CS1 -- GUI Programming 25
8/11/2019 Cs 1 Gui Programming
26/32
Checkboxes
The getCheck method of the checkbox returnsthree possible values: BST_CHECKED,BST_UNCHECKED, and BST_INDETERMINATE.
These are constants in the stdafx header file. Check the state thus:
if(checkTest1.GetCheck()==BST_CHECKED)
strName.Append(_T("checked"));else
strName.Append(_T("unchecked"));
CS1 -- GUI Programming 26
8/11/2019 Cs 1 Gui Programming
27/32
8/11/2019 Cs 1 Gui Programming
28/32
Comboboxes
There are three styles.
Simple comboboxes have no drop-down butlet you either enter something into the edit
control or choose from a list using the arrowkeys.
Dropdown comboboxes work like the simple
variety but the list drops down Drop list comboboxes let you only choose
items from the list.
CS1 -- GUI Programming 28
8/11/2019 Cs 1 Gui Programming
29/32
Adding Items to a Combobox
CString cblist[] = {_T("List Item 1"),_T("List Item 2"),
_T("Third list item")};
for(intix=0; ix
8/11/2019 Cs 1 Gui Programming
30/32
Getting Information
Use the same function to get the text as for an
edit control
cbSimple.GetWindowTextW(strName);
Get the index of the selection with this:
intselected = bDroplist.GetCurSel();
If nothing is selected, this returns -1.
CS1 -- GUI Programming 30
8/11/2019 Cs 1 Gui Programming
31/32
List Control
This is a little more complicated, and requires
considerable code. However
You can set up a list that looks very much like
the list in Windows Explorer (shown by My
Computer, My Documents, etc.)
You can show icons, a list, have sort headers,
etc.
CS1 -- GUI Programming 31
8/11/2019 Cs 1 Gui Programming
32/32
Notes on Controls
Every control is a window. Therefore, it has
a Windows handle.
You can get the handle to any control, and
with it, you can get and set the contents of
controls from other programs.
This works only for programs that use the
standard controls, not for Java or .net
programs.
CS1 -- GUI Programming 32
Top Related