Beginning VB 2008 Databases From Novice to Professional phần 8 ppsx

It’s time to add functionality and switch the Code view. You are going to read in the F irst Name and Last Name values supplied by the user and flash a message on a click of the Submit button, which means you need to put all the functionality behind the Submit button’s click event, which will eventually read the values from the TextBoxes. To achieve this, continue with these steps: 7. Double-click the Submit button. This will take you to Code view, and you will see that the btnSubmit_Click event template has been added to the code editor window, as shown in Figure 14-9. 8. Now add the following code inside this btnSubmit_Click event to achieve the desired functionality: MessageBox.Show("Hello" & " " & txtFname.Text & " " & txtLname.Text & " " & _ "Welcome to the Windows Application","Welcome") 9. Once you have added the code, click Build ➤ Build Solution, and ensure that the project gets build successfully. Figure 14-9. Code vie w of your Windows Forms Application project 10. Now it’s time to run and test the application. To do so, press Ctrl+F5. Visual Studio 2008 will load the application. 11. E nter v alues in the F irst N ame and Last Name text bo xes , and then click the Submit button; you will see a message similar to the one shown in Figure 14-10. 12. Click OK, and then close the Windows Application form. CHAPTER 14 ■ BUILDING WINDOWS FORMS APPLICATIONS 279 9470ch14final.qxd 3/15/08 1:38 PM Page 279 Simpo PDF Merge and Split Unregistered Version - http://www.simpopdf.com Figure 14-10. Running the Windows Application form How It Works Visual Studio comes with a lot of features to help developers while writing code. One of these features is that you can just double-click the GUI element for which you want to add the code, and you will be taken to the code associated with the GUI element in Code view. For example, when you double-click the Submit button in Design view, you are taken to the Code view, and the btnSubmit_Click event template automatically gets generated. To achieve the functionality for this control, you add the following code: MessageBox.Show("Hello" & " " & txtFname.Text & " " & txtLname.Text & " " & _ "Welcome to the Windows Application", "Welcome") MessageBox.Show is a VB.NET method that pops up a message box. To display a “Welcome” message with the first name and last name specified by the user in the message box, you apply a string concatenation approach while writing the code. In the code segment, you hard-code the message “Hello Welcome to the Windows Appli- cation” but with the first name and last name of the user appearing after the word “Hello” and concatenated with the rest of the message, “Welcome to the Windows Application”. For readability, you also add single space characters ( " ") concatenated by instances of the + operator in between the words and values you are reading from the Text property of the txtFnam and txtLname. If you do not include the single space character (" ") during string con- catenation, the words will be run into each other, and the message displayed in the message box will be difficult to read. Setting Dock and Anchor Properties P r ior to V isual S tudio 2005, r esizing W indows Forms would require you to reposition and/or resize controls on those forms. For instance, if you had some controls on the left side of a form, and y ou tr ied to r esize the form by stretching it toward the right side or bring it back to war d the left, the contr ols wouldn ’ t r eadjust themselv es accor ding to the width of the resized form. Developers were bound to write code to shift controls accordingly to account for the user r esizing the for m. This technique was v ery code heavy and not so easy to implement. CHAPTER 14 ■ BUILDING WINDOWS FORMS APPLICATIONS280 9470ch14final.qxd 3/15/08 1:38 PM Page 280 Simpo PDF Merge and Split Unregistered Version - http://www.simpopdf.com With Visual Studio 2005 came two new properties, Anchor and Dock, which are so easy t o set at design time itself. The same Dock and Anchor properties are available with Visual Studio 2008, and they solve the problem with the behavior of controls that users face while resizing forms. Dock Property The Dock property allows you to attach a control to one of the edges of its parent. The term “parent” applies to Windows Forms, because Windows Forms contain the controls that you drag and drop on them. By default, the Dock property of any control is set to None. For example, a control docked to the top edge of a form will always be connected to the top edge of the form, and it will automatically resize in the left and right directions when its parent is resized. The Dock property for a control can be set by using the provided graphical interface in the Properties window as shown in Figure 14-11. Figure 14-11. Setting the Dock property Anchor Property When a user resizes a form, the controls maintain a constant distance from the edges of its par ent form with the help of the Anchor property. The default value for the Anchor property for any control is set to T op , Left, which means that this control will maintain a constant dis- tance from the top and left edges of the form. The Anchor property can be set by using the pr o vided gr aphical interface in the Properties window, as shown in Figure 14-12. D ue to the default setting of Anchor pr operty to T op , Left, if y ou try to resize a form by stretching it toward the right side, you will see that its controls are still positioned on the left r ather than shifting to the center of the for m to adjust to the siz e of the form after resizing is done. If opposite edges, for example, Left and Right, are both set in the Anchor property, the control will str etch when the for m is resized. However, if neither of the opposite edges is set in the Anchor pr oper ty , the contr ol will float when the par ent is r esized. CHAPTER 14 ■ BUILDING WINDOWS FORMS APPLICATIONS 281 9470ch14final.qxd 3/15/08 1:38 PM Page 281 Simpo PDF Merge and Split Unregistered Version - http://www.simpopdf.com Figure 14-12. Setting the Anchor property Try It Out:Working with the Dock and Anchor Properties In this exercise, you will use the existing Windows Forms Application named WinApp, which you created previously in the chapter.You will see how to modify this application in such a way that when you resize the form, its controls behave accordingly and keep the application presentable for the user. 1. Go to Solution Explorer and open the WinApp project. Open the WinApp form in Design mode. 2. Select the form by clicking its title bar; you will see handles around form’s border, which allow you to resize the form’s height and width. 3. Place the cursor on the handle of the right-hand border, and when mouse pointer becomes double-headed, click and stretch the form toward the right-hand side. You will see that form’s width increases, but the controls are still attached to the left corner of the form. 4. Similarly, grab the handle located on the bottom of the form and try to increase the height of the form. You will notice that the controls are still attached to the top side of the for m. Have a look at Figure 14-13, which shows a resized (height and width) form and the position of the contr ols . The contr ols appear in the top-left corner because their Dock property values are None and Anchor property values are Top, Left. CHAPTER 14 ■ BUILDING WINDOWS FORMS APPLICATIONS282 9470ch14final.qxd 3/15/08 1:38 PM Page 282 Simpo PDF Merge and Split Unregistered Version - http://www.simpopdf.com Figure 14-13. Resized form and position of controls Now you will try to set the Dock and Anchor properties for the controls and then retest the application. 5. Select the Label control having a Text value of Welcome, and go to the Properties win- dow. Select the AutoSize property and set its value to False (default value is True). 6. Resize the width of the Label control to the width of the form, and adjust the Label control to the top border of the form. Set this control’s TextAlign property to Top, Center. 7. Set the Dock property for the Label control from None to Top, which means you want the label to always be affixed with the top border of the form. 8. Now select all the remaining controls (two Labels, two TextBoxes, and one Button) either by scrolling over all of them while holding down the left mouse button or select- ing each with a click while pressing down either the Shift or Ctrl key. 9. O nce you hav e selected all the controls, go to the Properties window. You will see listed all the properties common to the controls you have selected on the form. 10. Select the Anchor property; modify its value from the default Top, Left to Top, Left, and Right. This will allow you to adjust the controls accordingly as soon as you resize the form. The controls will also grow in size accordingly to adjust to the width of the form, as you can see in Figure 14-14. CHAPTER 14 ■ BUILDING WINDOWS FORMS APPLICATIONS 283 9470ch14final.qxd 3/15/08 1:38 PM Page 283 Simpo PDF Merge and Split Unregistered Version - http://www.simpopdf.com Figure 14-14. The effect of the Anchor property setting Top, Left, Right on a resized form ■Note The Anchor property has very interesting behaviors; you can try setting this property in various combinations and see their effects when you resize your form. 11. Return the form to its previous size so you can see the effects of setting another Anchor property. 12. Select all the controls again as you did in Step 8. Set the Anchor property to Top only and try resizing the form now. You will notice that the controls are floating in the mid- dle of the form when you resize it, as you can see in Figure 14-15. Figure 14-15. The effect of the Anchor property setting Top on a resized form 13. S av e the changes in y our pr oject b y clicking F ile ➤ S av e All. CHAPTER 14 ■ BUILDING WINDOWS FORMS APPLICATIONS284 9470ch14final.qxd 3/15/08 1:38 PM Page 284 Simpo PDF Merge and Split Unregistered Version - http://www.simpopdf.com How It Works When you resize the form, it will behave according to the settings of the Dock and Anchor properties. I n the first instance, you set the Dock property of the Label control to Top, which allows this Label control to be affixed to the top border of the form and span the entire width of the form. Setting the Anchor property of the remaining controls to Top, Left, and Right shifts the controls in such a manner that they will maintain a constant distance from the left and right borders of the form. Adding a New Form to the Project You’ll obviously need multiple Windows Forms in any given project. By default, every project opens with only one Windows Form, but you are free to add more. Try It Out: Adding a New Form to the Windows Project In this exercise, you will add another Windows Form to your project. You will also work with a ListBox control and see how to add items to that control. 1. Navigate to Solution Explorer and select the WinApp project, right-click, and click Add ➤ Windows Form. This will add a new Windows Form in your project. 2. In the Add New Item dialog box displayed, change the form’s name from Form1.vb to AddNames.vb. Click Add. The new form with the name AddNames will be added to your project. 3. Ensure that the newly added form AddNames is open in Design view. Drag a Label control onto the form and change its Text property to Enter Name. 4. Drag a TextBox control onto the AddNames form, and modify its Name property to txtName. 5. Drag a ListBox control onto the AddNames form, and modify its Name property to lstName. 6. Add a Button control to the AddNames form and modify its Name property to btnAdd and its Text property to Add. Now you are done with the design part of the AddNames form; your form should look like the one shown in Figure 14-16. CHAPTER 14 ■ BUILDING WINDOWS FORMS APPLICATIONS 285 9470ch14final.qxd 3/15/08 1:38 PM Page 285 Simpo PDF Merge and Split Unregistered Version - http://www.simpopdf.com Figure 14-16. GUI design of the AddNames form You want the user to add a name into the TextBox and click the Add button, after which that name will be added to the ListBox. To do so, you need to write the code functional- ity behind the click event of the Add button. 7. Double-click the Add button and write the following code, which will read the name entered into the TextBox and add it to the ListBox, inside the btnAdd_Click event. lstName.Items.Add(txtName.Text) txtName.Clear() 8. Go to the Build menu and select Build Solution. You should see a message indicating a successful build. Keep your current project open, as you’ll need it immediately for the next exercise. (Don’t worry; we’ll explain how this and the next exercise work afterward.) Try It Out: Setting the Startup Form Setting the startup form in a VB .NET project is a little tricky, so we wanted to break it out into its own exercise. To set a startup form, follow these steps: 1. In Solution Explorer select the WinApp project, right-click the project, and select the Properties option. You will be on the Application page by default. There you will see a list box named Startup Form; by default it will have the name of the first form you cre- ated, WinApp. Open the Startup Form drop-down list and choose AddNames, as shown in F igure 14-17. This will ensure that when you run the project it will open the A ddN ames form r ather than the W inApp form. 2. R un the project b y pressing Ctrl+F5. When the AddNames form appears, enter your name in the provided text box and click the Add button. Your name will be added in the list box, as shown in Figure 14-18. CHAPTER 14 ■ BUILDING WINDOWS FORMS APPLICATIONS286 9470ch14final.qxd 3/15/08 1:38 PM Page 286 Simpo PDF Merge and Split Unregistered Version - http://www.simpopdf.com Figure 14-17. Setting the startup form in the Properties window Figure 14-18. R unning the A ddN ames W indows F orms Application CHAPTER 14 ■ BUILDING WINDOWS FORMS APPLICATIONS 287 9470ch14final.qxd 3/15/08 1:38 PM Page 287 Simpo PDF Merge and Split Unregistered Version - http://www.simpopdf.com Implementing an MDI Form T he term M ultiple Document Interface ( MDI) means to have a GUI interface that allows multi- ple documents or forms under one parent form or window. Visualize the working style of Microsoft Word: you are allowed to open multiple docu- m ents in one parent window, and all the documents will get listed in the Window menu, from which you can choose whichever you want to read, instead of having the individual docu- ments open in their own windows, which makes it difficult to handle all of the documents and covers your screen with a lot of open windows. Having an individual window for each instance of the same application is termed Single Document Interface (SDI); applications such as Notepad, Microsoft Paint, Calculator, and so on are SDI applications. SDI applications only get opened in their own windows and can become difficult to manage, unlike when you have multiple documents or forms open inside one MDI interface. Hence, MDI applications follow a parent form and child form relationship model. MDI applications allow you to open, organize, and work with multiple documents at the same time. The parent (MDI) form organizes and arranges all the child forms or documents that are currently open. Try It Out: Creating an MDI Parent Form with a Menu Bar In this exercise, you will create an MDI form in the WinApp project. You will also see how to create a menu bar for the parent form, which will allow you to navigate to all the child forms. To do so, follow these steps: 1. Navigate to Solution Explorer, select the WinApp project, right-click, and select Add ➤ Windows Form. Change the Name value from Form1.vb to ParentForm.vb, and click Add. 2. Select the newly added ParentForm in Design mode, and navigate to the Properties window. Set the IsMdiContainer property value to True (the default value is False). Notice that the background color of the form has changed to dark gray. 3. M odify the siz e of the P ar entForm so that it can accommodate the two forms you created earlier, WinApp and AddNames, inside it. 4. Add a menu to the ParentForm by dragging a MenuStrip (a control that serves the purpose of a menu bar) onto the ParentForm. In the top-left corner, you should now see a drop-down sporting the text Type Here. Enter Open Forms in the drop-down. This will be your main top-level menu. 5. Now under the Open Forms menu, add a submenu by entering the text Win App. 6. Under the Win App submenu, enter Add Names. 7. Now click the top menu, Open Forms, and on the right side of it, type Help. 8. U nder the H elp menu, enter Exit. CHAPTER 14 ■ BUILDING WINDOWS FORMS APPLICATIONS288 9470ch14final.qxd 3/15/08 1:38 PM Page 288 Simpo PDF Merge and Split Unregistered Version - http://www.simpopdf.com [...]... HANDLING EXCEPTIONS 5 Add a button to the tab page titled ADO NET Exceptions, and change its Text property to ADO.NET Exception-1 Add a label to the right of this button, and for its Text property type Incorrect ADO.NET code will cause an exception 6 Add a second button to the tab page, and change its Text property to ADO.NET Exception-2 Add a label to the right of this button, and for its Text property... controls you added previously, and set its Text property to blank (i.e., no text is assigned) 7 To attach the code behind the Button control, double-click the Button control 8 Source view opens, taking you inside the Input.aspx .vb tab page, where you will see the blank template for the Button1_Click event Add the following code to the click event of the button: Label2.Text = "Hello" & " " & TextBox1.Text &... source view, so to see your change in effect, you need to switch back to Design view When you have a lot of changes, it can be a tedious process to see how each change made to the various controls and their respective properties looks To avoid this tedious switching between Source and Design view, Visual Studio 20 08 has come up with a brand-new feature called Split view This feature allows you to work with... client’s request with the data the user wants to see or work with HTTP is a communication protocol that is used to request web pages from the web server and then to send the response back to the web browser Introduction to ASP.NET and Web Pages ASP.NET is available to all NET developers, as it comes with Microsoft NET Framework ASP.NET provides a web development model to build web applications by using any... open the Input.aspx page in Design view, where you can drag and drop controls onto the web page 4 Drag a Label control (named Label1) onto the form, and modify its Text property to Enter Name 5 Drag a TextBox control (named TextBox1) onto the form Drag a Button control (named Button1) onto the form and modify its Text property to Submit All three controls should appear in one line 6 Now add another Label... you can create in Visual Studio 20 08 You saw how to work with the Split view feature to save you time in development You now also have an understanding of the importance of Master Pages, and how to create them and allocate Master Pages to existing web pages and newly created web pages In the next chapter, you will see how to handle exceptions 311 9470ch15final.qxd 3/15/ 08 2:44 PM Page 312 Simpo PDF Merge... Studio 20 08, works 1 Navigate back to the IDE, right-click the Input.aspx form, and select the View Markup option This view will take you to Source view, where you will see the HTML tags defined for the controls that you dragged and dropped on the Input.aspx web form earlier This view allows you to set properties for ASP.NET elements such as asp:Label, asp:TextBox, and asp:Button to be specific to your... the context of the NET Framework and gets translated into CPU-specific instructions for the processor on the PC running the web application Understanding the Visual Studio 20 08 Web Site Types Visual Studio 20 08 offers various ways of creating a web project or web site Though web sites are only meant for the Internet or intranets, Visual Studio 20 08 has three types, based on location, that can serve as... namespace to Form1 .vb: Imports System.Data.SqlClient 8 Insert the code in Listing 16-1 into the click event handler for button1 This will provide the first exception Listing 16-1 button1_Click() Dim conn As SqlConnection = New SqlConnection _ ("Data Source=.\sqlexpress;" & _ "Integrated Security=True;" & _ "database=northwind") 'create command Dim cmd As SqlCommand = conn.CreateCommand 'Specify that a stored... 3/15/ 08 1: 38 PM Page 289 Simpo PDF Merge and Split Unregistered Version - http://www.simpopdf.com CHAPTER 14 s BUILDING WINDOWS FORMS APPLICATIONS 9 Now it’s time to attach code to the submenus you have added under the main menu Open Forms First, you’ll add code for the submenu Win App, which basically will open the WinApp form In Design mode, double-click the Win App submenu, which will take you to the . TextAlign property to Top, Center. 7. Set the Dock property for the Label control from None to Top, which means you want the label to always be affixed with the top border of the form. 8. Now select. according to the settings of the Dock and Anchor properties. I n the first instance, you set the Dock property of the Label control to Top, which allows this Label control to be affixed to the top. name into the TextBox and click the Add button, after which that name will be added to the ListBox. To do so, you need to write the code functional- ity behind the click event of the Add button. 7.