How to: Create a C# Windows Forms Application

Article
11/16/2012

The purpose of this topic is to acquaint you with elements of the Visual C# Express Edition integrated development environment (IDE) as you use Windows Forms to build a relatively straightforward C# program. Windows Forms provide your project with components, such as dialog boxes, menus, buttons, and many other controls, that make up a standard Windows application user interface (UI). Fundamentally, these controls are just classes from the .NET Framework class library. The Designer view in Visual C# Express Edition enables you to drag the controls onto your application's main form and adjust their size and position. As you do this, the IDE automatically adds the source code to create an instance of the appropriate class and initialize it.

This example shows you how to create your own Web browser application, which you can customize with shortcuts to your favorite Web sites.

In this section, you'll learn how to complete the following tasks:

Create a new Windows Forms application.
Toggle between Code view and Designer view.
Change the Windows Form's properties.
Add a MenuStrip control.
Add a Button control.
Create and populate a ComboBox control.
Use a WebBrowser control.
Create event handlers for controls.

link to video For a video version of this topic, see Video How to: Create a C# Windows Forms Application.

To create a C# Windows application

On the File menu, click New Project.

The New Project dialog box appears. This dialog box lists the different default application types that Visual C# Express Edition can create.
Select Windows Forms Application as your project type.
Change the name of your application to Web Browser.
Click OK.

Visual C# Express Edition creates a new folder for your project that is named after the project title, and then displays your new Windows Form, titled Form1 in Designer view. You can switch between this view and Code view at any time by right-clicking the design surface or code window and then clicking View Code or View Designer.

The Windows Form you see in Designer view is a visual representation of the window that will open when your application is opened. In Designer view, you can drag various controls from the Toolbox onto the form. These controls are not really "live"; they are just images that are convenient to move around on the form into a precise location.

After you have dropped a control onto the form, Visual C# works behind the scenes to create the code that will cause the real control to be positioned correctly when the program is run. This source code is in a file that is generally nested out of view. You can see this file in Solution Explorer, which is named Form1.designer.cs, if you expand Form1.cs.
If you are in Code view, switch to Designer view by right-clicking the code window and then clicking View Designer. Now change the size of the Windows Form.
1. Click the lower-right corner of the Windows Form.
2. When the pointer becomes a double-headed arrow, drag the corner of the form until it is at least as wide and as deep as a quarter of your screen.
  
  Because this is the window in which Web pages will be displayed, you don't want it to be too cramped.
Make sure the Properties window is displayed. Its default location is the lower-right section of the IDE, but you can move to another location if you like. The following illustration shows it in the upper-right corner. If you do not see the Properties window, on the View menu, click Properties window. This window lists the properties of the currently selected Windows Form or control, and it's here that you can change the existing values.
Change the title of the Windows Form.
1. Click on the form to select it.
2. In the Properties window, scroll down to Text, select the text "Form1," and type Web Browser.
3. Press ENTER or TAB to move focus from the "Text" text box.
You now see that the text at the top of your Windows Form (in the area called the title bar) has changed.

To quickly change the name of a control, right-click the control and click Properties. You can type the new name for the control in the Name property.
Click the Toolbox button on the toolbar, or on the View menu, click Toolbox. Scroll down the list of controls and expand Menus & Toolbars until you see MenuStrip. Drag this control to anywhere on the Windows Form.

This control creates a default menu at the top of the form.
In the box that says Type Here, type the name of the menu, in this case Navigate. When you press ENTER, new empty boxes appear to create other menus, and menu items. In the lower box, type Home. Press ENTER and more boxes are displayed. Type Go Back. Press ENTER, and type Go Forward.

These menu items form your basic Web site navigation controls.
Add a button.

From the Toolbox, in the Common Controls category, drag a Button control to approximately the middle of the Windows Form, just under the menu bar. In the Properties window, change the Text property to Go instead of button1, and change the design name, which resembles (Name), from button1 to goButton.
Add a ComboBox.

From the Toolbox, in the Common Controls category, drag a ComboBox control and position it to the left of the new button. Drag the edges and corners to resize and reposition the ComboBox until it is lined up with the button.

Note

When you are moving controls around a Windows Form, you will see blue lines appear. These lines are guides that help you line up the controls vertically and horizontally. You can also line up controls by selecting more than one at a time. You can do this by clicking and dragging a selection box around the controls or by holding down SHIFT as you click them. After you have multiple controls selected, you can modify the alignment and size by using the align and resize icons. These icons appear on the Layout Toolbar at the top of the Design window.
Populate the ComboBox.

A ComboBox provides a drop-down list of options from which the user can select. In this program, the ComboBox will contain a list of your favorite Web sites for quick access.

To create the list of sites, select the ComboBox and view its properties. Select the Items property, and you'll see the word (Collection) with an ellipsis button (...). Click this button to change the contents of the ComboBox. Add as many Web site URLs as you want, pressing RETURN after each.

Note

Be sure to include http:// before each Web site address.
Add the WebBrowser control.

From the Toolbox, in the Common Controls category, scroll down until you locate the WebBrowser control. Drag the control to the Windows Form. Resize the WebBrowser control 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, locate the Dock setting, and make sure that it is set to none. Setting the Anchor settings to Top, Bottom, Left, Right will cause the WebBrowser control to resize correctly when you resize the application window.

The WebBrowser control is the control that does all the hard work of rendering the Web pages. You access it in your application through an instance of the WebBrowser class. View form1.Designer.cs and you will see that an instance of this class has been added to your application code, together with instances of classes that represent the other items that you added by using the designer. It is these instances that you will be using when you add event handlers for, and call methods on, the controls.
Add an event handler for the Button control.

You have now finished the design stage of your application and are at the point when you 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 method that is executed when the user interacts with the control. Visual C# Express Edition creates empty event handlers for you automatically.

Double-click the button, and you'll see the Code Editor for your project appear. You'll also see that the event handler for the click event, which is the event message that occurs when the user clicks a button, has been created for you. Add code to the event handler method so that it resembles the following code.
```
private void goButton_Click(object sender, System.EventArgs e)
{
    webBrowser1.Navigate(new Uri(comboBox1.SelectedItem.ToString()));
}
```
This code takes the currently selected item from the ComboBox control, a string that contains a Web URL, and passes it to the Web browser's Navigate method. The Navigate method loads and displays the contents of the Web page at that location.
Add event handlers for the MenuStrip options.

Return to the Designer window and double-click each sub-item in the menu in turn. Visual C# Express Edition creates event handler methods for each. Edit these methods so that they resemble the following code.
```
private void homeToolStripMenuItem_Click(object sender, System.EventArgs e)
{
    webBrowser1.GoHome();
}

private void goForwardToolStripMenuItem_Click(object sender, System.EventArgs e)
{
    webBrowser1.GoForward();
}

private void goBackToolStripMenuItem_Click(object sender, System.EventArgs e)
{
    webBrowser1.GoBack();
}
```
Each of these menu handlers calls a navigation method that is supported on the WebBrowser class.

Note

You can see from this code that the default names given to the menu options can become very confusing. For this reason, it's a good idea to change the name of each menu control as you create it by using the Properties editor. The name of the handler will then reflect the name of the menu option.
See the code that Visual C# has written for you.

The Visual C# IDE has already written initialization code for you. In Code view, find the constructor for the Form1 class. It has a signature of public Form1(). 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 as you were dragging and dropping controls and setting properties in the Properties window.
Add some initialization code of your own.

The last task is to add some initialization code of your own to Form1. The constructor should never be used to call any code that might throw an exception. Therefore, any such code must be located someplace else, and that location is the Form1_Load method. Click the Form1.cs[Design] tab at the top of the code editor to go back to Windows Form. Select the form and in the Properties window click the Events button (the one with the lightning bolt) and then double-click Load. This will add an event handler method and position your cursor in the method in Code view.

When a user starts your program, Windows will notify your application's form by sending a Load event. When the form receives that event, it will call the Form1_Load method. Methods that are called in response to events are called event handlers. The system will call your event at the appropriate time; your job is to put the code into the event handler that you want to execute when the event occurs.

In Code view, add two lines to the Form1_Load method as shown in the following code. This will cause the WebBrowser control to display your computer's default home page and also set the initial value of the ComboBox.
```
private void Form1_Load(object sender, EventArgs e)
{
    comboBox1.SelectedIndex = 0;
    webBrowser1.GoHome();
}
```
Build and run the program.

Press F5 to build and run the Web browser. The Windows Form is displayed on the screen, and it then displays your computer's default home page. You can use the ComboBox control to select a Web site, and click Go to navigate to it. The menu options enable you to return home, or move back and forth through previously visited Web sites.

If you are new to C# programming, this would be a good time to read the C# Language Primer section. If you want to know more about the Visual C# Express Edition development environment and how to create console applications by using IntelliSense in particular, see How to: Create a C# Console Application. . To learn about how to build Windows Presentation Foundation applications, see How to: Create a C# WPF Application.

Share via

How to: Create a C# Windows Forms Application

To create a C# Windows application

See Also

Tasks

Concepts

Other Resources

Additional resources