Lecture Set 3 Introduction to Visual Basic Concepts

Lecture Set 3 Introduction to Visual Basic Concepts Part C – Design Mode Properties In-Depth Look at Common Features of Controls

Objectives n n n Sort out differences between namespace imports in code and references in Solution Explorer Understand better how windows properties are partitioned and how to navigate through properties for various controls Gain an understanding about controls n n Slide 2 What they are and how they relate to each other See generated code for controls Learn how to manipulate controls The intelligent editor and intellisense 8/2/2013 3: 46 PM

Objectives (continued) n n n Review key terminology: class, object, instantiation, instance, property, method, event, and member. Describe how an app responds to events. Get first look at generated code (for controls) n n n Slide 3 Aka Code Behind Distinguish between a syntax (or build) error and a runtime error. Explain how a data tip can help debug a runtime error. 8/2/2013 3: 46 PM

Terminology Revisited n n n Slide 4 An object is a self-contained unit that combines code and data. Two examples of objects are forms and controls. A class is the code that defines the characteristics of an object. You can think of a class as a template for an object. An object is an instance of a class, and the process of creating an object from a class is called instantiation. 8/2/2013 3: 46 PM

Terminology Revisited n More than one object instance can be created from a single class. n n Slide 5 (continued) For example, a form can have several button objects, all instantiated from the same Button class. Each is a separate object, but all share the characteristics of the Button class. 8/2/2013 3: 46 PM

Property, Method, and Event Concepts n n Slide 6 Properties define the characteristics of an object and the data associated with an object. Methods are the operations that an object can perform. Events are signals sent by an object to the application telling it that something has happened that can be responded to. Properties, methods, and events can be referred to as members of an object. 8/2/2013 3: 46 PM

Property, Method, and Event Concepts n If you instantiate two or more instances of the same class … n n Slide 7 All of the objects have the same properties, methods, and events. However, the values assigned to the properties can vary from one instance to another. 8/2/2013 3: 46 PM

Using Classes in a Namespaces n n Namespaces may be designated for use in any component for clarity and convenience Such a using designation can be used to shorten identifier references However it is done, with using or not, the full path reference to every identifier used in your program must be known to the compiler Either you write the full path name preceding the identifier (using. notation) or you use the using namespace so that the compiler can “prefix” the designated path to the identifier wherever it is referenced. Next slide Slide 8 8/2/2013 3: 46 PM

Namespaces n n Slide 9 (continued) Without one of these two mechanisms the compiler cannot find the proper referenced assembly and associated information needed to do its job. Result: syntax error Example: using System. Windows. Forms enables you to use any class in this namespace as if it were a part of your project If ambiguities arise, you still need to prefix class member names with the full path name such as System. Windows. Forms. xxx 8/2/2013 3: 46 PM

Assembly (Namespace) References n n With or without the using statement, references must be complete Assemblies must be referenced if you plan to program against the public types inside them n n n Slide 10 Every assembly you use must be explicitly referenced (in your list of references in the Solution Explorer) If you look in the references list in the Solution Explorer window, you will see that you get a few references “for free” Otherwise, if you fail to reference a library component explicitly in the list of references, neither the editor nor the compiler will know what to do with your class member references in that component and YOU WILL GET COMPILER ERRORS. 8/2/2013 3: 46 PM

Assembly (Namespace) Reference List Slide 11 8/2/2013 3: 46 PM

Introduction to the Properties Window n n We view the properties of a form in Design Mode (not in Code Mode) The Properties window is a tool window n n n Slide 12 Like any tool window, it can be docked, Auto Hidden, or appear as a floating window It is used to set properties for a form or control instance at design time All controls have properties (many have LOTS of properties) but different controls have different properties 8/2/2013 3: 46 PM

Form Properties n Slide 13 (a VB example) Switch to Design Mode – see Properties

Properties Window (Sections) n The Properties window is divided into four sections n n Slide 14 The Object combo box lists the form and control instances on the form The toolbar area contains buttons to change the order in which properties are listed and to display properties or events The List section contains two columns displaying property names and values The Description section displays a property’s description 8/2/2013 3: 46 PM

Hangman Example (from VB) n Let’s look at a sample game and at a few controls for that game (next 3) n n Look at one or two of the controls (such as btn. Yes or lbl. Okay What three code segments to we see? n n n Slide 15 Declaration Instantiation of an object (of what data type) Event handler 8/2/2013 3: 46 PM

Sample Form for Hangman Game Slide 16 8/2/2013 3: 46 PM

Code-Behind n n When using the Form Designer, (VS) generates C# code to creates a new class based on the Form class. Then, when you run the project, a form object is instantiated from the new class. When you add a control to a form, VS automatically generates several snippets of C# code in that form’s class n n n Slide 17 Code to to define the type of the control instantiate the control (of the defined type) handle an event on that control (if appropriate) redefine some of the object’s attributes We saw examples of this code in Slide Set 3 B 8/2/2013 3: 46 PM

Code-Behind (continued) n Slide 18 When you move and size a control, Visual Studio automatically sets the properties that specify the location and size of the control. 8/2/2013 3: 46 PM

Code Behind btn. Yes // Allow user another transaction private void btn. Yes_Click(object sender, Event. Args e) { this. Visible = false; Global. Data. Transaction. Entry. Form. Show. Dialog(); } // end btn. Yes Click Slide 19 8/2/2013 3: 46 PM

Generated Code Behind btn. Yes //Examples taken from the Designer. cs file for the indicated Form // Instantiation (creation) of the btn. Yes object this. btn. Yes = new System. Windows. Forms. Button(); . . . // Initializing required btn. Yes attributes // btn. Yes this. btn. Yes. Back. Color = System. Drawing. Color. Lime; this. btn. Yes. Font = new System. Drawing. Font("Arial Narrow", 12 F, System. Drawing. Font. Style. Bold, System. Drawing. Graphics. Unit. Point, ((byte)(0))); this. btn. Yes. Location = new System. Drawing. Point(350, 331); this. btn. Yes. Name = "btn. Yes"; this. btn. Yes. Size = new System. Drawing. Size(113, 33); this. btn. Yes. Tab. Index = 23; this. btn. Yes. Text = "Yes"; this. btn. Yes. Use. Visual. Style. Back. Color = false; this. btn. Yes. Click += new System. Event. Handler(this. btn. Yes_Click); . . . // Place btn. Yes on the Form this. Controls. Add(this. btn. Yes); Slide 20 8/2/2013 3: 46 PM

Using the Code Editor n n Slide 21 It's an intelligent editor used to edit files containing C# code The Code Editor always appears as a document window Plus and minus signs allow procedures to be expanded or collapsed Drop-down combo boxes appear to select file elements including functions 8/2/2013 3: 46 PM

Using the Code Editor n n Slide 22 It's an intelligent editor used to edit files containing C# code The Code Editor always appears as a document window Plus and minus signs allow procedures to be expanded or collapsed Drop-down combo boxes appear to select file elements including procedures 8/2/2013 3: 46 PM

Code Editor Features n The Code Editor checks syntax as statements are entered n n n Slide 23 Statements with syntax errors appear underlined Syntax errors also appear in the Error List window The Code Editor automatically indents statement blocks 8/2/2013 3: 46 PM

Code Editor In Action - 1 n n Take a simple example of code you have completed Insert some errors into the code n n n Slide 24 Examine what the editor does Find and read the error message Correct the error and compile the program 8/2/2013 3: 46 PM

Using Intellisense with the Code Editor n n n Slide 25 Intellisense technology displays pop-up menus as statements are entered Intellisense displays classes applicable to a namespace Intellisense displays members of a class or other type Intellisense displays arguments to functions or methods Intellisense is a wonderful piece of technology 8/2/2013 3: 46 PM

Form Properties 1 n Accept. Button contains the name of a special Button control instance n n Slide 26 Pressing Enter executes this button’s Click event handler The Back. Color property defines a form’s background color The Control. Box property defines whether the control box appears The Maximize. Box enables or disables the Maximize button on the control box 8/2/2013 3: 46 PM

Form Properties 2 n In the Properties window, we scrolled down a bit. You see: n n n The Minimize. Box property enables or disables the Minimize button on the control box The Form. Border. Style property defines whether a form is resizable and the size of the title bar The Cancel. Button property contains the name of a special Button control instance n Slide 27 Pressing Escape executes this button’s Click event handler 8/2/2013 3: 46 PM

Form Properties 3 n n Slide 28 The Icon property defines the form’s icon The contents of the Text property appear in the title bar The Width and Height properties define the form’s size (x length and y length) The Start. Position property defines the position of the form on the desktop (again, x and y coordinates) 8/2/2013 3: 46 PM

Form Properties 4 - Configuring Textual and Hierarchical Properties n Properties such as Name and Text store textual values n n A plus or minus sign appears next to hierarchical properties n n Slide 29 Edit these values directly in the Value column Click plus to expand minus to collapse Some properties display a drop-down list Some properties display a visual editor We now examine different property displays (we made these views optional – you probably have seen them already but you can certainly look at them “live” is a project of your own) 8/2/2013 3: 46 PM

Hierarchical Properties in the Properties Window (optional) Slide 30 8/2/2013 3: 46 PM

Properties Window - Color Palette (optional) Slide 31 8/2/2013 3: 46 PM

Properties Window -- a Drop-down List Slide 32 (optional) 8/2/2013 3: 46 PM

Configuring Textual and Hierarchical Properties n Properties such as Name and Text store textual values n n A plus or minus sign appears next to hierarchical properties n n n Slide 33 Edit these values directly in the Value column Click plus to expand minus to collapse Some properties display a drop-down list Some properties display a visual editor 8/2/2013 3: 46 PM

Font Dialog Box Slide 34 (optional) 8/2/2013 3: 46 PM

Snap Lines in the Windows Forms Designer Slide 35 (optional) 8/2/2013 3: 46 PM

Controls as Objects of Classes n n n Controls on a Form are all instances of control classes The collection of control classes are arranged in a class hierarchy The System. Windows. Forms Control Class n n Slide 36 This class is the base class from which all visible controls are derived Dialog boxes derived from the Common. Dialog class 8/2/2013 3: 46 PM

The Hierarchy of Controls Classes n n n If you look at one of your projects you will see that all of your forms inherit from System. Windows. Forms Examine the code generated for you own form Find the inherits statement in this code public partial class frm. Splash. Start : Form Slide 37 8/2/2013 3: 46 PM

Some Visual Studio Controls n Controls you should know about n n n Slide 38 The Picture. Box displays graphical images The Label control displays text The Button control is used to perform a specific task when clicked The Open. File. Dialog control displays a dialog box from which the user can select a file to open The Tool. Tip control displays informational pop -up messages 8/2/2013 3: 46 PM

Using Visual Studio to Create and Configure Control Instances n To create a control instance n n To delete a control instance, click the control instance to select it and press Delete Go look at the code corresponding to this control n n Slide 39 Click the control in the Toolbox to select it Using the mouse, draw the region of the control instance on the form What is gone? What is still there? Anything? 8/2/2013 3: 46 PM

Moving and Resizing a Control Instance n n Move a control instance by dragging it onto the form Resize a control instance by n n n Clicking the control instance to select it Resize the control instance by dragging the sizing handles What happens behind the scenes? In other words, what code behind is changed? (See slide 20 in this slide set) Slide 40 8/2/2013 3: 46 PM

Working with Multiple Control Instances n Select multiple control instances by n n Holding down the Shift key and clicking the desired control instance Dragging a rectangle around the desired control instance with the Pointer tool n Slide 41 Only part of the control instance needs to appear in the rectangle to be selected 8/2/2013 3: 46 PM

Aligning Multiple Control Instances n n n Slide 42 Use the Format menu to align control instances All commands work with the active and selected control instances n The Align command aligns the margins of the selected control instances n The Make Same Size command makes the selected control instances the same size as the active control instance n The Horizontal and Vertical spacing commands change the horizontal or vertical spacing Visual snap lines appear while dragging control instances in the Windows Forms Designer 8/2/2013 3: 46 PM