2. When the app executes, another compiler (known as the just-in-time compiler
1.14 Painter Test-Drive in Visual Studio Express 2012 for Windows Desktop
[Note:This test-drive can be performed on a computer running either Windows 7 or Win- dows 8. The steps shown here are for Windows 7. We discuss running an app on Windows 8 in Section 1.15.]
You’ll now useVisual Studio Express 2012 for Windows Desktop to “test-drive” an existing app that enables you to draw on the screen using the mouse. ThePainterapp—
which you’ll build in a later chapter—allows you to choose among several brush sizes and colors. The elements and functionality you see in this app are typical of what you’ll learn to program in this text. The following steps walk you through test-driving the app.
Step 1: Checking Your Setup
Confirm that you’ve set up your computer and the software properly by reading the book’s Before You Begin section that follows the Preface.
9. www.dreamspark.com/Product/Product.aspx?productid=44.
Step 2: Locating thePainterApp’s Directory
Open a Windows Explorer window and navigate toC:\examples\ch01\win7testdrive. (We assume you placed the examples in theC:\examplesfolder.) Double click thePaint-
erfolder to view its contents (Fig. 1.6), then double click thePainter.slnfile to open the app’s solution in Visual Studio. An app’ssolutioncontains all of the app’scode files, supporting files(such asimages,videos,data files, etc.) and configuration information. We’ll discuss the contents of a solution in more detail in the next chapter.
Depending on your system configuration, Windows Explorer might not display file name extensions. To display them (like.slnin Fig. 1.6):
1. In Windows Explorer, typeAlt + tto display theToolsmenu, then selectFolder
options….
2. Select theViewtab in theFolder Optionsdialog.
3. Locate the checkboxHide extensions for known file typesand ensure that it’s un- checked.
4. ClickOKto dismiss theFolder Optionsdialog.
Step 3: Running thePainterApp
To see the runningPainterapp, click theStart( ) button (Fig. 1.7) or press theF5key.
Figure 1.8 shows the executing app.
Figure 1.8 labels several of the app’s graphical elements—called controls. These includeGroupBoxes,RadioButtons,Buttons and aPanel. These controls and many others are discussed throughout the text. The app allows you to draw with aBlack,Red,Blueor
Greenbrush ofSmall,MediumorLargesize. As you drag the mouse on the whitePanel, the app draws circles of the specified color and size at the mouse pointer’s current position.
The slower you drag the mouse, the closer the circles will be. Thus, dragging slowly draws a continuous line (as in Fig. 1.9) and dragging quickly draws individual circles with space in between. You can alsoUndoyour previous operation orClearthe drawing to start from scratch by pressing theButtons below theRadioButtons in the GUI. By using existingcon- trols—which areobjects—you can create powerful apps much faster than if you had to write all the code yourself. This is a key benefit ofsoftware reuse.
Fig. 1.6 | Contents ofC:\examples\ch01\win7testdrive\Painter.
Double clickPainter.slnto open the project in Visual Studio
1.14 PainterTest-Drive in Visual Studio Express 2012 for Windows Desktop 21
The brush’s properties, selected in theRadioButtons labeledBlackandMedium, are default settings—the initial settings you see when you first run the app. Programmers include default settings to providereasonablechoices that the app will use if the userdoes notchange the settings. Default settings also provide visual cues for users to choose their own settings. Now you’ll choose your own settings as a user of this app.
Step 4: Changing the Brush Color
Click theRadioButtonlabeledRedto change the brush color, then click theRadioButton
labeledSmallto change the brush size. Position the mouse over the whitePanel, then drag the mouse to draw with the brush. Draw flower petals, as shown in Fig. 1.9.
Fig. 1.7 | Running thePainterapp.
i
Fig. 1.8 | Painterapp running in Windows 7.
Press theStart button to begin executing the Painterapp
GroupBoxes RadioButtons
Panel Buttons
Step 5: Changing the Brush Color and Size
Click theGreenRadioButtonto change the brush color. Then, click theLargeRadioBut-
tonto change the brush size. Draw grass and a flower stem, as shown in Fig. 1.10.
Step 6:Finishing the Drawing
Click theBlueandMediumRadioButtons. Draw raindrops, as shown in Fig. 1.11, to com- plete the drawing.
Step 7: Stopping the App
When you run an app from Visual Studio, you can terminate it by clicking the stop button ( ) on the Visual Studio toolbar or by clicking the close box ( ) on the running app’s window.
Fig. 1.9 | Drawing flower petals with a small red brush.
Fig. 1.10 | Drawing the flower stem and grass with a large green brush.
1.15 PainterTest-Drive in Visual Studio Express 2012 for Windows 8 23
Now that you’ve completed the test-drive, you’re ready to begin developing C# apps.
In Chapter 2, Dive Into®Visual Studio, you’ll use Visual Studio to create your first C#
program usingvisual programmingtechniques. As you’ll see, Visual Studio will generate for you the code that builds the app’s GUI. In Chapter 3, Introduction to C# Apps, you’ll begin writing C# programs containing conventional program code that you write.