Part 1 Simple Dialog Based MFC Application

GOAL: To gain understanding of the GUI API and basic MFC Dialog Window 1. Open Microsoft Visual Studio .NET IDE 2. Click the menu item File >> New >> Project... 3. In the 'New Project' Window, select a. Project Types: Visual C++ Projects b. Templates: MFC Application c. Select a Name and Location for the application. (We will name ours Tutorial inside a project created folder)

Figure 1.1 - New Dialog Project 4. In the 'MFC Application Wizard' window, a. Under Application Type select Dialog Based MFC Standard Use MFC in a shared DLL b. c. d. Under User Interface Features: select System menu, Minimize box and Maximize box Under Advanced Features: un-check all boxes Click Finish

Figure 1.2 - Application Wizard 5. In the Visual Studio project window, click a. Build >> Build Solution b. Debug >> Start to run

Part 2 GUI Elements and Control Variables

GOAL: To gain understanding of basic events by showing button clicks and text echoing 1. 2. 3. 4. (Inside the VS Project Window) Click the menu item View >> Resource View Double-Click on "IDD_TUTORIAL_DIALOG" to bring up the MFC Resource Editor Select the main application window by Left-Mouse-Button click in the window Bring up the Properties window for the main application window (With main application window selected, Right-Mouse-Button click Properties), change a. ID to "IDD_TUTORIAL_DIALOG" and b. Caption to "MFC_EchoButtonEvent" Click the project menu item View >> Solution Explorer Left-Mouse-Button click to select and Right-Mouse-Button click to bring up the pop-up menu for both "TODO: ..." text box and the "OK" button, click Delete Left-Mouse-Button to select the "Cancel" button Bring up the Properties window of the "Cancel" button (With the "Cancel" button selected, Right-Mouse-Button click Properties), rename a. Caption to "&QUIT" Drag the now "QUIT" button to bottom-right corner of the dialog window Build the Solution

5. 6.

7. 8.

9. 10.

Create "Button Clicks" Text Labels: 1. 2. Open the Toolbox (View >> Toolbox) Drag a Static Text to the dialog window, inside the Properties window of the Static Text, rename a. Caption to "Button Clicks" Drag another Static Text next to the "Button Clicks", inside the Properties window, change a. ID to "IDC_ECHO_AREA" b. Caption to "0" c. Client Edge to True

3.

Create "Add" Button: 1. Drag a Button above the "Button Clicks" Text, inside the Properties window, change a. ID to "IDC_BTN_ADD" b. Caption to "Click to Add"

Add Control Variable: 1. 2. Right-Mouse-Button click the echo area control where you just set the ID to IDC_ECHO_AREA, select Add Variable... In the 'Add Variable Wizard' window, change a. Access to private b. Category to Value c. Variable Type to CString d. Variable Name to "m_EchoText" e. Click Finish

Add Event Handler: 1. 2. Right-Mouse-Button click the "Click to Add" button, select Add Event Handler... In the 'Event Handler Wizard' window, change a. Message Type to BN_CLICKED b. Class List to CTutorialDlg c. Function Handler Name to OnBnClickedBtnAdd d. Click Add and Edit

Setting Variables and Function: 1. 2. In 'TutorialDlg.h', add a private variable int m_OkCount; In 'TutorialDlg.cpp', initiate variable to 0 inside the OnInitDialog() function BOOL CTutorialDlg::OnInitDialog(){ ... m_OkCount = 0; m_EchoText.Format(_T("%d"), m_OkCount); UpdateData(FALSE); } 3. Within the OnBnClickedBtnAdd() function, add the following variables void CTutorialDlg::OnBnClickedBtnAdd(){ m_OkCount++; m_EchoText.Format(_T("%d"), m_OkCount); // without UpdateData() status area will _NOT_ be updated. UpdateData(FALSE); } 4. In the Visual Studio project window, click: a. Build >> Build Solution

b.

Debug >> Start to run

Figure 2.1 - Application Window

Part 3 Edit Control, Radio Button, Group Box

GOAL: To gain understanding of basic input mechanism. 1. Create MFC Dialog Window as follows for project calculator. When you add the radio buttons, be sure to add them in the order of +, -, *, / . Make their IDs to be IDC_ADD, IDC_SUB, IDC_MULT and IDC_DIV respectively.

2. 3. 4.

Set the + radio buttons group property to True. Build the program. Add to a private data member to the class specification of CcalculatorDlg (in calculatorDlg.h): int op_sel;

5.

Add the following statements to CcalculatorDlg::OnInitDialog() CheckRadioButton(IDC_ADD, IDC_DIV, IDC_ADD); op_sel = 0; This allows the + radio button to be checked by default.

6.

Add a event handler to each of the radio buttons: void CcalculatorDlg::OnBnClickedAdd()

{ // TODO: Add your control notification handler code here op_sel = 0; } void CcalculatorDlg::OnBnClickedSub() { // TODO: Add your control notification handler code here op_sel = 1; } void CcalculatorDlg::OnBnClickedMult() { // TODO: Add your control notification handler code here op_sel = 2; } void CcalculatorDlg::OnBnClickedDiv() { // TODO: Add your control notification handler code here op_sel = 3; } 7. Add a private control variable (Type: value) to the first edit text control: CString num1; 8. Add a private control variable (Type: value) to the second edit text control: CString num2; 9. Add a private control variable (Type: value) to the static text control for the output area: CString result; 10. Add an event handler to the Compute button: void CcalculatorDlg::OnBnClickedButton1() { // TODO: Add your control notification handler code here UpdateData(TRUE); int n1 = _ttoi(num1); int n2 = _ttoi(num2); int r; bool error = false; switch(op_sel) {

case 0: r = n1+n2; break; case 1: r = n1-n2; break; case 2: r = n1*n2; break; case 3: r = n1/n2; break; default: error = true; break; } result.Format(_T("%d"), r); // without UpdateData() status area will _NOT_ be updated. UpdateData(FALSE); } 11. Build and run the program.