lesson 15 n.
Download
Skip this Video
Loading SlideShow in 5 Seconds..
Lesson 15 PowerPoint Presentation
Download Presentation
Lesson 15

Loading in 2 Seconds...

play fullscreen
1 / 32

Lesson 15 - PowerPoint PPT Presentation


  • 141 Views
  • Uploaded on

Lesson 15. Graphical User Interface Programming John Cole. GUI Basics. The C++ standard, unlike Java, does not define a graphical interface. If you’re programming under Linux, you have your choice of several: Gnome, KDE, Qt , etc. etc.

loader
I am the owner, or an agent authorized to act on behalf of the owner, of the copyrighted work described.
capcha
Download Presentation

PowerPoint Slideshow about 'Lesson 15' - anneke


Download Now An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -
Presentation Transcript
lesson 15

Lesson 15

Graphical User Interface Programming

John Cole

CS1 -- GUI Programming

gui basics
GUI Basics
  • The C++ standard, unlike Java, does not define a graphical interface. If you’re 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)

CS1 -- GUI Programming

creating a gui project in visual studio
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.

CS1 -- GUI Programming

creating a gui project in visual studio1
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

creating a gui project continued
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.

CS1 -- GUI Programming

creating a gui project continued1
Creating a GUI Project (continued)
  • You should now have a dialog box that looks like this:

CS1 -- GUI Programming

creating a gui project continued2
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 don’t need it.
  • You should now have a dialog with an OK and a Cancel button and nothing else.

CS1 -- GUI Programming

notes about the program
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) you’ll 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 isn’t in the source code.

CS1 -- GUI Programming

the resource view
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.

CS1 -- GUI Programming

controls
Controls
  • Controls are on-screen objects that do different things. We’ll explore several.
  • As we’ll see later, you can have a variable associated with a control that makes it easy to use.

CS1 -- GUI Programming

building the interface
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.
  • You’ll now see the properties. One is “Caption.” Change this to “Enter Your Name”

CS1 -- GUI Programming

building the interface1
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

building the interface2
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

variables for controls
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.

CS1 -- GUI Programming

notes about the code
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.

CS1 -- GUI Programming

the header file
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

writing the code
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

the cstring class
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 stringclass.
  • 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.

CS1 -- GUI Programming

formatting numbers with cstring
Formatting Numbers with CString
  • CStringcontains 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.

CStringcsTemp;

double dTemp= 31.75;

csTemp.Format(_T("Value: %8.2f"), dTemp);

CS1 -- GUI Programming

getting data from the control
Getting Data from the Control
  • Add the following code in the button handler:

CStringstrName;

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

putting data into a control
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:

CStringcsContent = “Say Hello”;

ctlEdit.SetWindowTextW(csContent);

CS1 -- GUI Programming

handling numeric data
Handling Numeric Data
  • Visual C++ works not in ASCII but Unicode, which is a “wide” character set. Thus you can’t use the standard functions like atofto convert strings to doubles. The following code will do the trick:

CStringcsTemp;

doubledTemp;

wchar_t *stop;

ctlAmount.GetWindowTextW(csTemp);

dTemp = wcstod(csTemp, &stop);

CS1 -- GUI Programming

the ok button
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.

CS1 -- GUI Programming

the cancel button
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

checkboxes
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

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

CS1 -- GUI Programming

comboboxes
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 user’s choices to items in the list, or allow anything to be entered into the edit control part.

CS1 -- GUI Programming

comboboxes1
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.

CS1 -- GUI Programming

adding items to a combobox
Adding Items to a Combobox

CStringcblist[] = {_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]);

}

CS1 -- GUI Programming

getting information
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.

CS1 -- GUI Programming

list control
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

notes on controls
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