Lecture Set 3

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

Objectives

    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  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)

     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)  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

   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 process of creating an object from a class is called

instance instantiation

. of a class, and the 8/2/2013 3:46 PM

Terminology Revisited

(continued)  More than one object instance can be created from a single class.  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    

Properties

define the characteristics of an object and the data associated with an object.

Methods

perform.

are the operations that an object can

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

 If you instantiate two or more instances of the same class …  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

  Namespaces may be designated for use component for clarity and convenience in any Such a using designation can be used to shorten identifier references  However it is done, with using must be known to the compiler or not, the full path reference to every identifier used in your program  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  8/2/2013 3:46 PM

Namespaces

(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 s uch as

System.Windows.Forms.xxx

8/2/2013 3:46 PM

Assembly (Namespace) References

   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  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 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 GET COMPILER ERRORS .

a library component YOU WILL 8/2/2013 3:46 PM

Assembly (Namespace) Reference List

8/2/2013 3:46 PM

Introduction to the Properties Window

    We view the properties of a form in Design Mode (not in Code Mode )  The Properties window is a tool window  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

(a VB example)  Switch to Design Mode – see Properties 

Properties Window (Sections)

 The Properties window is divided into four sections  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)

 Let’s look at a sample game and at a few controls for that game  (next 3)   Look at one or two of the controls (such as btnYes or lblOkay What three code segments to we see?

   Declaration Instantiation of an object (of what data type) Event handler 8/2/2013 3:46 PM

Sample Form for Hangman Game

8/2/2013 3:46 PM

  

Code-Behind

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 automati cally generates several snippets of C# code in that form’s class  Code to define the type of the control    Code to instantiate the control (of the defined type) Code to handle an event on that control (if appropriate) Code to redefine some of the object’s attributes We saw examples of this code in Slide Set 3B 8/2/2013 3:46 PM

Code-Behind (continued)

 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 btnYes

// Allow user another transaction private void btnYes_Click(object sender, EventArgs e) { this.Visible = false; GlobalData.TransactionEntryForm.ShowDialog(); } // end btnYes Click 8/2/2013 3:46 PM

Generated Code Behind

btnYes

//Examples taken from the Designer.cs file for the indicated Form // Instantiation (creation) of the btnYes object this.btnYes = new System.Windows.Forms.Button(); . . . // Initializing required btnYes attributes // btnYes this.btnYes.BackColor = System.Drawing.Color.Lime; this.btnYes.Font = new System.Drawing.Font("Arial Narrow", 12F, System.Drawing.FontStyle.Bold, System.Drawing.GraphicsUnit.Point, ((byte)(0))); this.btnYes.Location = new System.Drawing.Point(350, 331); this.btnYes.Name = "btnYes"; this.btnYes.Size = new System.Drawing.Size(113, 33); this.btnYes.TabIndex = 23; this.btnYes.Text = "Yes"; this.btnYes.UseVisualStyleBackColor = false; this.btnYes.Click += new System.EventHandler(this.btnYes_Click); . . .

// Place btnYes on the Form this.Controls.Add(this.btnYes); 8/2/2013 3:46 PM

Using the Code Editor

    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

    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

  The Code Editor checks syntax as statements are entered  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

  Take a simple example of code you have completed Insert some errors into the code    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      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

   

AcceptButton

special

Button

contains the name of a control instance  Pressing Enter executes this button’s

Click

event handler The

BackColor

background color property defines a form’s The

ControlBox

property defines whether the control box appears The

MaximizeBox

enables or disables the Maximize button on the control box 8/2/2013 3:46 PM

Form Properties 2

 In the Properties window, we scrolled down a bit. You see:  The

MinimizeBox

property enables or disables the Minimize button on the control box   The

FormBorderStyle

whether a form is resizable and the size of the title bar property defines The

CancelButton

property contains the name of a special

Button

control instance  Pressing Escape executes this button’s

Click

event handler 8/2/2013 3:46 PM

Form Properties 3

    The

Icon

property defines the form’s icon The contents of the

Text

the title bar property appear in The

Width

and

Height

properties define the form’s size (x length and y length) The

StartPosition

position of the form on the desktop (again, x and y coordinates) property defines the 8/2/2013 3:46 PM

Form Properties 4 - Configuring Textual and Hierarchical Properties

     Properties such as

Name

textual values  and

Text

store Edit these values directly in the Value column A plus or minus sign appears next to hierarchical properties  Click plus to expand and 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) 8/2/2013 3:46 PM

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

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

Configuring Textual and Hierarchical Properties     Properties such as

Name

textual values  and

Text

store Edit these values directly in the Value column A plus or minus sign appears next to hierarchical properties  Click plus to expand and 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

(optional) 8/2/2013 3:46 PM

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

Controls as Objects of Classes

   

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   This class is the base class from which all visible controls are derived Dialog boxes derived from the

CommonDialog

class See pages 424 and 425 in your text for discussion and diagram 8/2/2013 3:46 PM

The Hierarchy of Controls Classes

   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 frmSplashStart : Form 8/2/2013 3:46 PM

Some Visual Studio Controls

 Controls you should know about  The

PictureBox

displays graphical images     The

Label

control displays text The

Button

control is used to perform a specific task when clicked The box from which the user can select a file to open

OpenFileDialog

control displays a dialog The

ToolTip

control displays informational pop-up messages 8/2/2013 3:46 PM

Using Visual Studio to Create and Configure Control Instances

   To create a control instance  Click the control in the Toolbox to select it  Using the mouse, draw the region of the control instance on the form To delete a control instance, click the control instance to select it and press Delete Go look at the code corresponding to this control  What is gone?

 What is still there? Anything?

8/2/2013 3:46 PM

Moving and Resizing a Control Instance

   Move a control instance by dragging it onto the form Resize a control instance by   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) 8/2/2013 3:46 PM

Working with Multiple Control Instances

 Select multiple control instances by   Holding down the Shift key and clicking the desired control instance Dragging a rectangle around the desired control instance with the Pointer tool  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

   Use the Format menu to align control instances All commands work with the active and selected control instances    The Align command aligns the margins of the selected control instances The Make Same Size command makes the selected control instances the same size as the active control instance 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