Home > Articles > Programming > Windows Programming

  • Print
  • + Share This
This chapter is from the book

Step 1: Creating the User Interface

As you learned in Chapter 2, "Cranking Up Visual Basic .NET," a program's user interface enables the user to interact with the program. The user interface comprises any objects that the user manipulates in order to give commands or information to the program. Such objects include buttons, menus, and text boxes, to name just a few.

Visual Basic .NET makes it easy to create a user interface by providing a set of ready-to-go controls in a toolbox. All you have to do to create your user interface is start a new project and position the controls on the form, which is the object that represents the program's main window.

In this section, you'll create only a very simple user interface. You'll learn just enough so you can understand the sample programs in the next section of the book. You won't get into more sophisticated programs until after you learn about the Visual Basic .NET language itself. If you want to speed up this process, you could try using this book as a pillow and hope the information soaks in while you sleep. Probably, though, you'll just have to keep reading.

Getting Started

Go ahead and start Visual Basic .NET (or actually Visual Studio .NET, if you want to be fussy about it). When you do, you see a screen that looks a lot like the one shown in Figure 3.1.

Figure 3.1Figure 3.1 Visual Basic .NET when it first appears.

To start creating your first user interface, follow these steps:

  1. Click the New Project button in the Visual Studio Home Page.

  2. When the New Project dialog box appears, click Visual Basic .NET Projects in the Project Types box, and then click the Windows Application.

  3. Next, you must tell Visual Basic .NET the name of the program and where you want it stored on your hard drive. In the Name box type MyProgram (after deleting the default name, of course), and in the Location window, type the location you want—or just leave it set to the default, which should be the Visual Studio Projects that was automatically created when you installed Visual Studio .NET, as shown in Figure 3.2.

  4. Finally, click the OK button, and Visual Basic .NET will create a Form object for your program's window, as well as display a bunch of goodies in the toolbox, Solution Explorer, and Properties window. Figure 3.3 shows how Visual Basic .NET should look at this point.

Figure 3.2Figure 3.2 The Visual Basic .NET New Project dialog box.

Figure 3.3Figure 3.3 Visual Basic .NET with the new MyProgram project ready to go.

Click the Windows Forms button at the top of the toolbox. Do you see all those icons in the Visual Basic .NET toolbox? Each icon represents one of the controls you can use to build your program's user interface.

This chapter won't go into a lot of detail about each of the controls; you'll learn most of the details in Part 5, "Writing Windows Applications." Your goal right now is to get a general idea of how to create a Visual Basic .NET program. (Or maybe you grabbed this book only because your boss just walked in. In that case, you have an entirely different goal.)

Adding a Button

How about putting a button on your new form? You're not going to believe how easy this is. Just double-click the Button control in the Visual Basic .NET toolbox. When you do, a button magically appears on the form, as shown in Figure 3.4.

Figure 3.4Figure 3.4 When you double-click a control in the toolbox, the control appears on the form.

See the small squares that border the button object? Those are the button's sizing handles. You can change the size of the button by placing your mouse pointer over one of the sizing handles, holding down the left mouse button, and dragging the handle. When you place your mouse pointer over a sizing handle, the mouse pointer changes to a new image that indicates the directions you can drag the handle.

For example, place your mouse pointer over the sizing handle in the center of the button's bottom edge. The mouse pointer changes into a double-headed arrow that points up and down. This arrow means that you can drag the button's bottom edge either up or down. Go ahead and drag the edge down, as shown in Figure 3.5.

Figure 3.5Figure 3.5 You can resize most controls by dragging their sizing handles.

You should notice two things as you drag the button's edge. First, the button's size changes with the mouse pointer wherever you drag it. Second, you're filled with a nice, tingly feeling as you realize that you just got one step closer to conquering Visual Basic .NET.

When the button is the size you want it to be, just release your mouse button. The button then settles down to the new size.

To move the button, place your mouse pointer over the button. The mouse cursor changes into an icon with four arrows. Press and hold your mouse button and drag the button to the center of the form, as shown in Figure 3.6.

Figure 3.6Figure 3.6 Here's the button after it has been resized and moved.

  • + Share This
  • 🔖 Save To Your Account