Copyright (c) 2003 by Prentice Hall Provided By: Qasim Al- ajmi Chapter 3 Some Visual Basic Controls and Events Visual Basic. NET

Copyright (c) 2003 by Prentice Hall Provided By: Qasim Al-ajmi Objectives Have a clear understanding of the important features and the role various controls play in the user interface for data-entry operations Set the tab order for the controls placed on the form Understand the nature and uses of various events

Copyright (c) 2003 by Prentice Hall Provided By: Qasim Al-ajmi Obtaining Open-Ended Input Text box – Has a Text property – Should have a label giving a clue what goes in the box Masked Edit Box – Has a Mask property Mask can contain placeholders (#,A) or literals (-,()) – Has a Text property The exact content of the box, including literals – Has a ClipText property Content of the box, without literals

Copyright (c) 2003 by Prentice Hall Provided By: Qasim Al-ajmi Focus Control must have focus to accept data input – Press Tab key until you get to the control – Click on the control – By code, using the Focus method Focus method should be part of button click events or error handling procedures When a text box gets focus, a blinking cursor appears in box Enter event is triggered when a control receives focus

Copyright (c) 2003 by Prentice Hall Provided By: Qasim Al-ajmi Comparing Text Properties Setting at design time – Can only be done with text box Setting at runtime – With text box, can set to anything – With masked edit, text must match mask pattern Clearing at runtime – With text box, set to zero-length string – 3 steps for masked edit: Clear the mask Set text to zero-length string Redefine the mask

Copyright (c) 2003 by Prentice Hall Provided By: Qasim Al-ajmi Highlighting Text SelectedText property of text box gives the text that is highlighted – Corresponding property for masked edit: SelText SelectionStart property of text box gives the position where highlight begins – Corresponding property for masked edit: SelStart SelectionLength property of text box gives the length of highlighted text – Corresponding property for masked edit: SelLength

Copyright (c) 2003 by Prentice Hall Provided By: Qasim Al-ajmi Highlighting the Text Len(txtName.Text) returns number of characters. SelectionLength = Len(txtName.Text) will cause all characters in text box to be selected

Copyright (c) 2003 by Prentice Hall Provided By: Qasim Al-ajmi Highlighting the Text Text in txtName is highlighted when user tabs in. User can type new name without using the Delete key to get rid of old text. Makes application more friendly

Copyright (c) 2003 by Prentice Hall Provided By: Qasim Al-ajmi Arranging Many Controls Group box – Used to group related data fields – Controls inside box treated as one logical unit If you delete the group box, all controls deleted Tab control Tab control – Organizes a window into logical tabbed pages Both considered “containers” – They have the capability to hold other controls

Copyright (c) 2003 by Prentice Hall Provided By: Qasim Al-ajmi Data with Limited Number of Choices Radio button – Only one button in a group can be selected Good for mutually exclusive options, i.e. Male or Female – To allow multiple radio buttons to be selected on a window, use multiple containers Check box – User can select as many items as he/she wants Good for independent, rather than mutually exclusive options Both have Text and Checked properties – Text property is the text next to the control – Checked can be True or False

Copyright (c) 2003 by Prentice Hall Provided By: Qasim Al-ajmi Longer List of Known Items List box – Contains a list of items a user can select from – User can not enter items not in the list – User may have option to select multiple items Good alternative to check boxes Combo box – Contains a list of items a user can select from – User may enter items not in the list – User can only select one item Good alternative to radio buttons

Copyright (c) 2003 by Prentice Hall Provided By: Qasim Al-ajmi Common Methods and Properties SelectedItem property – Indicates the item selected (the text) SelectedIndex property – Indicates the position of the item clicked The first item has a SelectedIndex value of 0 Items.Add method – Adds items to list box or combo box Items.Count property – Gives the number of items in the list or combo box

Copyright (c) 2003 by Prentice Hall Provided By: Qasim Al-ajmi Selecting Items from the List Box SelectionMode property determines how items are selected – When set to One, only one item can be selected – When set to MultiSimple or MultiExtended, user can select multiple items GetSelected method used to determine whether or not an item is selected – Syntax: Listbox.GetSelected(Index)

Copyright (c) 2003 by Prentice Hall Provided By: Qasim Al-ajmi Selecting Items from the Combo Box Combo box has a text box area and list box DropDownStyle property determines whether or not user can enter data not in list – DropDown style (default) Fixed height; user can select from list or enter text – Simple style Adjustable height; user can select from list or enter text – DropDownList style user can only select an item from the list

Copyright (c) 2003 by Prentice Hall Provided By: Qasim Al-ajmi Graphics in the Visual Interface The Picture box – Has an Image property – Has a SizeMode property Normal: size of picture box drawn on form sets boundary for the picture StretchImage: size of image adjusted to fit the picture box AutoSize: size of picture box adjusted to fit image CenterImage: image appears in center of picture box Use only company logos or art that is professionally designed for this application

Copyright (c) 2003 by Prentice Hall Provided By: Qasim Al-ajmi Setting the Image Property Setting at design time – Set the Image property in the Properties box Setting at runtime – Use the Image.FromFile method to load the picture If you use this image, you run the risk that someone has moved or deleted the file Write a routine to allow the user to select the picture in the event it has been moved or deleted

Copyright (c) 2003 by Prentice Hall Provided By: Qasim Al-ajmi Naming Conventions: Prefixes

Copyright (c) 2003 by Prentice Hall Provided By: Qasim Al-ajmi Setting Tab Order Tab order: the order in which a VB control receives focus when user presses Tab key – Determined by control’s TabIndex property Tab order is an important component of a user-friendly interface – user should not jump all over the form when he/she tabs Form must have focus to set tab order

Copyright (c) 2003 by Prentice Hall Provided By: Qasim Al-ajmi The Tab Order

Copyright (c) 2003 by Prentice Hall Provided By: Qasim Al-ajmi Common Events Form Load event – occurs when form is loaded into memory before form is displayed – all controls are set to initial states Click event – occurs when a user clicks a control normally associated with a button SelectedIndexChanged event – occurs when the user selects an item in the list box or combo box

Copyright (c) 2003 by Prentice Hall Provided By: Qasim Al-ajmi Common Events KeyPress event – occurs when the user presses a key often used for data validation Enter event – occurs when a control receives focus performs some “preparatory” activities Leave event – occurs when user leaves a control perform some finishing touches, such as field validation

Copyright (c) 2003 by Prentice Hall Provided By: Qasim Al-ajmi An Application Example The Environ-Pure Project Analyze and define requirements – An easy to use interface to take orders from distributors Define the controls needed for the visual interface – Determine the data fields to be entered – Determine the appropriate type of control for each data field Set the Tab Order – Window has a vertical layout, so tab order should flow from top to bottom

Copyright (c) 2003 by Prentice Hall Provided By: Qasim Al-ajmi An Application Example The Environ-Pure Project Code the Event Procedures – Several types of procedures needed Form Load procedure sets default values Validation procedures needed for several controls Radio buttons should be enabled only if this is a rush order Need procedures to save the data and to exit the application Test the Project – Create a test plan to test every control – Try to make the application break!

Copyright (c) 2003 by Prentice Hall Provided By: Qasim Al-ajmi The Visual Interface

Copyright (c) 2003 by Prentice Hall Provided By: Qasim Al-ajmi Summary Different controls have different uses – text boxes for open-ended data – masked edit boxes for data with defined pattern – radio buttons for data with limited number of mutually exclusive choices – check boxes for data with limited number of independent choices – list boxes for relatively large list with independent choices – combo boxes for relatively large list with mutually exclusive choices

Copyright (c) 2003 by Prentice Hall Provided By: Qasim Al-ajmi Summary Containers are used to hold other items – group boxes used to group related data fields – tab controls used to group data into tabbed pages Change tab order of controls to make interface more user-friendly – form must have focus to change tab order

Copyright (c) 2003 by Prentice Hall Provided By: Qasim Al-ajmi Summary Different events can have different uses – Form Load event initializes values of variables and controls – Click event responds to user clicks on buttons, etc – SelectedIndexChanged event occurs when the user clicks on list boxes and combo boxes – KeyPress event previews keystrokes before displaying in control – Enter event performs preparatory tasks, such as highlighting text – Leave event performs finishing touches