Working with GUI APIs - Essentials of Interactive Computer Graphics - page 48

System Initialization:

Source file. Pseudocode; no
corresponding source file.

// Define Application State: count the number of button clicks
int m _ OkCount = 0; // initialize to 0
// Register Event Service Routines
Register for : ButtonClick Event

Events Services:
ButtonClick // service routine for button click
m _ OKCount++; // if button is clicked, increment the count
EchoToScreen(m _ OKCount) // echo this new count to the application window

Listing 2.5. Abstract event-driven programming solution (Tutorial 2.2).

Tutorial 2.2. GUI Elements and Control Variables

Tutorial 2.2.
Project Name
MFC _ EchoButtonEvent

• Goal. Experience event-driven programming design and implementation
and understand front-end GUI elements versus back-end control variables.

• Approach. Work with an output-only GUI element, where at run time, our
application must change the state of the GUI element.

Figure 2.5 is a screenshot of running Tutorial 2.2. This is a slightly more inter-
esting application where we count the number of times the “Click to Add” button
has been clicked. If we have to design a solution for this tutorial, our experience
from Section 1.2 and Listing 1.4 leads us to an application state with a simple
integer counter and a button event service routine that increments the counter. To
implement the solution of Listing 2.5, we must first design the layout of the GUI
application and then register the event services with the appropriate GUI element.

Figure 2.5. Tutorial 2.2.

Front-End GUI Layout Design

theApp . Recall from Tuto-
rial 2.1 that theApp is an in-
stance of CTutorialApp ; t
represents our application. In
TutorialApp.cpp ,wesetthe
m _ pMainWnd instance variable
to reference the control vari-
able representing our applica-
tionmainwindow.

Figure 2.6 shows that in our Tutorial 2.2 implementation, the front-end user inter-
face has the following five GUI elements.

• The application window. We assign IDD _ ECHOBUTTONEVENT _ DIALOG to
be the GUI ID for the application window GUI element. As in Tutorial 2.1,
the CTutorialDlg class represents this GUI element, and theApp.m _ pMain
Wnd is the control variable that references our main application window.

• The “Click to Add” button. We assigned ID _ BTN _ ADD to be the GUI ID GUI ID. GUI IDs are defined

in the Resource.h file.

of this button. This is an input-only GUI element because our application