Learn about Microsoft Visual Basic 2010 Writing Your First Program Step by Step

<div dir="ltr" style="text-align: left;" trbidi="on"> <div class="separator" style="clear: both; text-align: center;"> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKLxzsNNpGtKXbrXeAV8ReAsG3meUAhFKI625t5Fk82uabTjYZLmTqv-W1vNHcVA86WPdJBWFoLBbbw6n59tWdvI9hoWo2sb-MO7leFGliEpXkuI4kLfQZxm_8jqs-9rrETg_Ydz13EF_M/s1600/9.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="900" data-original-width="738" height="640" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKLxzsNNpGtKXbrXeAV8ReAsG3meUAhFKI625t5Fk82uabTjYZLmTqv-W1vNHcVA86WPdJBWFoLBbbw6n59tWdvI9hoWo2sb-MO7leFGliEpXkuI4kLfQZxm_8jqs-9rrETg_Ydz13EF_M/s640/9.jpg" width="524" /></a></div> <h2 style="text-align: left;"> <i><br /></i></h2> <h2 style="text-align: left;"> <i>Writing Your First Program</i></h2> <i>After completing this chapter, you will be able to:</i><br /> <br /> <ol style="text-align: left;"> <li><i> Create the user interface for a new program.</i></li> <li><i>Set the properties for each object in your user interface.</i></li> <li><i>Write program code.</i></li> <li><i>Save and run the program.</i></li> <li><i> Build an executable file.</i></li> </ol> <br /> <i>As you learned “Exploring the Visual Studio Integrated Development</i><br /> <i>Environment,” the Microsoft Visual Studio 2010 Integrated Development Environment (IDE)</i><br /> <i>contains several</i><br /> <i>powerful tools to help you run and manage your programs. Visual Studio</i><br /> <i>also contains everything</i><br /> <i>you need to build your own applications for Windows and the Web</i><br /> <i>from the ground up.</i><br /> <i>In this chapter, you’ll learn how to create a simple but attractive user interface with the</i><br /> <i>controls</i><br /> <i>in the Visual Studio Toolbox. Next you’ll learn how to customize the operation</i><br /> <i>of these controls with property settings. Then you’ll see how to identify just what your</i><br /> <i>program</i><br /> <i>should do by writing program code. Finally, you’ll learn how to save and run your</i><br /> <i>new program</i><br /> <i>(a Las Vegas–style slot machine) and how to compile it as an executable file.</i><br /> <i>Lucky Seven: Your First Visual Basic Program</i><br /> <i>The Windows-based application you’re going to construct is Lucky Seven, a game program</i><br /> <i>that simulates a lucky number slot machine. Lucky Seven has a simple user interface and can</i><br /> <i>be created and compiled in just a few minutes using Microsoft Visual Basic. Here’s what your</i><br /> <i>program will look like when it’s finished:</i><br /> <div class="separator" style="clear: both; text-align: center;"> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiyCIw-DhR7etg5J7rqS1dIp5bsHwnfRQW2_w80Qbm_C3lwEFC3zlSqoKWEYy4WQa_VOK68PQNjKElgy25dY4I4k6xk1D1Gg3w1uUv3gKW3kPpTM2Zaytj_RZi2RgVOJQVLvoyQ2SnjEd-f/s1600/1.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="276" data-original-width="483" height="364" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiyCIw-DhR7etg5J7rqS1dIp5bsHwnfRQW2_w80Qbm_C3lwEFC3zlSqoKWEYy4WQa_VOK68PQNjKElgy25dY4I4k6xk1D1Gg3w1uUv3gKW3kPpTM2Zaytj_RZi2RgVOJQVLvoyQ2SnjEd-f/s640/1.jpg" width="640" /></a></div> <h2 style="text-align: left;"> <i>Programming Steps</i></h2> <i>The Lucky Seven user interface contains two buttons, three lucky number boxes, a digital</i><br /> <i>photo depicting your winnings, and the label “Lucky Seven.” I produced these elements</i><br /> <i>by creating seven objects on the Lucky Seven form and then changing several properties</i><br /> <i>for each object. After I designed the interface, I added program code for the Spin and End</i><br /> <i>buttons</i><br /> <i>to process the user’s button clicks and produce the random numbers. To re-create</i><br /> <i>Lucky Seven, you’ll follow three essential programming steps in Visual Basic: Create the user</i><br /> <i>interface, set the properties, and write the program code. Table 2-1 shows the process</i><br /> <i>for</i><br /> <h3 style="text-align: left;"> <i>Lucky Seven.</i></h3> <h4 style="text-align: left;"> <i>Building the Lucky Seven Program</i></h4> <i>Programming Step Number of Items</i><br /> <i>1. Create the user interface. 7 objects</i><br /> <i>2. Set the properties. 13 properties</i><br /> <i>3. Write the program code. 2 objects</i><br /> <h2 style="text-align: left;"> <i>Creating the User Interface</i></h2> <i>In this exercise, you’ll start building Lucky Seven by first creating a new project and then</i><br /> <i>using</i><br /> <i>controls in the Toolbox to construct the user interface.</i><br /> <i>Create a new project</i><br /> <i>1. Start Visual Studio 2010.</i><br /> <i>2. On the Visual Studio File menu, click New Project.</i><br /> <i><b>[Tip You can also start a new programming project by clicking the blue New Project link</b></i><br /> <i><b>on the Start Page.]</b></i><br /> <i>The New Project dialog box opens, as shown on the following page.</i><br /> <i>The New Project dialog box provides access to the major project types available for</i><br /> <i>writing Windows and Web applications. If you indicated during setup that you are</i><br /> <i>a Visual Basic programmer, Visual Basic is your primary development option (as shown</i><br /> <i>here), but the other languages in Visual Studio (Visual C#, Visual C++, and Visual F#)</i><br /> <i>are always available through this dialog box. Although you will select a basic Windows</i><br /> <div class="separator" style="clear: both; text-align: center;"> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdl0-jsIVlMSJNvkVnkGGpy1jHuEf0TQwp7CF4aGVSrf5H1bCNv5LDdr4PNWgyYLmpoVHLZZzdgspPmFWrt8QYSdS1exU9bEHh0BuaoK9Nk-HbSvqzO79gQy26lMGN9_4H5nF3g0XQppKS/s1600/2.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="478" data-original-width="798" height="380" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdl0-jsIVlMSJNvkVnkGGpy1jHuEf0TQwp7CF4aGVSrf5H1bCNv5LDdr4PNWgyYLmpoVHLZZzdgspPmFWrt8QYSdS1exU9bEHh0BuaoK9Nk-HbSvqzO79gQy26lMGN9_4H5nF3g0XQppKS/s640/2.jpg" width="640" /></a></div> <i>application project in this exercise, this dialog box is also the gateway to other types</i><br /> <i>of development projects, such as a Web application, console application, Microsoft</i><br /> <i>Office add-in, Windows Azure Cloud Service, Silverlight application, or Visual Studio</i><br /> <i>deployment</i><br /> <i>project.</i><br /> <i>Near the top of the New Project dialog box, you will notice a drop-down list box.</i><br /> <i>This feature allows you to specify the version of the Microsoft .NET Framework that</i><br /> <i>your application will target. This feature is sometimes called multi-targeting, meaning</i><br /> <i>that through it, you can select the target environment that your program will run on.</i><br /> <i>For example, if you retain the default selection of .NET Framework 4, any computer that</i><br /> <i>your application will run on must have .NET Framework 4 installed. (Not to worry—the</i><br /> <i>.NET Framework is usually installed as part of the operating system installation, or when</i><br /> <i>you install a new Visual Basic program that you have written.) Unless you have a specific</i><br /> <i>need, you can just leave this drop-down list at its default setting of .NET Framework 4.</i><br /> <i>Visual Basic 2010 Express does not include this drop-down list. You’ll learn more about</i><br /> <i>the .NET Framework in Chapter 5, “Visual Basic Variables and Formulas, and the .NET</i><br /> <i>Framework.”</i><br /> <i>3. Click the Windows Forms Application icon in the central Templates area of the dialog</i><br /> <i>box, if it is not already selected.</i><br /> <i>Visual Studio prepares the development environment for Visual Basic Windows</i><br /> <i>application</i><br /> <i></i><br /> <i>programming.</i><br /> <i>4. In the Name text box, type <b><u>MyLucky7</u></b>.</i><br /> <i>Visual Studio assigns the name MyLucky7 to your project. (You’ll specify a folder</i><br /> <i>location</i><br /> <i>for the project later.) I’m recommending the “My” prefix here so you</i><br /> <i>don’t confuse your new application with the Lucky7 project I’ve created for you</i><br /> <i>on disk.</i><br /> <i><b>[Tip If your New Project dialog box contains Location and Solution Name text boxes,</b></i><br /> <i><b>you need to specify a folder location and solution name for your new programming</b></i><br /> <i><b>project now. The presence of these text boxes is controlled by a check box in the Project</b></i><br /> <i><b>And Solutions category of the Options dialog box, but it is not the default setting. (You</b></i><br /> <i><b>display</b></i><br /> <i><b>this dialog box by clicking the Options command on the Tools menu.) Throughout</b></i><br /> <i><b>this book, you will be instructed to save your projects (or discard them) after you have</b></i><br /> <i><b>completed the programming exercise. For more information about this “delayed saving”</b></i><br /> <i><b>feature and default settings, see the section entitled “Customizing IDE Settings to Match</b></i><br /> <i><b>Step-by-Step Exercises” ]</b></i><br /> <i>5. Click OK to create the new project in Visual Studio.</i><br /> <i>Visual Studio cleans the slate for a new programming project and displays the blank</i><br /> <i>Windows form that you will use to build your user interface.</i><br /> <i>Now you’ll enlarge the form and create the two buttons in the interface.</i><br /> <h4 style="text-align: left;"> <i>Create the user interface</i></h4> <i>1. Point to the lower-right corner of the form until the mouse pointer changes to</i><br /> <i>a resizing</i><br /> <i>pointer, and then drag to increase the size of the form to make room for</i><br /> <i>the objects in your program.</i><br /> <i>As you resize the form, scroll bars might appear in the Designer to give you access to</i><br /> <i>the entire form you’re creating. Depending on your screen resolution and the Visual</i><br /> <i>Studio tools you have open, you might not be able to see the entire form at once.</i><br /> <i>Don’t worry about this—your form can be small, or it can fill the entire screen because</i><br /> <i>the scroll bars give you access to the entire form.</i><br /> <i>Size your form so that it is about the size of the form shown on the following page. If</i><br /> <i>you want to match my example exactly, you can use the width and height dimensions</i><br /> <i>(485 pixels</i><br /> <i>× 278 pixels) shown in the lower-right corner of the screen.</i><br /> <i>To see the entire form without obstruction, you can resize or close the other</i><br /> <i>programming</i><br /> <i>tools, as you learned in Chapter 1. (Return to Chapter 1 if you have</i><br /> <i>questions</i><br /> <i>about resizing windows or tools.)</i><br /> <i></i><br /> <i>Now you’ll practice adding a button object on the form.</i><br /> <div class="separator" style="clear: both; text-align: center;"> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjFbNQoxx3ZaqJD93m8Ap2_gEhHim5-quX7zbn2FDO40muBY0uvim5jxRq5Gvse3YwmME2cnR01Epoms9atrF2e7pXeQ2jdUMHim_jQank84HYiMDtPgSyhYzDdHJfs2yJblszRyUghZ65/s1600/3.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="599" data-original-width="802" height="478" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjFbNQoxx3ZaqJD93m8Ap2_gEhHim5-quX7zbn2FDO40muBY0uvim5jxRq5Gvse3YwmME2cnR01Epoms9atrF2e7pXeQ2jdUMHim_jQank84HYiMDtPgSyhYzDdHJfs2yJblszRyUghZ65/s640/3.jpg" width="640" /></a></div> <i>2. Click the Toolbox tab to display the Toolbox window in the IDE.</i><br /> <i>The Toolbox contains all the controls that you’ll use to build Visual Basic programs in</i><br /> <i>this book. The controls suitable for creating a Windows application are visible now</i><br /> <i>because you selected the Windows Application project type earlier. Controls are</i><br /> <i>organized</i><br /> <i>by type, and by default the Common Controls category is visible. (If the</i><br /> <i>Toolbox is not visible now, click Toolbox on the View menu to display it.)</i><br /> <i>3. Double-click the Button control in the Toolbox, and then move the mouse pointer away</i><br /> <i>from the Toolbox.</i><br /> <i>Visual Studio creates a default-sized button object on the form and hides the Toolbox,</i><br /> <i></i><br /> <i>as shown here:</i><br /> <div class="separator" style="clear: both; text-align: center;"> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhnRqbQQ-4tS6ru23p_jGB4GdPT1BH98B2juWMO24zb3m_kLvBzAr917lJ1WO6hw3D-h7gk7Mh-84LCoBxy1uJTvUhkPYhk2WPlZ8bY3MMn_8ybF6rnx5hPjj-7Agf4NgZWRjXQcYGMWWv3/s1600/4.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="273" data-original-width="480" height="363" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhnRqbQQ-4tS6ru23p_jGB4GdPT1BH98B2juWMO24zb3m_kLvBzAr917lJ1WO6hw3D-h7gk7Mh-84LCoBxy1uJTvUhkPYhk2WPlZ8bY3MMn_8ybF6rnx5hPjj-7Agf4NgZWRjXQcYGMWWv3/s640/4.jpg" width="640" /></a></div> <i>The button is named Button1 because it is the first button in the program. (You should make</i><br /> <i>a mental note of this button name—you’ll see it again when you write your program code.)</i><br /> <i>The new button object is selected and enclosed by resize handles. When Visual Basic is in</i><br /> <i>design</i><br /> <i>mode (that is, whenever the Visual Studio IDE is active), you can move objects on the</i><br /> <i>form by dragging them with the mouse, and you can resize them by using the resize handles.</i><br /> <i>While a program is running, however, the user can’t move user interface (UI) elements unless</i><br /> <i>you’ve changed a property in the program to allow this. You’ll practice moving and resizing</i><br /> <i>the button now.</i><br /> <i><b>Move and resize a button</b></i><br /> <i>1. Point to the button so that the pointer changes to a four-headed arrow, and then drag</i><br /> <i>the button down and to the right.</i><br /> <i>The button moves across the surface of the form. If you move the object near the edge</i><br /> <i>of the form or another object (if other objects are present), it automatically aligns itself</i><br /> <i>to a hidden grid when it is an inch or so away. A little blue “snapline” also appears to</i><br /> <i>help you gauge the distance of this object from the edge of the form or the other</i><br /> <i>object.</i><br /> <i>The grid is not displayed on the form by default, but you can use the snapline</i><br /> <i>to judge distances with almost the same effect.</i><br /> <i>2. Position the mouse pointer on the lower-right corner of the button.</i><br /> <i>When the mouse pointer rests on a resize handle of a selected object, it</i><br /> <i>becomes</i><br /> <i>a resizing</i><br /> <i>pointer. You can use the resizing pointer to change the size</i><br /> <i>of an object.</i><br /> <i>3. Enlarge the button by dragging the pointer down and to the right.</i><br /> <i>When you release the mouse button, the button changes size and snaps to the grid.</i><br /> <i>4. Use the resizing pointer to return the button to its original size.</i><br /> <i>Now you’ll add a second button to the form, below the first button.</i><br /> <i>Add a second button</i><br /> <i>1. Click the Toolbox tab to display the Toolbox.</i><br /> <i>2. Click the Button control in the Toolbox (single-click this time), and then move the</i><br /> <i>mouse pointer over the form.</i><br /> <i>The mouse pointer changes to crosshairs and a button icon. The crosshairs are</i><br /> <i>designed</i><br /> <i>to help you draw the rectangular shape of the button on the form, and you</i><br /> <i>can use this method as an alternative to double-clicking to create a control of the</i><br /> <i>default</i><br /> <i>size.</i><br /> <i>3. Click and drag the pointer down and to the right. Release the mouse button to</i><br /> <i>complete</i><br /> <i></i><br /> <i>the button, and watch it snap to the form.</i><br /> <i>4. Resize the button object so that it is the same size as the first button, and then move it</i><br /> <i>below the first button on the form. (Use the snapline feature to help you.)</i><br /> <i>Tip At any time, you can delete an object and start over again by selecting the object</i><br /> <i>on the form and then pressing DELETE. Feel free to create and delete objects to practice</i><br /> <i>creating</i><br /> <i>your user interface.</i><br /> <i>Now you’ll add the labels used to display the numbers in the program. A label is a special</i><br /> <i>user interface element designed to display text, numbers, or symbols when a program runs.</i><br /> <i>When the user clicks the Lucky Seven program’s Spin button, three random numbers appear</i><br /> <i>in the label boxes. If one of the numbers is a 7, the user wins.</i><br /> <i>Add the number labels</i><br /> <i>1. Double-click the Label control in the Toolbox.</i><br /> <i>Visual Studio creates a label object on the form. The label object is just large enough</i><br /> <i>to hold the text contained in the object (it is rather small now), but it can be resized.</i><br /> <i>2. Drag the Label1 object to the right of the two button objects.</i><br /> <i></i><br /> <i>Your form looks something like this:</i><br /> <div class="separator" style="clear: both; text-align: center;"> <i><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjgP4dZIAnxzhamio7-WGl826cqeHViFLMAx7NXXy8eA5PtJvcQGzLgpymb559TAK79rjqDm8419b7DF6NmEW5IeOnnJXFFf6o3qjDCgDpAUM3xgjD248v0vEFMtRx6vzbs4CtFl0hdbnjR/s1600/5.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="273" data-original-width="480" height="363" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjgP4dZIAnxzhamio7-WGl826cqeHViFLMAx7NXXy8eA5PtJvcQGzLgpymb559TAK79rjqDm8419b7DF6NmEW5IeOnnJXFFf6o3qjDCgDpAUM3xgjD248v0vEFMtRx6vzbs4CtFl0hdbnjR/s640/5.jpg" width="640" /></a></i></div> <div class="separator" style="clear: both; text-align: center;"> <i>3. Double-click the Label control in the Toolbox to create a second label object.</i></div> <br /> <div class="separator" style="clear: both; text-align: center;"> <i>This label object will be named Label2 in the program.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>4. Double-click the Label control again to create a third label object.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>5. Move the second and third label objects to the right of the first one on the form.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Allow plenty of space between the three labels because you will use them to display</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>large numbers when the program runs.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Now you’ll use the Label control to add a descriptive label to your form. This will be</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>the fourth and final label in the program.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>6. Double-click the Label control in the Toolbox.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>7. Drag the Label4 object below the two command buttons.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>When you’ve finished, your four labels should look like those in the following</i></div> <div class="separator" style="clear: both; text-align: center;"> <i></i></div> <div class="separator" style="clear: both; text-align: center;"> <i>screen shot. (You can move your label objects if they don’t look quite right.)</i></div> <div class="separator" style="clear: both; text-align: center;"> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimDDnsJrpHz_XIkIbvxFAk-EbviuFjDs9zC-Un7nA7gCxcg0lFKwu4idxUPHqGFNTCTdeD7bSysxg9xxfEGOgjrEi7xRTmkUaFAF_Fc-6eQD5zHVNSC003InEg_1Np5GenelPNUA0LheYf/s1600/6.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="276" data-original-width="483" height="363" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimDDnsJrpHz_XIkIbvxFAk-EbviuFjDs9zC-Un7nA7gCxcg0lFKwu4idxUPHqGFNTCTdeD7bSysxg9xxfEGOgjrEi7xRTmkUaFAF_Fc-6eQD5zHVNSC003InEg_1Np5GenelPNUA0LheYf/s640/6.jpg" width="640" /></a></div> <div class="separator" style="clear: both; text-align: center;"> <i>Now you’ll add a picture box to the form to graphically display the payout you’ll receive</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>when you draw a 7 and hit the jackpot. A picture box is designed to display bitmaps, icons,</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>digital photos, and other artwork in a program. One of the best uses for a picture box is to</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>display a JPEG image file.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Add a picture</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>1. Click the PictureBox control in the Toolbox.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>2. Using the control’s drawing pointer, create a large rectangular box below the second</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>and third labels on the form.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Leave a little space below the labels for their size to grow as I mentioned earlier.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i></i></div> <div class="separator" style="clear: both; text-align: center;"> <i>When you’ve finished, your picture box object looks similar to this:</i></div> <div class="separator" style="clear: both; text-align: center;"> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfD7C2BFW2xcHaXlhfRKO69B0xtKiKMJU7L-judP8AzqBIEdsxJr6jsDIj6V8m2m_Zj3Oin8xrteMcgwByFYsq7z5vSMsm-mGZwSZUVSVfAhm8JsZd56OQgFq4AHDhbRsddiwI0D4I4AF8/s1600/7.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="273" data-original-width="480" height="363" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfD7C2BFW2xcHaXlhfRKO69B0xtKiKMJU7L-judP8AzqBIEdsxJr6jsDIj6V8m2m_Zj3Oin8xrteMcgwByFYsq7z5vSMsm-mGZwSZUVSVfAhm8JsZd56OQgFq4AHDhbRsddiwI0D4I4AF8/s640/7.jpg" width="640" /></a></div> <div class="separator" style="clear: both; text-align: center;"> <i>This object will be named PictureBox1 in your program; you’ll use this name later in</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>the program code.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Now you’re ready to customize your interface by setting a few properties.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i><b>Setting the Properties</b></i></div> <div class="separator" style="clear: both; text-align: center;"> <i>As you discovered in Chapter 1, you can change properties by selecting objects on the form</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>and changing their settings in the Properties window. You’ll start by changing the property</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>settings for the two buttons.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i><b>Set the button properties</b></i></div> <div class="separator" style="clear: both; text-align: center;"> <i>1. Click the first button (Button1) on the form.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>The button is selected and is surrounded by resize handles.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>2. Click the Properties window title bar.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Tip If the Properties window isn’t visible, click the Properties Window command on the</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>View menu, or press F4.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>3. At the top of the Properties window, click the Categorized button.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>For information about categorized properties, see the section entitled “The Properties</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Window” in Chapter 1.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>4. Resize the Properties window (if necessary) so that there is plenty of room to see the</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>property names and their current settings.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Once you get used to setting properties, you will probably use the Properties window</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>without enlarging it, but making it bigger helps when you first try to use it. The</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Properties window in the following screen shot is a good size for setting properties:</i></div> <div class="separator" style="clear: both; text-align: center;"> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgrWmulNOLt_o-0KTxt8zAnSjVPSt8fELgSbmFuBgdNZUC3GRy8aeLpZSdgtc_6bPptR0P-dNc64eU7JtlazSlaLDJ9VYFU8_MCfw0dpKcg1kb_wZXJbxkE9hnlCCIqG1cIwzx3xv7Jx95F/s1600/8.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="431" data-original-width="292" height="640" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgrWmulNOLt_o-0KTxt8zAnSjVPSt8fELgSbmFuBgdNZUC3GRy8aeLpZSdgtc_6bPptR0P-dNc64eU7JtlazSlaLDJ9VYFU8_MCfw0dpKcg1kb_wZXJbxkE9hnlCCIqG1cIwzx3xv7Jx95F/s640/8.jpg" width="432" /></a></div> <div class="separator" style="clear: both; text-align: center;"> <i>The Properties window lists the settings for the first button. These include settings</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>for the background color, text, font height, and width of the button. Because there are</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>so many properties, Visual Studio organizes them into categories and displays them</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>in outline view. If you want to see the properties in a category, click the arrow sign (>)</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>next to the category title.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>5. If it is not already visible, scroll in the Properties window until you see the Text property</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>located in the Appearance category.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>6. Double-click the Text property in the first column of the Properties window.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>The current Text setting (“Button1”) is highlighted in the Properties window.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>7. Type Spin, and then press ENTER.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>The Text property changes to “Spin” in the Properties window and on the button</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>on the form. Now you’ll change the Text property of the second button to “End.”</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>(You’ll select the second button in a new way this time.)</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>8. Open the Object list at the top of the Properties window.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i></i></div> <div class="separator" style="clear: both; text-align: center;"> <i>A list of the interface objects in your program appears as follows:</i></div> <div class="separator" style="clear: both; text-align: center;"> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgf_mZhpgOewyu0aDPKg8jJvZPh_w7MyD1MrensLpa9tO2EnT5de2yVw_RUEufCRkcej6jTMpXubK4fzID2GmTLcDeBe_O3gIItNzb7tFGrOoI4mcrPnZrNLpqeygfTH6t_mWRCm9EGq-Qg/s1600/9.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="428" data-original-width="292" height="640" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgf_mZhpgOewyu0aDPKg8jJvZPh_w7MyD1MrensLpa9tO2EnT5de2yVw_RUEufCRkcej6jTMpXubK4fzID2GmTLcDeBe_O3gIItNzb7tFGrOoI4mcrPnZrNLpqeygfTH6t_mWRCm9EGq-Qg/s640/9.jpg" width="435" /></a></div> <div class="separator" style="clear: both; text-align: center;"> <i>9. Click Button2 System.Windows.Forms.Button (the second button) in the list box.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>The property settings for the second button appear in the Properties window, and</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Visual Studio highlights Button2 on the form.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>10. Double-click the current Text property (“Button2”), type End, and then press ENTER.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i></i></div> <div class="separator" style="clear: both; text-align: center;"> <i>The text of the second button changes to “End.”</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Tip Using the Object list is a handy way to switch between objects in your program.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>You can also switch between objects on the form by clicking each object.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Now you’ll set the properties for the labels in the program. The first three labels will hold</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>the random numbers generated by the program and will have identical property settings.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>(You’ll set most of them as a group.) The descriptive label settings will be slightly different.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Set the number label properties</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>1. Click the first number label (Label1), hold down the SHIFT key, click the second</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>and third number labels, and then release the SHIFT key. (If the Properties window is</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>in the way, move it to a new place.)</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>A selection rectangle and resize handles appear around each label you click. You’ll</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>change the TextAlign, BorderStyle, and Font properties now so that the numbers that</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>will appear in the labels will be centered, boxed, and identical in font and font size.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>(All these properties are located in the Appearance category of the Properties window.)</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>You’ll also set the AutoSize property to False so that you can change the size of the</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>labels</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>according to your precise specifications. (The AutoSize property is located in the</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Layout category.)</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Tip When more than one object is selected, only those properties that can be changed</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>for the group are displayed in the Properties window.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>2. Click the AutoSize property in the Properties window, and then click the arrow that</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>appears</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>in the second column.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>3. Set the AutoSize property to False so that you can size the labels manually.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>4. Click the TextAlign property, and then click the arrow that appears in the second</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>column.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>A graphical assortment of alignment options appears in the list box; you can use</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>these settings to align text anywhere within the borders of the label object.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>5. Click the center option (MiddleCenter).</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>The TextAlign property for each of the selected labels changes to MiddleCenter.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>6. Click the BorderStyle property, and then click the arrow that appears in the second</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>column.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>The valid property settings (None, FixedSingle, and Fixed3D) appear in the list box.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i></i></div> <div class="separator" style="clear: both; text-align: center;"> <i>7. Click FixedSingle in the list box to add a thin border around each label.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>8. Click the Font property, and then click the ellipsis button (the button with three dots</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>that’s located next to the current font setting).</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>The Font dialog box opens.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>9. Change the font to Times New Roman, the font style to Bold, and the font size to 24,</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>and then click OK.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>The label text appears in the font, style, and size you specified.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Now you’ll set the text for the three labels to the number 0—a good “placeholder” for</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>the numbers that will eventually fill these boxes in your game. (Because the program</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>produces the actual numbers, you could also delete the text, but putting a placeholder</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>here gives you something to base the size of the labels on.)</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>10. Click a blank area on the form to remove the selection from the three labels, and then</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>click the first label.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>11. Double-click the Text property, type 0, and then press ENTER.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>The text of the Label1 object is set to 0. You’ll use program code to set this property</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>to a random “slot machine” number later in this chapter.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>12. Change the text in the second and third labels on the form to 0 also.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>13. Move and resize the labels now so that they are appropriately spaced.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Your form looks something like this:</i></div> <div class="separator" style="clear: both; text-align: center;"> <i></i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Now</i></div> <div class="separator" style="clear: both; text-align: center;"> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9lvdgcOREP2XDjWSCSbMG6_woEZN1CbtdybXBACQQBBgvYhP5_Bi_pEDScvLRlamZZL6zXWLmyCVqWLeqMifJoNWEklD6cDQ40vLbXCs72C8JHixODS5yS4G3XR2kx6A6_5JTjt49jR4I/s1600/9.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="276" data-original-width="483" height="365" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9lvdgcOREP2XDjWSCSbMG6_woEZN1CbtdybXBACQQBBgvYhP5_Bi_pEDScvLRlamZZL6zXWLmyCVqWLeqMifJoNWEklD6cDQ40vLbXCs72C8JHixODS5yS4G3XR2kx6A6_5JTjt49jR4I/s640/9.jpg" width="640" /></a></div> <br /> <div class="separator" style="clear: both; text-align: center;"> </div> <div class="separator" style="clear: both; text-align: center;"> <i>Now you’ll change the Text, Font, and ForeColor properties of the fourth label.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Set the descriptive label properties</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>1. Click the fourth label object (Label4) on the form.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>2. Change the Text property in the Properties window to Lucky Seven.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>3. Click the Font property, and then click the ellipsis button.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>4. Use the Font dialog box to change the font to Arial, the font style to Bold, and the font</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>size to 18. Then click OK.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>The font in the Label4 object is updated, and the label is resized automatically to hold</i></div> <div class="separator" style="clear: both; text-align: center;"> <i></i></div> <div class="separator" style="clear: both; text-align: center;"> <i>the larger font size because the object’s AutoSize property is set to True.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>5. Click the ForeColor property in the Properties window, and then click the arrow in</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>the second column.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Visual Studio displays a list box with Custom, Web, and System tabs for setting the</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>foreground colors (the color of text) of the label object. The Custom tab offers many of</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>the colors available in your system. The Web tab sets colors for Web pages and lets you</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>pick colors using their common names. The System tab displays the current colors used</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>for user interface elements in your system.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>6. Click the purple color on the Custom tab.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>The text in the label box changes to purple.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Now you’re ready to set the properties for the last object.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>The Picture Box Properties</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>When the person playing your game hits the jackpot (that is, when at least one 7 appears in</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>the number labels on the form), the picture box object will contain a picture in JPEG format</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>of a person dispensing money. (I am supplying you with this digitized image, but you can</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>substitute your own if you like.) You need to set the SizeMode property to accurately size the</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>picture and set the Image property to specify the name of the JPEG file that you will load</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>into the picture box. You also need to set the Visible property, which specifies the picture</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>state at the beginning of the program.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Set the picture box properties</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>1. Click the picture box object on the form.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>2. Click the SizeMode property in the Properties window (listed in the Behavior category),</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>click the arrow in the second column, and then click StretchImage.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Setting SizeMode to StretchImage before you open a graphic causes Visual Studio to</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>resize the graphic to the exact dimensions of the picture box. (Typically, you set this</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>property before you set the Image property.)</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>3. Click the Image property in the Properties window, and then click the ellipsis button</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>in the second column.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>The Select Resource dialog box opens.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>4. Click the Local Resource radio button, and then click the Import button.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>5. In the Open dialog box, navigate to the C:\Vb10sbs\Chap02 folder.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>This folder contains the digital photo PayCoins.jpg.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>6. Select PayCoins.jpg, and then click Open.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>An screen shot of one person paying another appears in the Select Resource</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>dialog</i></div> <div class="separator" style="clear: both; text-align: center;"> <i></i></div> <div class="separator" style="clear: both; text-align: center;"> <i>box. (The letter “W” represents winning.)</i></div> <div class="separator" style="clear: both; text-align: center;"> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_JD0TzLrz5rlqCFPklIGcyHLO1nQMG-7SnnuBl0xdLjbsgOilLPL7Ly3kmoktEMyHANOYC0V-OPiqjO1u4C3LpLSjB28S1Bf-34Gsxrb88ulDK6jOd9X6J7z-5KqEVZr3NrDljqJveexn/s1600/9.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="388" data-original-width="575" height="427" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_JD0TzLrz5rlqCFPklIGcyHLO1nQMG-7SnnuBl0xdLjbsgOilLPL7Ly3kmoktEMyHANOYC0V-OPiqjO1u4C3LpLSjB28S1Bf-34Gsxrb88ulDK6jOd9X6J7z-5KqEVZr3NrDljqJveexn/s640/9.jpg" width="640" /></a></div> <div class="separator" style="clear: both; text-align: center;"> <i>7. Click OK.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>The PayCoins photo is loaded into the picture box. Because the photo is relatively small</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>(24 KB), it opens quickly on the form.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>8. Resize the picture box object now to fix any distortion problems that you see in the</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>image.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>I sized my picture box object to be 144 pixels wide by 146 pixels high. You can match</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>this size by using the width and height dimensions located on the lower-right side</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>of the Visual Studio IDE. (The dimensions of the selected object are given on the</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>lower-</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>right side, and the location on the form of the object’s upper-left corner is given</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>to the left of the dimensions.)</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>This particular image displays best when the picture box object retains a square shape.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Note As you look at the picture box object, you might notice a tiny shortcut arrow called</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>a smart tag near its upper-right corner. This smart tag is a button that you can click to</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>quickly change a few common picture box settings and open the Select Resource dialog</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>box. (You’ll see the smart tag again in Chapter 4, “Working with Menus, Toolbars, and</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Dialog Boxes,” when you use the ToolStrip control.)</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Now you’ll change the Visible property to False so that the image will be invisible when</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>the program starts.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>9. Click the Visible property in the Behavior category of the Properties window, and then</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>click the arrow in the second column.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>The valid settings for the Visible property appear in a list box.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i></i></div> <div class="separator" style="clear: both; text-align: center;"> <i>10. Click False to make the picture invisible when the program starts.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Setting the Visible property to False affects the picture box when the program runs, but</i></div> <div class="separator" style="clear: both; text-align: center;"> <i></i></div> <div class="separator" style="clear: both; text-align: center;"> <i>not now, while you’re designing it. Your completed form looks similar to this:</i></div> <div class="separator" style="clear: both; text-align: center;"> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMz7DJz8EiXrZMEq20-Ka-R27-WAtL7352XpTTbEyeZTXjb2YnMO-hp_BRLra3zyoaUmEdefJsFgL2G_pphIP_7jJxaRKT37SH8vMGf3qrGfAAAKcbdeRjFbBqgrEreRWLrgJWnePEI08N/s1600/9.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="276" data-original-width="483" height="364" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMz7DJz8EiXrZMEq20-Ka-R27-WAtL7352XpTTbEyeZTXjb2YnMO-hp_BRLra3zyoaUmEdefJsFgL2G_pphIP_7jJxaRKT37SH8vMGf3qrGfAAAKcbdeRjFbBqgrEreRWLrgJWnePEI08N/s640/9.jpg" width="640" /></a></div> <div class="separator" style="clear: both; text-align: center;"> <i>Tip You can also double-click property names that have True and False settings (so-called</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Boolean properties), to toggle back and forth between True and False. Default Boolean</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>properties are shown in regular type, and changed settings appear in bold.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>11. You are finished setting properties for now, so if your Properties window is floating,</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>hold down the CTRL key and double-click its title bar to return it to the docked</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>position.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Reading Properties in Tables</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>In this chapter, you’ve set the properties for the Lucky Seven program step by step.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>In future chapters, the instructions to set properties will be presented in table format</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>unless a setting is especially tricky. Table 2-2 lists the properties you’ve set so far in the</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Lucky Seven program, as they’d look later in the book. Settings you need to type in are</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>shown in quotation marks. You shouldn’t type the quotation marks.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>TABLE 2-2 Lucky Seven Properties</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Object Property Setting</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Button1 Text “Spin”</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Button2 Text “End”</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Label1, Label2, Label3 AutoSize</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>BorderStyle</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Font</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Text</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>TextAlign</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>False</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>FixedSingle</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Times New Roman, Bold, 24-point</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>“0”</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>MiddleCenter</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Label4 Text</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Font</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>ForeColor</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>“Lucky Seven”</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Arial, Bold, 18-point</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Purple</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>PictureBox1 Image</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>SizeMode</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Visible</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>“C:\Vb10sbs\Chap02\Paycoins.jpg”</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>StretchImage</i></div> <div class="separator" style="clear: both; text-align: center;"> <i></i></div> <div class="separator" style="clear: both; text-align: center;"> <i>False</i></div> <h2 style="clear: both; text-align: center;"> <i>Writing the Code</i></h2> <div class="separator" style="clear: both; text-align: center;"> <i>Now you’re ready to write the code for the Lucky Seven program. Because most of the</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>objects</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>you’ve created already “know” how to work when the program runs, they’re ready</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>to receive input from the user and process it. The inherent functionality of objects is one</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>of the great strengths of Visual Studio and Visual Basic—after objects are placed on a form</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>and their properties are set, they’re ready to run without any additional programming.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>However, the “meat” of the Lucky Seven game—the code that actually calculates random</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>numbers, displays them in boxes, and detects a jackpot—is still missing from the program.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>This computing logic can be built into the application only by using program statements—</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>code that clearly spells out what the program should do at each step of the way. Because</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>the Spin and End buttons drive the program, you’ll associate the code for the game with</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>those buttons. You enter and edit Visual Basic program statements in the Code Editor.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>In the following steps, you’ll enter the program code for Lucky Seven in the Code Editor.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Use the Code Editor</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>1. Double-click the End button on the form.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>The Code Editor appears as a tabbed document window in the center of the Visual</i></div> <div class="separator" style="clear: both; text-align: center;"> <i></i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Studio IDE, as shown here:</i></div> <div class="separator" style="clear: both; text-align: center;"> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgHc6Aceg0U4YvB24BCUW6ktZ_3raOAqE33514X2pcuGnbvRismsMRuP2btCZNewtLfW-DB57oIzAUOGq2jyL6StUhSn2hmJQG7UqLVxj6Xg1eDuSIeGiCAr4nqhv9sY31FgZzSo7cCGAYU/s1600/9.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="599" data-original-width="801" height="478" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgHc6Aceg0U4YvB24BCUW6ktZ_3raOAqE33514X2pcuGnbvRismsMRuP2btCZNewtLfW-DB57oIzAUOGq2jyL6StUhSn2hmJQG7UqLVxj6Xg1eDuSIeGiCAr4nqhv9sY31FgZzSo7cCGAYU/s640/9.jpg" width="640" /></a></div> <div class="separator" style="clear: both; text-align: center;"> <i>Inside the Code Editor are program statements associated with the current form.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Program statements that are used together to perform some action are typically</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>grouped in a programming construct called a procedure. A common type of procedure</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>is a Sub procedure, sometimes called a subroutine. Sub procedures include a Sub</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>keyword</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>in the first line and end with End Sub. (I’ll talk about the Public and Private</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>keywords later.) Procedures are typically executed when certain events occur, such as</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>when a button is clicked. When a procedure is associated with a particular object and</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>an event, it is called an event handler or an event procedure.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>When you double-clicked the End button (Button2), Visual Studio automatically added</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>the first and last lines of the Button2_Click event procedure, as the following code</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>shows. (The first line was wrapped to stay within the book margins.) You may notice</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>other bits of code in the Code Editor (words like Public and Class), which Visual Studio</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>has added to define important characteristics of the form, but I won’t emphasize</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>them here.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Private Sub Button2_Click(ByVal sender As System.Object, _</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>ByVal e As System.EventArgs) Handles Button2.Click</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>End Sub</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>The body of a procedure fits between these lines and is executed whenever a user</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>activates the interface element associated with the procedure. In this case, the event</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>is a mouse click, but as you’ll see later in the book, it could also be a different type</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>of event.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>2. Type End, and then press the ENTER key.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>When you type the statement, Visual Studio recognizes End as a unique reserved word</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>or keyword and displays it in a list box with Common and All tabs. Microsoft calls this</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>auto-extend feature IntelliSense because it tries to intelligently help you write code,</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>and you can browse through various Visual Basic keywords and objects alphabetically.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>(In this way, the language is partially discoverable through the IDE itself.)</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>After you press the ENTER key, the letters in End turn blue and are indented, indicating</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>that Visual Basic recognizes End as one of several hundred unique keywords within</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>the Visual Basic language. You use the End keyword to stop your program and</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>remove</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>it from the screen. In this case, End is also a complete program statement,</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>a self-</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>contained instruction executed by the Visual Basic compiler, the part of Visual</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Studio that processes</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>or parses each line of Visual Basic source code, combining the</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>result with other</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>resources to create an executable file. Program statements are a little</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>like complete</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>sentences in a human language—statements can be of varying lengths</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>but must follow the grammatical “rules” of the compiler. In Visual Studio, program</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>statements</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>can be composed of keywords, properties, object names, variables,</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>numbers,</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>special symbols, and other values. You’ll learn more about how program</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>statements are constructed in Chapter 5.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>As you enter program statements and make other edits, the Code Editor handles many</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>of the formatting details for you, including adjusting indentation and spacing</i></div> <div class="separator" style="clear: both; text-align: center;"> <i></i></div> <div class="separator" style="clear: both; text-align: center;"> <i>and</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>adding</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>any necessary parentheses. The exact spelling, order, and spacing of items within</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>program statements is referred to as statement syntax. In the early days of compilers,</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>programmers were almost totally responsible for getting the precise syntax for each</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>program statement correct on their own, but now sophisticated development tools such</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>as Visual Studio help immensely with the construction of accurate program statements.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>When you pressed the ENTER key, the End statement was indented to set it apart</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>from the Private Sub and End Sub statements. This indenting scheme is one of the</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>programming</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>conventions you’ll see throughout this book to keep your programs clear</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>and readable. The group of conventions regarding how code is organized in a program</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>is often referred to as program style.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Now that you’ve written the code associated with the End button, you’ll write code for the</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Spin button. These program statements will be a little more extensive and will give you</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>a chance to learn more about statement syntax and program style. You’ll study many of the</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>program statements later in this book, so you don’t need to know everything about them</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>now. Just focus on the general structure of the code and on typing the program statements</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>exactly as they are printed.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Write code for the Spin button</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>1. At the top of the Solution Explorer window, click the View Designer button in the</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Solution Explorer window to display your form again.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Note When the Code Editor is visible, you won’t be able to see the form you’re working</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>on. The View Designer button is one mechanism you can use to display it again. (If more</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>than one form is loaded in Solution Explorer, click the form that you want to display first.)</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>You can also click the Form1.vb [Design] tab at the top edge of the Code Editor. To display</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>the Code Editor again, click the View Code button in Solution Explorer.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>2. Double-click the Spin button.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>After a few moments, the Code Editor appears, and an event procedure associated with</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>the Button1 button appears near the Button2 event procedure.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Although you changed the text of this button to “Spin,” its name in the program is</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>still Button1. (The name and the text of an interface element can be different to suit</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>the needs of the programmer.) Each object can have several procedures associated</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>with it, one for each event it recognizes. The click event is the one you’re interested</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>in now because</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>users will click the Spin and End buttons when they run the program.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>3. Type the following program lines between the Private Sub and End Sub statements.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Press ENTER after each line, press TAB to indent, and take care to type the program</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>statements exactly as they appear here. (The Code Editor will scroll to the left as you</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>enter the longer lines.) If you make a mistake (usually identified by a jagged underline),</i></div> <div class="separator" style="clear: both; text-align: center;"> <i></i></div> <div class="separator" style="clear: both; text-align: center;"> <i>delete the incorrect statements and try again.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Tip As you enter the program code, Visual Basic formats the text and displays different</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>parts of the program in color to help you identify the various elements. When you begin</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>to type a property, Visual Basic also displays the available properties for the object you’re</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>using in a list box, so you can double-click the property or keep typing to enter it yourself.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>If Visual Basic displays an error message, you might have misspelled a program statement.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Check the line against the text in this book, make the necessary correction, and continue</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>typing. (You can also delete a line and type it from scratch.) In addition, Visual Basic might</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>add necessary code automatically. For example, when you type the following code, Visual</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Basic automatically adds the End If line. Readers of previous editions of this book have</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>found this first typing exercise to be the toughest part of this chapter—“But Mr. Halvorson,</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>I know I typed it just as you wrote it!”—so please give this program code your closest</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>attention.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>I promise you, it works!</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>PictureBox1.Visible = False ' hide picture</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Label1.Text = CStr(Int(Rnd() * 10)) ' pick numbers</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Label2.Text = CStr(Int(Rnd() * 10))</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Label3.Text = CStr(Int(Rnd() * 10))</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>' if any number is 7 display picture and beep</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>If (Label1.Text = "7") Or (Label2.Text = "7") _</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Or (Label3.Text = "7") Then</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>PictureBox1.Visible = True</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Beep()</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>End If</i></div> <div class="separator" style="clear: both; text-align: center;"> <i></i></div> <div class="separator" style="clear: both; text-align: center;"> <i>When you’ve finished, the Code Editor looks as shown in the following screen shot:</i></div> <div class="separator" style="clear: both; text-align: center;"> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhv2OmRH0IDFaZ6-kObCdgVp0ewvEJzAA3dBnisZnBwXAxES1b3PsPyW4hn3lP5NHKtQZLQi2eprr2qTxxvO1UcY_T7A38KjfdnT0-OzyXULykK3E0bNE44AK6cT09B96_NqhN5bGEKAMzO/s1600/9.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="599" data-original-width="802" height="478" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhv2OmRH0IDFaZ6-kObCdgVp0ewvEJzAA3dBnisZnBwXAxES1b3PsPyW4hn3lP5NHKtQZLQi2eprr2qTxxvO1UcY_T7A38KjfdnT0-OzyXULykK3E0bNE44AK6cT09B96_NqhN5bGEKAMzO/s640/9.jpg" width="640" /></a></div> <div class="separator" style="clear: both; text-align: center;"> <i>4. Click the Save All command on the File menu to save your additions to the program.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>The Save All command saves everything in your project—the project file, the form</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>file, any code modules, and other related components in your application. Since</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>this is the first time that you have saved your project, the Save Project dialog box</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>opens, prompting you for the name and location of the project. (If your copy of</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Visual Studio is configured to prompt you for a location when you first create your</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>project,</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>you won’t see the Save Project dialog box now—Visual Studio just saves</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>your changes.)</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>5. Browse and select a location for your files.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>I recommend that you use the C:\Vb10sbs\Chap02 folder (the location of the book’s</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>sample files), but the location is up to you. Since you used the “My” prefix when you</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>originally opened your project, this version won’t overwrite the Lucky7 practice file that</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>I built for you on disk.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>6. Clear the Create Directory For Solution check box.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>When this check box is selected, it creates a second folder for your program’s solution</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>files, which is not necessary for solutions that contain only one project (the situation for</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>most programs in this book).</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>7. Click Save to save your files.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Note If you want to save just the item you are currently working on (the form, the code</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>module, or something else), you can use the Save command on the File menu. If you want</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>to save the current item with a different name, you can use the Save As command.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>A Look at the Button1_Click Procedure</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>The Button1_Click procedure is executed when the user clicks the Spin button on the form.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>The procedure uses some pretty complicated statements, and because I haven’t formally</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>introduced</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>them yet, it might look a little confusing. However, if you take a closer look,</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>you’ll probably see a few things that look familiar. Taking a peek at the contents of these</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>procedures</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>will give you a feel for the type of program code you’ll be creating later in</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>this book. (If you’d rather not stop for this preview, feel free to skip to the next section,</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>“Running Visual Basic Applications.”)</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>The Button1_Click procedure performs three tasks:</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>n It hides the digital photo.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>n It creates three random numbers for the number labels.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i></i></div> <div class="separator" style="clear: both; text-align: center;"> <i>n It displays the photo when the number 7 appears.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Let’s look at each of these steps individually.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Hiding the photo is accomplished with the following line:</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>PictureBox1.Visible = False ' hide picture</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>This line is made up of two parts: a program statement and a comment.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>The PictureBox1.Visible = False program statement sets the Visible property of the picture</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>box object (PictureBox1) to False (one of two possible settings). You might remember that</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>you set this property to False once before by using the Properties window. You’re doing</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>it again now in the program code because the first task is a spin and you need to clear</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>away a photo that might have been displayed in a previous game. Because the property</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>will be changed at run time and not at design time, you must set the property by using</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>program</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>code. This is a handy feature of Visual Basic, and I’ll talk about it more in Chapter 3,</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>“Working with Toolbox Controls.”</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>The second part of the first line (the part displayed in green type on your screen) is called</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>a comment. Comments are explanatory notes included in program code following a single</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>quotation mark (‘). Programmers use comments to describe how important statements work</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>in a program. These notes aren’t processed by Visual Basic when the program runs; they exist</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>only to document what the program does. You’ll want to use comments often when you</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>write Visual Basic programs to leave an easy-to-understand record of what you’re doing.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>The next three lines handle the random number computations. Does this concept sound</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>strange? You can actually make Visual Basic generate unpredictable numbers within specific</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>guidelines—in other words, you can create random numbers for lottery contests, dice</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>games, or other statistical patterns. The Rnd function in each line creates a random number</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>between</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>0 and 1 (a number with a decimal point and several decimal places), and the Int</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>function returns the integer portion of the result of multiplying the random number by 10.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>This computation</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>creates random numbers between 0 and 9 in the program—just what you</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>need for this particular slot machine application.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Label1.Text = CStr(Int(Rnd() * 10)) ' pick numbers</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>You then need to jump through a little hoop in your code. You need to copy these random</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>numbers</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>into the three label boxes on the form, but first the numbers need to be converted</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>to</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>text with the CStr (convert to string) function. Notice how CStr, Int, and Rnd are all connected</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>in</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>the program statement—they work collectively to produce a result like a mathematical</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>formula.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>After the computation and conversion, the values are assigned to the Text properties of the</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>first three labels on the form, and the assignment causes the numbers</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>to be displayed in bold,</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>24-point, Times New Roman font in the three number labels.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>The last group of statements in the program checks whether any of the random numbers is 7.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>If one or more of them is, the program displays the graphical depiction of a payout, and a</i></div> <div class="separator" style="clear: both; text-align: center;"> <i></i></div> <div class="separator" style="clear: both; text-align: center;"> <i>beep announces the winnings.</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>' if any number is 7 display picture and beep</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>If (Label1.Text = "7") Or (Label2.Text = "7") _</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Or (Label3.Text = "7") Then</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>PictureBox1.Visible = True</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Beep()</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>End If</i></div> <div class="separator" style="clear: both; text-align: center;"> <i>Each time the user clicks the Spin button, the Button1_Click procedure is executed, or called,</i></div> <div class="separator" style="clear: both; text-align: center;"> <i></i></div> <div class="separator" style="clear: both; text-align: center;"> <i>and the program statements in the procedure are run again.</i></div> </div>

Learn about Microsoft Visual Basic 2010 Writing Your First Program Step by Step

0 September 28, 2018

Writing Your First Program After completing this chapter, you will be able to:  Create the user interface for a new program. Set the properties for each object in your user interface. Write program code. Save and run the program.  Build an executabl… Read more »

Read more »

What is Zener diode ? what do you know about Zener Diode and its Working function ?

<div dir="ltr" style="text-align: left;" trbidi="on"> <br /> <h2 style="text-align: left;"> <i style="mso-bidi-font-style: normal;">                            <u>Zener Diode</u></i></h2> <div class="MsoNormal"> <i>                         A properly doped crystals diode which has a sharp breakdown voltage is known as Zener diode.<o:p></o:p></i></div> <div class="MsoNormal"> <i>The circuit symbol and characteristics curve of a zener Diode is shown below,</i><o:p></o:p></div> <br /> <table cellpadding="0" cellspacing="0" class="tr-caption-container" style="float: right; margin-left: 1em; text-align: right;"><tbody> <tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgNI5WLwKQX13MmJDHWMhVSBMWk0UmJiU0JCm6_n3dj4Z9-hQAXuNO3OlLo4opclkhN6xAbB7xAFyTlCIB8GZN3pUFx_pXPBJwNh9PhIGsmgm5beeC-a5SIEGCOdFtDwLhvQII0FCZRQOWs/s1600/Zener-Diode-and-Its-Symbol.jpg" imageanchor="1" style="clear: right; margin-bottom: 1em; margin-left: auto; margin-right: auto;"><img border="0" data-original-height="223" data-original-width="603" height="147" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgNI5WLwKQX13MmJDHWMhVSBMWk0UmJiU0JCm6_n3dj4Z9-hQAXuNO3OlLo4opclkhN6xAbB7xAFyTlCIB8GZN3pUFx_pXPBJwNh9PhIGsmgm5beeC-a5SIEGCOdFtDwLhvQII0FCZRQOWs/s400/Zener-Diode-and-Its-Symbol.jpg" width="400" /></a></td></tr> <tr><td class="tr-caption" style="text-align: center;">Circuit symbol (Image taken from google image)</td></tr> </tbody></table> <div class="MsoNormal"> <br /></div> <div class="MsoNormal"> <br /></div> <div class="MsoNormal"> <br /></div>                         <i>The forward characteristics of a zener is similar to that of an ordinary diode.The reverse characteristics exhibits a region in which the voltage across the diode is almost independent of diode current. This fact makes </i><br /> <div> <i>Zener Diode useful as a voltage </i></div> <div> <i>regulator </i><i>device.</i><br /> <div> <br /> <br /> <table cellpadding="0" cellspacing="0" class="tr-caption-container" style="float: right; margin-left: 1em; text-align: right;"><tbody> <tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigOmZ86va4KiYVUtCEh6cOUH6F7-Z8fvuuM2rofSRgeOZ2qDDFq1SkuycEn9OPrBOltqGNVdq0TfRcw4Bp8u_qxqAE6ob7gPnryGtJ_XWSvyXOkUe12pduzuXuu9tEIMLXHbJeU6W5Wi2Z/s1600/image_130.png" imageanchor="1" style="clear: right; margin-bottom: 1em; margin-left: auto; margin-right: auto;"><img border="0" data-original-height="396" data-original-width="608" height="208" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigOmZ86va4KiYVUtCEh6cOUH6F7-Z8fvuuM2rofSRgeOZ2qDDFq1SkuycEn9OPrBOltqGNVdq0TfRcw4Bp8u_qxqAE6ob7gPnryGtJ_XWSvyXOkUe12pduzuXuu9tEIMLXHbJeU6W5Wi2Z/s320/image_130.png" width="320" /></a></td></tr> <tr><td class="tr-caption" style="text-align: center;">Characteristics curve of zener diode (image taken from google image)</td></tr> </tbody></table> <ul style="text-align: left;"> <li><i>Manufacturers generally specify Zener diodes according to their Zener voltage (Vz) and maximum allowable power dissipation Pz.                                                                                                       If Vz is the voltage of the Zener Diode then maximum rated current,                                                          </i><div class="MsoNormal">                           Iz_{max = (Pz/Vz)                                                                                                                                        <i> <span style="font-size: small;"> If current through Zener exceeds Izm, it will be destroyed.</span></i>}</div> <div class="MsoNormal"> <!--[endif]--><i><o:p></o:p></i></div> </li> <li>_{<i><span style="font-size: small;">Another parameter of interest is knee current which correspond to the knee of reverse characteristics curve. Below the knee current </span></i>} Iz_{min <span style="font-size: small;">, <i>Zener fail to regulate output voltage.</i></span>}</li> </ul> <h3 style="text-align: left;"> <i>         Zener Diode as a Voltage Regulator</i></h3> <div> <i>                            In a voltage regulated power supply, the output voltage is constant and its independent of variation of input supply voltage and load current. The circuit diagram of a Zener diode voltage regulator is shown below.</i></div> <div> <div class="separator" style="clear: both; text-align: center;"> <br /></div> <div class="separator" style="clear: both; text-align: center;"> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhG0vNmcCSRUdSk993vKLPHB5BQwz0irHvkeu0jFOsWPgrLPRyqxDSvOaTNDDaJwbYNv963i-7PJ03Ta-bKZj_4MAQPPVQ-BcRnLh5qlm9EtXFiCrZ2dh97Ei33Nrh8ccOp6RxrbUvsdxPL/s1600/IMG_20180927_120806_HDR.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="973" data-original-width="1600" height="242" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhG0vNmcCSRUdSk993vKLPHB5BQwz0irHvkeu0jFOsWPgrLPRyqxDSvOaTNDDaJwbYNv963i-7PJ03Ta-bKZj_4MAQPPVQ-BcRnLh5qlm9EtXFiCrZ2dh97Ei33Nrh8ccOp6RxrbUvsdxPL/s400/IMG_20180927_120806_HDR.jpg" width="400" /></a></div> <i><br /></i></div> <div> <i><br /></i></div> <div> <i><br /></i></div> <h4 style="text-align: left;"> <i>Principle of Working</i></h4> <div> <i>In the breakdown region, the output across the zener diode is almost independent of current through it. Hence zener diode maintain a constant output voltage </i>V₀≈ V_{z <span style="font-size: small;">, <i>independent of variation of load current (Load regulation) or variation of input voltage   </i></span>}<i>V_{i   (<span style="font-size: small;">Line Regulation</span>) <span style="font-size: small;">as along as the diode is at break down region.</span>}</i></div> <div> <div class="separator" style="clear: both; text-align: center;"> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiD85O3f96Ey98eRVevvuI-6g6CAPw1cAYhEJ-eZlLnG6pJBjVi5fvCjVZiqyMv-UpeKUWkc1agJiMf3PY2yiwQI8WTQlbHGxpmVvbtq3X53bqVAOwxO7hYtiGVrDuFUDxHk8AnIjqQuZsm/s1600/IMG_20180927_120923_HDR.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="337" data-original-width="1600" height="132" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiD85O3f96Ey98eRVevvuI-6g6CAPw1cAYhEJ-eZlLnG6pJBjVi5fvCjVZiqyMv-UpeKUWkc1agJiMf3PY2yiwQI8WTQlbHGxpmVvbtq3X53bqVAOwxO7hYtiGVrDuFUDxHk8AnIjqQuZsm/s640/IMG_20180927_120923_HDR.jpg" width="640" /></a></div> <h4 style="text-align: left;"> <i>_{<span style="font-size: small;">Variation of Output Voltage with Load current</span>}</i></h4> </div> <div style="text-align: left;"> <i>_{<span style="font-size: small;">                        To discuss this we take Vi remains constant and </span>}</i>I_L_{<span style="font-size: small;"><i> to vary, Since </i></span>}V₀≈ V_{z <span style="font-size: small;">, across Zener is fixed; it is independent of </span>}<i> </i>I_L</div> <div class="MsoNormal"> _<o:p></o:p></div> <div style="text-align: left;"> _{<span style="font-size: small;"><i> . </i></span>}<br /> <div class="separator" style="clear: both; text-align: center;"> <span style="font-size: small;"><i><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCM51ab86_FoIv-3wkpS_dWKgRy1nSpfGPFjBRJOOLoKzKWjQ_M9vaK2N5LEpk6N6pO9KKHI-B3ka91CAAaNBykKSeicooP7lGtrvwwrtBxZlCvOsUsWDwawFbngBMefd3KCAacIpNcxFO/s1600/IMG_20180927_120904_HDR.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="338" data-original-width="1600" height="134" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCM51ab86_FoIv-3wkpS_dWKgRy1nSpfGPFjBRJOOLoKzKWjQ_M9vaK2N5LEpk6N6pO9KKHI-B3ka91CAAaNBykKSeicooP7lGtrvwwrtBxZlCvOsUsWDwawFbngBMefd3KCAacIpNcxFO/s640/IMG_20180927_120904_HDR.jpg" width="640" /></a></i></span></div> </div> <div style="text-align: left;"> _{<span style="font-size: small;"><i>                         Thus if load current (</i></span>}I_{L) <span style="font-size: small;"><i>increases, when the supply voltage is fixed, the Zener current </i></span>}<i>_{<span style="font-size: small;"> </span>}</i> Iz <i>decreases by the same amount ; but V₀≈ V_{z   <span style="font-size: small;">remain constant.</span>}</i></div> <h4 style="text-align: left;"> <i>_{<span style="font-size: small;">Variation of Output Voltage with Input Voltage</span>}</i></h4> <div> <i>_{<span style="font-size: small;">                             We take now </span>}</i>_{<span style="font-size: small;"><i> </i></span>}I_{L <span style="font-size: small;"><i>,</i></span>}R_{L <span style="font-size: small;"><i>remains constant and </i></span>}<i>V_{i   <span style="font-size: small;">varying. Since </span>}</i>V_{0 <span style="font-size: small;"><i> tends to remain constant at Vz, </i></span>}<i> </i>I_{L <span style="font-size: small;"><i>remains constant.</i></span>}</div> <div> <div class="separator" style="clear: both; text-align: center;"> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgFjdDovkS0r6VYPKOCYXc0hwb1OFThSGHi9D5adFX2sK_RJBlWVhZlLl5-4i_xsV8gr5KLMC9b3_pDvrmoLfgCUGPZm0IuW7f2a6yJ4Nw4MglQmqVsCR6cH0FpMwJ5cKHTlri67WJL8wRN/s1600/IMG_20180927_120938_HDR.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="929" data-original-width="1600" height="232" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgFjdDovkS0r6VYPKOCYXc0hwb1OFThSGHi9D5adFX2sK_RJBlWVhZlLl5-4i_xsV8gr5KLMC9b3_pDvrmoLfgCUGPZm0IuW7f2a6yJ4Nw4MglQmqVsCR6cH0FpMwJ5cKHTlri67WJL8wRN/s400/IMG_20180927_120938_HDR.jpg" width="400" /></a></div> _{<span style="font-size: small;"><i>i.e. In this case Zener current and total current change such ways as to maintain </i></span>}<i> </i>I_{L <span style="font-size: small;"><i>constant and hence to constant i.e. </i></span>}V_{0 <span style="font-size: small;">=</span>}I_LR_{L <span style="font-size: small;">. <i>to be constant.</i></span>}</div> <h4 style="text-align: left;"> <i>_{<span style="font-size: small;"><br /></span>}</i></h4> <div class="MsoNormal"> _<o:p></o:p></div> </div> </div> </div>

What is Zener diode ? what do you know about Zener Diode and its Working function ?

0 September 27, 2018

                            Zener Diode                          A properly doped crystals diode which has a sharp breakdown voltage is known as Zener diode. The circuit symbol and characteristics curve of a zener Diode is shown below, Circuit symbo… Read more »

Read more »

What is Modulation and Demodulation of a Audio signal ? What is carrier wave of a Audio signal ?

<div dir="ltr" style="text-align: left;" trbidi="on"> <h2 style="text-align: left;"> <i>                       <span style="color: red;">  </span><span style="color: #741b47;"><u> </u><u>Modulation & Demodulation</u></span></i></h2> <div> <i><span style="color: #741b47;"><u><br /></u></span></i></div> <table cellpadding="0" cellspacing="0" class="tr-caption-container" style="float: right; margin-left: 1em; text-align: right;"><tbody> <tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJLe3JK7-0v_FgRKbKkugEF4Q87dJRDUZt-NECPBkDug_D8twNctS58VgtHKk639RCeVVO4cq9jUABCAW-QNWJPynjBlbjhvHGzo74GsIyBXZJuWBg5Q6moesg_-tPVNQUKn1VWiU0dOPc/s1600/Image-8.png" imageanchor="1" style="clear: right; margin-bottom: 1em; margin-left: auto; margin-right: auto;"><img border="0" data-original-height="900" data-original-width="1600" height="180" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJLe3JK7-0v_FgRKbKkugEF4Q87dJRDUZt-NECPBkDug_D8twNctS58VgtHKk639RCeVVO4cq9jUABCAW-QNWJPynjBlbjhvHGzo74GsIyBXZJuWBg5Q6moesg_-tPVNQUKn1VWiU0dOPc/s320/Image-8.png" width="320" /></a></td></tr> <tr><td class="tr-caption" style="text-align: center;">Modulation and Demodulation  (image searched from google image)</td></tr> </tbody></table> <div> <i>                      In radio or wireless communication systems audio signal is first converted into corresponding electrical signal with the help of a microphone. This electrical signal has frequency in the audible range (20 Hz to 20 kHz) and can not be directly and efficiently radiated into space in the form of EM radio wave by using a transmitting antenna. For direct radiation of audio frequency electrical signals through antenna, We require an antenna of impractical size.</i></div> <div>            [ Let a signal of 1 kHz. Then the wavelength,</div> <div class="separator" style="clear: both; text-align: center;"> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhD3yuR7FfAcI99rx62XMlK0oI63Ihr8ehKVIkTkTpj5_tythUB8oZSnv_SWEB6DrJg2oviqn8MBmYOEBFJ3au4LizJ8KgaV-LO5necejgowz5F07eyQjIKTm4mivIG-bIlRBRleD-BMnVI/s1600/IMG_20180926_143522.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="222" data-original-width="1600" height="44" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhD3yuR7FfAcI99rx62XMlK0oI63Ihr8ehKVIkTkTpj5_tythUB8oZSnv_SWEB6DrJg2oviqn8MBmYOEBFJ3au4LizJ8KgaV-LO5necejgowz5F07eyQjIKTm4mivIG-bIlRBRleD-BMnVI/s320/IMG_20180926_143522.jpg" width="320" /></a>          ]</div> <div>                     To overcome this problem, the audio frequency signal is used to modulate some characteristics (usually amplitude or frequency) of a high frequency wave called Carrier wave. This high frequency carrier wave can now be efficiently radiated into space by using smaller antenna of convenient sizes. At the receiving end the original signal is recovered from the modulated carrier wave by a process known as Demodulation.</div> <h3 style="text-align: left;"> <span style="color: #741b47;">The need for Modulation Arises out of the Following</span></h3> <div> 1. Direct transmission is limited to any small distances.</div> <div> 2. Direct transmission requires antenna of sub-normal size.</div> <div> 3. In direct transmission there is the possibility of signals from different stations getting mixed and lost.</div> <div> <br /></div> <h3 style="text-align: left;"> <span style="color: #741b47;">Modulation</span></h3> <blockquote class="tr_bq"> The process of producing a wave in which some characteristics of high frequency carrier wave varies in accordance with the instantaneous value of a low frequency information signal is known as Modulation.</blockquote> <div class="separator" style="clear: both; text-align: center;"> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh765Quhdh8Fy6aSA3vIhj5PDxSE35dwKKH3SoATyea4PqtIzeY5M1D9VVcgu1VABuQ8JuJT4k1IPz8ryTEfs-QIzGmoZCMM2x64Hwta-hDreRpp8hdNgsp5tmujayGe-p6r8iooswwA9k1/s1600/main-qimg-d405450ab03d6a6cf3e828a59864cb16.gif" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="260" data-original-width="400" height="208" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh765Quhdh8Fy6aSA3vIhj5PDxSE35dwKKH3SoATyea4PqtIzeY5M1D9VVcgu1VABuQ8JuJT4k1IPz8ryTEfs-QIzGmoZCMM2x64Hwta-hDreRpp8hdNgsp5tmujayGe-p6r8iooswwA9k1/s320/main-qimg-d405450ab03d6a6cf3e828a59864cb16.gif" width="320" /></a></div> <div> <br /></div> <h3 style="text-align: left;"> <span style="color: #741b47;">Carrier Wave</span></h3> <blockquote class="tr_bq"> The high frequency wave on which the modulating wave is superimposed is called Carrier wave.</blockquote> <h3 style="text-align: left;"> <span style="color: #741b47;">Demodulation</span></h3> <blockquote class="tr_bq"> The process of recovering the original modulating signal from the modulated carrier wave is known as Demodulation or Detector.</blockquote> <div class="separator" style="clear: both; text-align: center;"> <a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiOM3zvAHWgjOsIn8nuy3BW1S9yWQre-JH2X1QHKZHP1V5zP1yikUJr5yec1W1KkiTfTpKwOJ1qOKXbYkxg5nNpa5V1Fk2PNXPzOvCDno1Gwu-OTEWMeZGsk_dAL4DtJmMbDeC_UaiatE-a/s1600/demod.gif" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="260" data-original-width="400" height="208" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiOM3zvAHWgjOsIn8nuy3BW1S9yWQre-JH2X1QHKZHP1V5zP1yikUJr5yec1W1KkiTfTpKwOJ1qOKXbYkxg5nNpa5V1Fk2PNXPzOvCDno1Gwu-OTEWMeZGsk_dAL4DtJmMbDeC_UaiatE-a/s320/demod.gif" width="320" /></a></div> <blockquote class="tr_bq"> <br /></blockquote> <h3 style="text-align: left;">  </h3> </div>

What is Modulation and Demodulation of a Audio signal ? What is carrier wave of a Audio signal ?

0 September 26, 2018

                          Modulation & Demodulation Modulation and Demodulation  (image searched from google image)                       In radio or wireless communication systems audio signal is first converted into corresponding electrical signal… Read more »

Read more »