Command Button Implementation

     Command Button Implementation

Task

Design the following specified GUI program

Project name: button1

When the user clicks the Command button which caption is “Submit”, the message “Submit button was clicked!” will be displayed at the  Edit box.

Steps

1.       Open the Visual C++ compiler and click the New item in the File menu, opening the New dialog box.

2.       Now select the MFC AppWizard (exe) entry in the New dialog box.

3.       Give the new program the name button1 in the Project name box.

4.       Click the OK command button to starts the MFC AppWizard then click the option marked “Dialog based” to base our new program on the CDialog class. Click the Finish button to create the new program. Then finally, click the OK command button.

5.       Next, click the Resources tab, open the Dialog folder, and click the entry for our program’s main window IDD_BUTTON1_DIALOG. This process opens the dialog editor

*You will notice also that the Tool Box (Control Object Bar) appears at the right side of the dialog box.
**You can erase also the “TODO: Place the dialog controls here.”  Because this message only informs that we have to place the dialog controls (objects) such as command buttons, check boxes (or edit boxes) and others here.

6.       Add a new Command button with the caption “Submit” and a new Edit box into the dialog box. Drag these control objects from the Tool box.

*You will notice that the default caption of the command button is “Button1”. To change this into “Submit” caption is very simple. Just type right on it, the caption you want! You will notice that the Push Button Properties instantly appears where you can change the caption. Or after clicking or highlighting the command button Button1, just right-click the mouse to find the Push Button Properties. Now you can type the caption you want.
Then open the ClassWizard (by right-clicking the mouse) to connect the Submit button to an event-handler, OnBUtton1 () method.

7.       Double-click IDC_BUTTON1 in the Object IDs box, and double-click BN_CLICKED in the Messages box. This process creates the OnBUtton1() method (event-handler). Now click the OK button. At the Members Functions box, double-click the OnButton1. This process will take you to the method (event-handler) OnButton1() skeleton function. Now embed the following code:

void CButton1Dlg::OnBUtton1()
{
//TODO: Add your control notification handler code here
m_text=”Submit button was clicked!”;
UpdateData(false);
}

After that, close the program editor and save the code that you typed.
The BN_CLICKED entry is in the Message box is a special message that buttons send when they are clicked. By the way, BN prefix stands for button. The OnButton1() method is the method that the program will call when  the user clicks the Submit button in the dialog box. Here, we are able to connect a method to button clicks. However, we still need a way of reaching the dit box, because when the user clicks the button, we should place our message “Submit button was clicked!” in the edit box. In this situation, we use ClassWizard to connect a member variable to and Edit box control object in a dialog box.

8.       Open ClassWizard now by right-clicking the mouse, then click the Member Variables tab. We have to make it sure that our dialog box class, CButton1Dlg, is selected in the Class name box.

9.       Now select the Edit box control, IDC_EDIT1, and click the Add Variable button. This process opens the Add Member Variable box. Here we will be able to give a name to the text in the Edit box. Let us give the new member variable the name m_text in the Member

Variable name box. Let us make it sure that the Value shows in the Category box and CString in the Variable type box. This connects a CString variable named m_text  to the text in the Edit box.

10.   Now click the OK button in the Add Member Variable box to close it, bringing ClassWizard back up. We can place the text in the Edit box this way in OnButton1() method (which is the method cal when the user clicks the Submit button):

m_text=”Submit button was clicked!”
UpdateData(false)

Calling this method with a value of false updates the Edit box from the value in m_text member variable. Calling this method with a value of true updates m_text member varable form the text in the Edit box.

11.  You can now compile and run your program by choosing the Build menu  then click the Build item (which the corresponding file name or the project name of your program) and click the ! (exclamation mark) icon to run the program.

---------- ---------- ---------- ---------- ----------

Note:

           If some error occurs during compilation such as “Error linking...”, just close the Visual C++ 6.0 compiler, then reactivate it again and find the program you want to compile at the File menu, under the Recent Workspaces item. Just click it. Now click the Dialog folder and click the dialog object which you had created. In this example, it is the IDD_BUTTON1_DIALOG.

           

           To find the location of the error in your program, just double-click the error number at the bottom window of the Integrated Development Environment (IDE). For example, the error number is: errorC2146:missing ‘;’ before identifier “UpdateData”. Meaning, the statement that follows the UpdateData() function has no semicolon (;) at the end.

           When the Linking... messages are: 0 error(s), 0 warning(s), then your program is a success in compilation.