Cs 1 Gui Programming

Lesson 15
Graphical User Interface Programming

John Cole
CS1 -- GUI Programming 1
GUI Basics
The C++ standard, unlike Java, does not define
a graphical interface. If youre programming
under 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 and
encapsulate the entire Windows Application
Programmer Interface (API)

Creating a GUI Project in Visual Studio
These instructions are for Visual Studio 2010
Professional Edition and will also work with VS
2010 Express edition
Do NOT use Visual Studio 2012 Express
Edition.
Visual Studio Professional Edition 2012 has
slightly different options when you start the
project, but you get essentially the same
thing.

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
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 generated
classes. These are fine. Click Finish.
You should now have a dialog box that looks
like this:

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.
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.
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) to
get back to the design of your window.
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.
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

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.

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.

Variables for Controls
Right-click on the Edit Control you created. In
the pop-up menu, click Add Variable.
In the screen that pops up, the only thing you
need to change is the variable name, on the
lower left. Enter ctlName without the
quotes. (My personal naming convention is
that every control variable starts with ctl.
You now have a variable you can use to
manipulate this Edit Control.

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 been
created.
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.
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.
The CString class
In the C++ standard, you can use the string
class. Since the Microsoft Foundation Classes
pre-date the standard, they defined their own
string, the CString. It is very similar to the
string class, and you should use it when
writing GUI programs. However, it is much richer
than the standard string class.
CStrings take a value that is either ASCII or
Unicode, depending upon how you set up your
project. Thus when using strings in an MFC
project, code them as shown on the next slide.
Formatting Numbers with CString
CString contains a member function for
formatting numeric data. The following code
formats the number in dTemp (31.75) and puts
it into csTemp with the string Value: in front
of it.
CString csTemp;
double dTemp = 31.75;
csTemp.Format(_T("Value: %8.2f"),
dTemp);

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.

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);
Handling Numeric Data
Visual C++ works not in ASCII but Unicode, which
is a wide character set. Thus you cant use the
standard functions like atof to convert strings to
doubles. The following code will do the trick:
CString csTemp;
double dTemp;
wchar_t *stop;
ctlAmount.GetWindowTextW(csTemp);
dTemp = wcstod(csTemp, &stop);

The OK Button
The default behavior of the OK is to close the
dialog and return a code to the window that
created 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 the
button. If you comment it out, the program
will no longer exit.

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.
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.
Checkboxes
The getCheck method of the checkbox returns
three 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"));

Comboboxes
A combobox is a combination of an edit
control and a list that may or may not be
visible.
You can fill the list with items, and you can
determine which item was selected, if any.
You can restrict the users choices to items in
the list, or allow anything to be entered into
the edit control part.
Comboboxes
There are three styles.
Simple comboboxes have no drop-down but
let you either enter something into the edit
control or choose from a list using the arrow
keys.
Dropdown comboboxes work like the simple
variety but the list drops down
Drop list comboboxes let you only choose
items from the list.
Adding Items to a Combobox
CString cblist[] = {_T("List Item 1"),
_T("List Item 2"),
_T("Third list item")};

for (int ix=0; ix<3; ix++)
{
cbSimple.AddString(cblist[ix]);
cbDropdown.AddString(cblist[ix]);
cbDroplist.AddString(cblist[ix]);
}

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:
int selected = bDroplist.GetCurSel();
If nothing is selected, this returns -1.
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.
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.

Cs 1 Gui Programming

Caricato da

Informazioni sul documento

Copyright

Formati disponibili

Condividi questo documento

Condividi o incorpora il documento

Opzioni di condivisione

Hai trovato utile questo documento?

Questo contenuto è inappropriato?

Copyright:

Formati disponibili

Cs 1 Gui Programming

Caricato da

Copyright:

Formati disponibili

Lesson 15

Graphical User Interface Programming

Potrebbero piacerti anche