Upload
adina-si-razvan-melek
View
227
Download
0
Embed Size (px)
Citation preview
8/12/2019 Creating Dialog Based Apps
1/17
Creating Dialog Based Applications with MFC 7By Jason Pursell, University of Washington, Bothell (2000-2003)[email protected] (Used by perission obtained 3!"#!0$ and adapted by %i&'i *llan)
Introduction
Windows programming involves using a graphical user interface with buttons, text areas,
radio buttons, etc. Thus, instead of having your input come from a file and your output go toa file or to the screen, you can have various kinds of graphical input and output. In a Windowsprogram, the control is very different. Instead of having a main program which controls the
actions, the control is given to the user. Thus, whenever a button is pressed or a value
entered, the program is expected to respond appropriately. This style of control is termedevent driven, and can be very different to manage.
Visual !! helps us to arrange the graphical resources "buttons, text areas, etc.# on the screen
and also aids us in mapping user actions "pressing a button, changing a text area# into
functions that the program performs. Thus, if we wanted to create a button which caused aspecific action, we would define a method "associated with the button# such as $n%utton&ress
in which we would specify what to do when the button was pressed. 'ssume this actioncauses something to be printed in a text area. In addition, we would need to know what weshould do to change the value that the program displays in the text area. This is done by
associating the text area with a variable of some type. Then, we change the variable and ask
that the system update the associated text area on the string.
In Windows programming, we are dealing with old style , so some of the data types arelimited. In this tutorial, we are also letting Visual !! control everything. We even add
global variables using button clicks. This is not necessary, but is an interesting way to
program. (ote how the integrated environment tries to save you work.
+his tutorial deonstrates ho to &reate a simpledialog based appli&ation ith ./ #and %isual tudio 1+
Note: +his tutorial is based on another one fro /odeProe&t&o, A Beginners Guide to Dialog Based Applications Part One, by 4r *sad *ltieey
The Visual Studio .NT ID
While the e5a&t vie of the 64 ay vary a bit, the parts are all the sae The !ost"rustrating thing "or !e was not to ha#e the options or #iews indicated in the
handout. The wa$s o" !anipulating the #iew are shown in %old.
This section gi#es an o#er#iew o" the #arious windows. The actual instructions"or %uilding a pro&ect are in the ne't section.
mailto:[email protected]://www.codeproject.com/dialog/dialogapptute.asphttp://www.codeproject.com/dialog/dialogapptute.aspmailto:[email protected]://www.codeproject.com/dialog/dialogapptute.asphttp://www.codeproject.com/dialog/dialogapptute.asp8/12/2019 Creating Dialog Based Apps
2/17
8/12/2019 Creating Dialog Based Apps
3/17
. Class View
7 4isplays a prograati& vie of sybols in your &ode,for e5aple, naespa&es, &lasses, ethods, and
fun&tions Variables you have added are visible at the
bottom of this view under CProjectNameDlg
/. )esource View
74isplays the resour&e files in&luded in your proe&ts andallows $ou to get %ac0 to the Dialog ditor %$
dou%le clic0ing on IDD1ProjectName1DIA234under the Dialog la%el.
5. 6roperties indow
8 Use this indo to vie and &hange the design-tie
properties and events of sele&ted obe&ts that are lo&atedin editors and designers
Ta%le (. 64 &oponents
+he lo&ation of the ea&h of the vies (or indos) is totally dependent upon the profile
you are using +he profile &an be set fro the Start Pageunder My Profile +he StartPageusually shos hen you start %isual tudio 1+ 6 li'e the profile :tudent Windo
;ayout3,$,?@ are displayed in the saespa&e Switching %etween the #iews is done %$ clic0ing on the ta%s %elow the!
+as shown in the picture,. I" the )esource View 9/ is not present in the ta%s;$ou can also get these #iews to appear %$ clic0ing on icons that are part o" $our
ID. To see which #iews are associated with each icon; hold the !ouse o#ereach icon until the tool tips displa$. The diagra! %elow shows the icons
associated with each #iew.
+he properties indo is shon in (Figure *) +he first to on the left ust deterine
ho the ites are displayed in the list +he ne5t three deterine hat is displayedAProperties, Control Events, Messages, or Overrides(in that order) Control Events,
Messages, and Overrides are only available hen &ertain things are sele&ted .ore5aple, Figure *is hat is available hen /4ialog"4lg is sele&ted in the Class View
(as in the pi&ture of the Class Viewat the top of the page) hoever, the Overridesi&onis only shon hen a &lass is sele&ted
8/12/2019 Creating Dialog Based Apps
4/17
Figure *. Buttons of the properties indo
Creating a New 6ro&ect +and Solution,
+o &reate a ne proe&t, &hoose FileNew6ro&ect on the ain enu +he NewProjectdialog ill open ele&t Visual C
8/12/2019 Creating Dialog Based Apps
5/17
Figure . .iles &reated inside the 4ialog" solution folder hen the Create directory for Solution &he&'bo5 issele&ted
+here is also a file =eadet5t hi&h is &reated in your dire&tory 6t e5plains all of the
files that are &reated by %isual /EE
Cn the enu, &hoose Application T$pe(&ir&led in red in Figure /)
Figure /. Page one of the i9ard
Figure 5. *ppli&ation +ype page of the i9ard
/hoose the options that are &ir&led in redin Figure 5/li&' the Finishbutton
*se the lassView tab to see the actual files that have been created. The file +ialog+lg.cpp
references the 'bout+lg, +ialog'pp and the +ialog+lg class declarations.
8/12/2019 Creating Dialog Based Apps
6/17
The visual elements of a pro-ect are called resources. or example, icons, dialog boxes,
buttons, and menus are resources. The wi/ard has created folders of resources. lick on the0esource tab to see the folders.
Designing the Dialog
Note: I" the Dialog ditor is not showing; open the )esource View and e'pandthe Dialogs "older and dou%le>clic0 IDD_DIALOG1_DIALOG.
In this example, we are going to create a window like that shown in igure 1 which will help
us input names.
Figure 7. +he 4ialog ditor in a&tion
/li&' on the te5t TOO! Place dialog controls "ere, then press Delete
1e5t, as in Figure 7above, sele&t the dialog by &li&'ing on the edge of the title bar +he
dialog ill no have si9ing handles on its sides and &orners +hese are used to resi9e thedialog +he idth and height of the dialog is indi&ated at the botto-right of the 64 and
is &ir&led in bluein the diagra above +hese si9e and idths also sho the si9e of
&ontrols you ill add later
in&e e donFt need the Cancelbutton in our appli&ation, sele&t it by left-&li&'ing it on&e
+he button is sele&ted hen si9ing handles surround it Press Delete
1e5t e need to &hange soe of the properties of the 3?button
ele&t the 3?button by left-&li&'ing it on&e Figure @shos ho the Properties indorefle&ts the properties of the button hen it is sele&ted
2.
ele&tion andle+his &an be draggedto &hange the si9e ofthe dialog +heidth and height areindi&ated in arebelo &ir&led in blue
1.
/li&' the title bar tosele&t the 4ialog itself
HINT:
6nvestigate the blueline after the tutorial+ry to figure out hatit is used for 6t &anbe useful
8/12/2019 Creating Dialog Based Apps
7/17
Note:4epending on your &hoi&e of 64 setup, the properties indo ight be on the left
or right 6f it is not shoing, then &hoose View6roperties indow or press Fonthe 'eyboard
Figure @. Properties of the CD button
/hange the Captionof the button by typing Closein the value field of the /aptionproperty (as shon in Figure )
Figure . /hanging the /aption property of the button
Type in here!
8/12/2019 Creating Dialog Based Apps
8/17
1o the button on the dialog reads :/lose
8/12/2019 Creating Dialog Based Apps
9/17
Figure (. 5aple layout of the 4ialog" dialog
ere is an e5aple of the properties of the &obo-bo5 &ontrol that e added +he
properties e ill &hange are highlighted in red
Figure ((. +he properties of the 64/I+6+; &obo bo5 &ontrol
1e5t, e need to spe&ify the length of the &obo-bo5 drop don list Position the ouse
over the drop-don arro of the &obo-bo5 and left-&li&' on&e Use the blue resi9ing
handle to adust the length, siilar to Figure (* /li&' the drop don arro on the&obo-bo5 again to toggle ba&' to the noral &ontrol resi9ing ode
(otice, these values are not visible inthe dialog editor, but only show up
when you execute.
8/12/2019 Creating Dialog Based Apps
10/17
If you need a multi4line edit box, you need to make sure that you re5uest that your edit box betreated as multi4line. 0esi/e the edit box to be considerably larger. *nder the &roperties
window select 6ultiline, 3ori/ontal )croll, 'uto 3)croll, Vertical scroll, 'uto V)croll, and
Want return. When you write to this edit box, instead of -ust using \nyou must use \r\n. If
you only use \nor forget to specify the edit box as multi4line, you will get a strange symbol
instead of a newline on your screen.
Figure (*. pe&ifying the length of the open /obo-bo5 list
Assigning Me!%er Varia%les to Controls
;etFs add soe variables to tie the GU6 to the data a'e sure that the 4ialog ditor is
open and a&tive 6n order to a&&ess the#dd Mem$er Varia$le %i&ard, &hoose6ro&ectAdd Varia%lefro the ain enu ou &an also right &li&' anyhere in the4ialog ditor and &hoose Add Varia%lefro the pop-up enu +his is fine for regularold variables, but for variables that represent &ontrols, you should right-&li&' on the
&ontrol +his ay the#dd Mem$er Varia$le %i&ardill start, but it ill load up ith thefields already filled ith the default settings for that &ontrol
2 *dusts length of sele&ted drop bo5
" ;eft-&li&' to toggle the
si9ing ode
8/12/2019 Creating Dialog Based Apps
11/17
Figure (-. =ight-&li&' enu
We ill or' ith the First Na!e dit &ontrol first
6n the 4ialog ditor, right-&li&' the First Na!edit &ontrol .ro the pop-up enu,
&hoose#dd Varia$le.
*s in Figure (, a'e sure the folloing settings are present before pressing theFinishbuttonA Control varia$lechecked, Control 'to IDC1FI)STNAM,#ccessto
pri#ate, Category to Value;Varia$letype to CString, Control typeto DIT, and
Varia$le nameto !1strFirstNa!e. * ord of e5planation on &ategoryAValue means
that it will handle data values, while ontrol means that you can control some feature ofthe component itself like disabling it or setting the si/e.
8/12/2019 Creating Dialog Based Apps
12/17
Figure (. +he *dd eber %ariable Wi9ard for the .irst 1ae edit &ontrol
Use ta%le -as a guide to enter the other variables 6f the syste onFt let you enterthe values you ant, try &hanging another field first
)e!e!%erA =ight-&li&' on the &ontrol to add a variable +here are other ays, but
this is the easiest for you, be&ause it :pre-fills< soe of the fields
NoteA 64/I1*;6+ ill have to variables asso&iated ith it Cne is a /tring and
the other is a /;istbo5 * ;istBo5 is ust a &olle&tion of ites that the user &an
sele&t fro (using the ouse)
Control ID Access Varia%let$pe
Varia%le Na!e Categor$ Controlt$pe
Control#aria%le
64/I;*+1* private /tring Istr;ast1ae %alue 46+ yes
64/I+6+; private /tring Istr+itle %alue /CBCBCK yes
64/I1*;6+ private /tring Istr.ull1ae %alue ;6+BCK es
64/I1*;6+ Private /;istbo5 I1ae;ist /ontrol ;6+BCK yes
Ta%le -. +he reaining variables that need to be added via the *dd %ariable Wi9ard
's you add various controls, you may find yourself inside the code view, rather than at the
+ialog 7ditor view. To get back to the +ialog 7ditor view, sele&t the tab labeled 4ialog"r&(as &ir&led belo)
hange thisone first
8/12/2019 Creating Dialog Based Apps
13/17
If you create the variables incorrectly, one way to fix them is to -ust modify the code that thesystem created for you. "In other words, in +ialog+lg.cpp and +ialog+lg.h, find the
declarations8uses and change them.#
)tring is an old style string. 2ou can convert between strings and )trings easily. 2ou can
-ust assign a string to a )tring via assignment, but to create a )tring from a string, you
must use the converstion method c9str"#. Thus, if s is a string and cs is a )tring, cs :s.c9str"# is legal.
Adding Message andlers "or the Controls*n event handler is a ay to asso&iate a fun&tion &all ith an event su&h as &li&'ing on abutton +here is ore than one ay to add an event handler 6 ill sho a &ouple of
ays here a&h has pros and &ons
Note: =ead over %othethods first and then de&ide hi&h one you ant to use
Method 3ne=ight-&li&' on the &ontrol that you are interested in (the *dd button in this &ase), then
&hoose#dd Event (andlerfro the pop-up enu (see Figure (/) +his ill bring up theEvent (andler %i&ard +here you &an fill in the inforation
/li&' the Add and ditbutton hen done +his ill ta'e you to the nely added ethod
here you &an begin adding your on &ode
8/12/2019 Creating Dialog Based Apps
14/17
Figure (/. *&&essing the vent andler Wi9ard fro right-&li&'ing on &ontrols
Method Two+he se&ond ethod is done through the Propertiesindo and is Huite &onvenient
.irst, left-&li&' on a &ontrol to sele&t it +he Propertiesindo ill &hange to represent
the &ontrol /li&' the ControlEventsbutton (using the lightning i&on at the top) 1e5t,
&li&' on the BN1C2IC?D&ontrol event 6f you &li&' the don arro, you ill seeFigure (5 We ant to use our on nae, so instead, ust type in the field as in Figure(7
*s soon as you press nter, the ain indo ill &hange to &ode vie and the &ursorill be positioned in the nely &reated ethod aiting for you to add soe of your on
&ode
+he &ode that you ill add is on the ne5t page
8/12/2019 Creating Dialog Based Apps
15/17
Figure (5. +he default event handler fun&tion nae provided by ./
Figure (7. *&&essing the *dd vent andler through the Properties indo
1o that youFve read through both ethods, follo one to add an event handler for theAddbutton
*dd the folloing &ode to the On#ddfun&tionA
voidCDialog1Dlg::OnAdd(){ // TODO: Add your control notification handler code here
CString strTitle; int nIndex;
UpdateData(); // DDX -Transfer data from the controls to variables
//get the currently selected text nIndex !etDlgIte"Text(IDC#TIT$%& strTitle); "#str'lla"e strTitle * + + * "#str'irsta"e * + + * "#str$asta"e; "#a"e$ist,AddString("#str'lla"e);
UpdateData('A$S%); // DDX - Transfer data from variables to controls-
4onFt &hoose thisunless you ant the
fun&tion to have the
default nae
We ant to use our
on nae, so ustleft-&li&' on&e in hereand typeA On#dd
+hen press nter.
8/12/2019 Creating Dialog Based Apps
16/17
Building and )unning the 6rogra!
+o run, ust press CT)2
8/12/2019 Creating Dialog Based Apps
17/17
Co!%ining with other classes
2ou can also add additional classes for the program to use. To do this, create a .h and a .cpp
file as you normally would and add them to the pro-ect. $ne additional step is to add the line;