Tutorial 1: Create a picture viewer

In this tutorial, you build an app that loads a picture from a file and displays it in a window. You learn how to use the Windows Forms Designer to drag controls like buttons and picture boxes on to your form, set their properties, and use containers to smoothly resize the form. You also get started writing code.


This tutorial covers both C# and Visual Basic, so focus on the information that's specific to the programming language you're using.

This tutorial walks you through the following tasks:

  • Create a new project.

  • Test (debug) an application.

  • Add basic controls like check boxes and buttons to a form.

  • Position controls on a form by using layouts.

  • Add Open File and Color dialog boxes to a form.

  • Write code by using IntelliSense and code snippets.

  • Write event handler methods.

When you finish, your app should look similar to the following image:

Picture Viewer app that you create in this tutorial

Title Description
Step 1: Create a Windows Forms App project Begin by creating a Windows Forms App project.
Step 2: Run your picture viewer app Run the Windows Forms App project that you created in the previous step.
Step 3: Set your form properties Change the way your form looks using the Properties window.
Step 4: Lay out your form with a TableLayoutPanel control Add a TableLayoutPanel control to your form.
Step 5: Add controls to your form Add controls, such as a PictureBox control and a CheckBox control, to your form. Add buttons to your form.
Step 6: Name your button controls Rename your buttons to something more meaningful.
Step 7: Add dialog components to your form Add an OpenFileDialog component and a ColorDialog component to your form.
Step 8: Write code for the show a picture button event handler Write code by using the IntelliSense tool.
Step 9: Review, comment, and test your code Review and test your code. Add comments as needed.
Step 10: Write code for additional buttons and a check box Write code to make other buttons and a check box work using IntelliSense.
Step 11: Run your app and try other features Run your app and set the background color. Try other features, such as changing colors, fonts, and borders.

There are also great, free video learning resources available to you. To learn more about programming in C#, see C# fundamentals: Development for absolute beginners. To learn more about programming in Visual Basic, see Visual Basic fundamentals: Development for absolute beginners.

Next steps

To begin the tutorial, start with Step 1: Create a Windows Forms application project.

See also