Cs 1 Gui Programming

8/11/2019 Cs 1 Gui Programming

1/32

Lesson 15

Graphical User Interface Programming

John Cole

CS1 -- GUI Programming 1


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)



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.



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



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.



6/32


You should now have a dialog box that looks

like this:



7/32


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.



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.



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.



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.



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



12/32


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.



13/32


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.



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.



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.



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.



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.



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.



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);



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.



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);



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);



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.



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.



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.



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"));



27/32


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.



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


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.



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.



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.


Cs 1 Gui Programming

Documents

Transcript of Cs 1 Gui Programming