Video How to: Create a C# Windows Forms Application

Transcript I'm Kathleen McGrath, and in this presentation, you're going to learn how to create a Windows Forms application using Visual C# Express. You can use Windows Forms to create UI components like dialog boxes, menus, buttons, and many other controls, that make up a standard Windows application user interface. In this demo, you will learn how to create your own Web browser application, which you can customize with shortcuts to your favorite Web sites.

Creating the Project

I'll create a new Windows Forms application by clicking File, New Project, and then selecting Windows Forms application. I'll call this Web Browser, and click OK. The Windows Form you see in the designer view is a visual representation of the window that will open when your application is opened.

Designing the User Interface

I'm going to change the size of the form by clicking the lower-right corner of the Windows Form, and dragging it so that it is at least as wide and as deep as a quarter of my screen. Because this is the window in which Web pages will be displayed, you don't want it to be too cramped. Next I'll change some of the form's properties in the Properties window. If you do not see the Properties window, on the View menu, click Properties window and it will open. This window lists the properties of the currently selected Windows Form or control, and it's here that you can change the existing values. First I'll select the form, then I'll scroll down to the Text property, select the text "Form1," and type "Web Browser". When I press ENTER, you'll see that the text at the top of the Windows Form (in the area called the title bar) has changed. Now we'll add some controls to the form from the Toolbox. If the Toolbox isn't visible, you can open it by clicking the View menu, and then clicking Toolbox. I'll expand Menus & Toolbars and drag a MenuStrip control to the Windows Form. This control creates a default menu at the top of the form.

To populate the menu, you can type in the box that reads "Type Here". I'll type in "Navigate" and press ENTER. More boxes are displayed. In the lower box, I'll type "Home" and press ENTER. I'll add "Go Forward" and "Go Back". These menu items form your basic Web site navigation controls. Now I'll add some additional controls to the form. In the Toolbox, I'll expand Common Controls, and drag a Button to the middle of my form under the MenuStrip. I'll change the Text property to "Go" (this is what you see on the form), and the Name property to "goButton" (this is what you call the button in your code). Next, I'll add a ComboBox control, and in the Properties window, I'll select the Items property, and click the ellipsis button (...) next to the word "(Collection)". This will let me add contents to the ComboBox. So I'll add a couple of Web site addresses. You can add as many as you like, but for this demo, I'll just add a few. Ill start each with http:// and then Ill add: http://www.msn.com http://www.microsoft.com And then finally: http://www.hotmail.com Next, I'll add a WebBrowser control to the formand I'll resize it to fit inside the Windows Form without obscuring the ComboBox and Button controls. If the WebBrowser control doesn't resize easily, first set it to the desired size, open its properties. Setting the Anchor settings to Top, Bottom, Left, Right will cause the WebBrowser control to resize correctly when you resize the application window. Now that I've designed the application, I can start adding some code to provide the program's functionality. The program must have event handlers for the button and for each menu option. An event handler is a chunk of code that runs when a specific event happens on the form, like when the user clicks a buttonthere's one chunk of code (called a method) that handles that event. Visual C# Express creates an empty event handler for you automatically when you double-click the button.

Adding the Code

You'll see the Code Editor for your project appear, displaying the event handler for the click event. I'll add my code to this event handlerthis code will pass in the selected item

of the ComboBox to the navigate method of the WebBrowser control. So I'll type

WebBrowser1 and a dot.

I'll select the Navigate method from the IntelliSense list. And then I'll pass in a new URland then comboBox1.SelectedItem.ToString The Navigate method loads and displays the contents of the Web page at that location. Next, I'll go back to the Design view, and I'll double-click Home toolstrip menu item, and add some code to navigate to the Home page, by typing in: WebBrowser1.GoHome(); Back in the designer, I'll double-click the Go Forward button to create the event handler, and add code: webBrowser1.GoForward(); And finally, I'll create an event handler for the GoBack button, and add the following code: webBrowser1.GoBack(); In addition to the code we've just written here, the Visual C# IDE created some initialization code automatically when I dropped the controls on the form. Let's take a quick look at this code. I'm going to go to the line of code public Form1(), which is the constructor of the form class. If I right-click the InitializeComponent method that is being called from inside the constructor, and then click Go To Definition. You now see all the code that was being written behind the scenes while you were dragging and dropping controls and setting properties in the Properties window. You can write your own initialization code, but it should be placed in the area where you write code (not where the auto-generated code is added). I want to initialize the browser so it shows a particular page at startup, so I'll add code to the Load event of the form. I'll change back to the designer view and look at the Properties window. You can view all of the events available by clicking the lightning bolt (this is the events button). I'll doubleclick Load. This will add an event handler method and position the cursor in the method in Code view. I'll add some code that will cause the WebBrowser control to display your computer's default home page and also set the initial value of the ComboBox. So I'll type in: combBox1.SelectedIndex = 0;

And then: WebBrowser1.GoHome();

Running the Program

Now I'll press F5 to build and run the Web browser. The Windows Form is displayed on the screen, and it displays my computer's default home page. I'll then use the ComboBox control to select a Web site, and click Go to navigate to it. Next, I'll select some of the menu options to return home, or move back and forth through previously visited Web sites.

For More Information

You can get more information about developing Visual C# applications in the Visual C# Guided Tour. You can find other resources, such as technical articles and videos at the Beginner Developer Learning Center.