1 Creating Windows GUIs with Visual Studio

2 Creating the Project New Project Visual C++ Projects Windows Forms Application Give the Project a Name and Location Confirm

3 The Form Designer Window When you start a new Windows Form Application, you will be immediately taken to the designer window This is where you modify the appearance, properties, and components of your form Compile and run the project at any time to preview your form

4 Modifying Form Properties A Windows Form has Many Properties Each Property Changes Your Form In Some Way To Access the Properties:  Right-Click your form  Select Properties  The Property Viewer Will Appear on Screen  Click on a property to view possible values and an explanation of what this property does

5 Commonly Used Properties Appearance Properties  BackColor, ForeColor  FormBorderStyle – Resizable or Not  Font  Text – Title of your Form Layout Properties  AutoScale  Size and StartPosition Windows Style Properties  Icon  MinimizeBox, MaximizeBox  Opacity – 100 for solid, 0 for invisible

6 Modifying Form Appearance Most appearance changes are done through properties Others are made in the design window Mostly by dragging, dropping, and resizing

7 Adding Components to Your Form You must use the “Toolbox” to add graphical or control components to your form (labels, buttons, etc…) Go to “View -> Toolbox” or mouse over the toolbox tab on the right This opens the toolbox and allows you to choose components Drag components onto your for design to add them

8 Customizing Components Each component you add will be a default component You must position and size each component as you please Also, components have properties you can (or must) modify to customize them

9 Common Simple Components Labels and Link Labels  Allow you to name items or provide linked information. Buttons  Allow the user to perform actions Text Boxes  Allow the user to input information

10 Common Simple Components Menu Items  Allow the user to interact with the form menu Check Boxes and Radio Buttons  Allow the user to select or choose controls Grouping Boxes  Help clearly mark groupings of components

11 Editing the Form’s C++ Code All of the code to display your form is written for you! The automatic code cannot handle user- generated events YOU must write the event handling code!

12 More about events… When running, the form is in an infinite “event loop” until an exit command is given In the event loops, user interaction with form components is detected Each interactive form component should have an event handling function  What do I do when the user clicks me?

13 Event Handling Function Double click the component to which you want to add a click event handler The click event handling function will be added and your editor will place your cursor at that function You must fill in the body of this function with C++ code to handle the click event

14 Making Your Form Interactive Certain form components allow the user to interact with the form Text Boxes allow users to type input to the form or get feedback from the form Radio Buttons and Check Boxes allow the user to select from options Your event handlers must collect information from these components in order to perform

15 Accessing Components in Event Handlers To access form components and/or their properties you must use the “arrow” or “dereference” operator The arrow operator follows a path of already made pointers and names to the information you desire

16 The Arrow Operator Examples:  this->textBox1->Text Gives the value of the Text property in textBox1 on this form (String data type)  this->radioButton1->Checked Gives the value of the Checked property in radioButton1 on this form (boolean data type)

17 An Example Create a form having two text boxes and one button The first text box should be interactive for the user to enter data and have a default value of “0” The second should be “ReadOnly” to display the results The button should be labeled “Square It!”

18 Example Continued… When the button is pressed, the number entered in the first text box should be squared and the answer displayed in the second text box Note that text boxes can only deal with String data  How do we convert to and from numerical data to do the calculations?

19 A Look at the Button Event Handler private: System::Void button1_Click(System::Object * sender, System::EventArgs * e) { double operand = Convert::ToDouble(this->textBox1->Text); double result = operand * operand; this->textBox2->Text = Convert::ToString(result); } We use the Convert interface to convert between data types Note we have accessed a property in one form component and set a property of another Perform more complex operations by simply extending your event handling code as needed