Graphical User Interface Components Version 1.1. Obectives Students should understand how to use these basic Form components to create a Graphical User.

Slides:



Advertisements
Similar presentations
Information System Design Lab 5&6. User Interface Design.
Advertisements

Computer Programming and Basic Software Engineering 9 Building Graphical User Interface Developing a Simple Graphical User Interface (GUI)
 2007 Dr. Natheer Khasawneh. Chapter 13. Graphical User Interface Concepts: Part 1.
© 2006 ITT Educational Services Inc. Introduction to Computer Programming: Unit 7: Chapter 4: Slide 1 Unit 7 Decisions (Cont.) and Message Boxes Chapter.
© by Pearson Education, Inc. All Rights Reserved.
Visual Basic 2010 How to Program. © by Pearson Education, Inc. All Rights Reserved.2.
Visual Basic 2010 How to Program Reference: Instructor: Maysoon Bin Duwais slides Visual Basic 2010 how to program by Deitel © by Pearson Education,
C# Programming: From Problem Analysis to Program Design1 Programming Based on Events C# Programming: From Problem Analysis to Program Design 3 rd Edition.
GUI-Labels, TextBoxes and Buttons Label- displays read-only text Common properties:  Font – font used by the text of label  Text – text to appear on.
Automating Tasks With Macros. 2 Design a switchboard and dialog box for a graphical user interface Database developers interact directly with Access.
Copyright © 2012 Pearson Education, Inc. Chapter 2 Introduction to Visual C#
Adding Controls to User Forms. Adding Controls A user form isn’t much use without some controls We’re going to add controls and write code for them Note.
DT265-2 Object Oriented Software Development 2 Lecture 3 : Windows Programming Lecturer Pat Browne
Getting Started Example ICS2O curriculum
Slide 1 Chapter 2 Visual Basic Interface. Slide 2 Chapter 2 Windows GUI  A GUI is a graphical user interface.  The interface is what appears on the.
CHAPTER SIX Loop Structures.
CHAPTER 6 Loop Structures.
CHAPTER SIX.
Visual Basic Fundamental Concepts. Integrated Development Enviroment Generates startup form for new project on which to place controls. Features toolbox.
Visual Basic 2008 Express Edition The IDE. Visual Basic 2008 Express The Start Page Recent Projects Open an existing project Create a New Project.
Windows Programming Using C#
1 Graphical User Interfaces Part 2 Outline Multiple Document Interface (MDI) Windows Visual Inheritance User-Defined Controls.
Introduction to Graphical User Interfaces. Objectives * Students should understand what a procedural program is. * Students should understand what an.
CSCI 3328 Object Oriented Programming in C# Chapter 2: Introduction to Visual C# Programming 1 Xiang Lian The University of Texas Rio Grande Valley Edinburg,
Advanced Programming LOOP.
© 2006 Lawrenceville Press Slide 1 Chapter 3 Visual Basic Interface.
1 Working with Menus and Dialog Boxes. 2 Objectives You will be able to Create and edit menus for Windows Forms applications. Write code to handle menu.
Dr Dat Tran - Week 4 Lecture Notes 1 ToolStrip Programming Graphical User Interfaces PG (7110) University of Canberra School of Information Sciences &
G RAPHICAL U SER I NTERFACE C ONCEPTS : P ART 1 1 Outline Introduction Windows Forms Event-Handling Model - Basic Event Handling.
Classic Controls Trần Anh Tuấn A. Week 1 How to create a MFC project in VS 6.0 How to create a MFC project in VS 6.0 Introduction to Classic Controls.
© Copyright by Deitel & Associates, Inc. and Pearson Education Inc. All Rights Reserved. Chapter 12 - Graphical User Interface Concepts: Part.
Lecture 6: Introduction to Graphical User Interfaces (GUIs)
Joe Hummel, PhD Dept of Mathematics and Computer Science Lake Forest College
Creating Graphical User Interfaces (GUI’s) with MATLAB By Jeffrey A. Webb OSU Gateway Coalition Member.
BIM211 – Visual Programming Interacting with Users Graphics 1.
1 Chapter Nine Using GUI Objects and the Visual Studio IDE.
Visual C# 2012 How to Program © by Pearson Education, Inc. All Rights Reserved.
Topics Forms Frame Title Bar Client Area Components – TextBox, Button, RichTextBox, etc. Events & Event Handlers Dialog Boxes Purpose – User Input/Output.
C# GUI - Basics. Objectives.NET supports two types: WinForms, traditional, desktop GUI apps. WebForms – newer, for Web apps. Visual Studio.NET supports.
Controls. Adding Controls to Form -You can pick controls from the toolbox. -To add the controls from Toolbox to the Form You have be in design view. -To.
1 Creating Windows GUIs with Visual Studio. 2 Creating the Project New Project Visual C++ Projects Windows Forms Application Give the Project a Name and.
Visual C# 2012 How to Program © by Pearson Education, Inc. All Rights Reserved.
Chapter 23: GUI Design Spreadsheet-Based Decision Support Systems Prof. Name Position (123) University Name.
Chapter 3 I Need a Tour Guide (Introduction to Visual Basic 2010) Clearly Visual Basic: Programming with Visual Basic nd Edition.
Lecture Set 7 Procedures and Event Handlers Part B - The Structure of an Application Event Handlers.
COMPUTER PROGRAMMING I 3.01 Apply Controls Associated With Visual Studio Form.
 2002 Prentice Hall. All rights reserved. 1 Introduction to the Visual Studio.NET IDE Outline Introduction Visual Studio.NET Integrated Development Environment.
Microsoft Visual C# 2010 Fourth Edition Chapter 3 Using GUI Objects and the Visual Studio IDE.
Visual Basic/ Visual Studio Brandon Large. Connecting to prior knowledge In your notes write down what the two main parts of the computer are. The “software”
COMPUTER PROGRAMMING I Apply Procedures to Develop List Box and Combo Box Objects.
Module 3: Creating Windows-based Applications. Overview Creating the Main Menu Creating and Using Common Dialog Boxes Creating and Using Custom Dialog.
Dive Into® Visual Basic 2010 Express
Computing with C# and the .NET Framework
Apply Procedures to Develop Message, Input, and Dialog Boxes
Chapter 2 – Introduction to the Visual Studio .NET IDE
GUI Programming using Windows Form
Files.
Graphical User Interface Concepts: Part I
Windows Desktop Applications
Computer Programming and Basic Software Engineering 9 Building Graphical User Interface Developing a Simple Graphical User Interface (GUI)
Predefined Dialog Boxes
The University of Texas – Pan American
CIS16 Application Development Programming with Visual Basic
Part A – Doing Your Own Input Validation with Simple VB Tools
Building an Application in the Visual Basic .NET Environment
Control Structures Part B - Message and Input Boxes
Module 8: Creating Windows-based Applications
6. WinForms 2003 C# GUI - Basics.
Visual C# - GUI and controls - 1
– A principal I/O mechanism in Windows
Presentation transcript:

Graphical User Interface Components Version 1.1

Obectives Students should understand how to use these basic Form components to create a Graphical User Interface (GUI) application Form TextBox Label Button ListBox MessageBox RichTextBox MenuStrip

These windows controls are discussed in great detail at

A Form control is created when your GUI application is created by Visual Studio. A form encapsulates your main program and provides a frame, title bar with: icon, text, minimize, maximize/restore and close buttons and a client area containing your GUI controls. Form Control

TextBox Control A TextBox control is typically used to get/set a single line of text from/to the user. The most important member of a TextBox is its Text property. The Text property of a TextBox control is a getter/setter string object. You can operate (via get/set) on this string just like any other string object.

TextBox Control Example Given that the user has typed an integer value into a TextBox control named “Txtjoe”, you could get the integer by writing int value = int.Parse(Txtjoe.Text); Note that we use three or four charaters to indicate the type of control “Txt” in this case.

TextBox Control Example Given that you want to output a double value, “money” formatted as currency in a TextBox named “Txtjoe”, you could write Txtjoe.Text = string.Format(“{0:C}”, money);

Label Control Label controls are typically used to provide descriptive text for a control. For example, you can use a Label to add descriptive text for a TextBox control to inform the user about the type of data expected. Label controls can also be used to add descriptive text to a Form to provide the user with helpful information. For example, you can add a Label to the top of a Form that provides instructions to the user on how to input data in the controls on the form. Label controls can be also used to output data to your Form.

Label Control Example Given that you want to output a double value, “money” formatted as currency in a Label named “Lbljoe”, you could write Lbljoe.Text = string.Format(“{0:C}”, money); Note that the Text property is a getter/setter property of the Label control.

Button Control Button controls are typically used to let the user initiate some action. When you click on a Button with the mouse, it generates a Click event.

Button Example private void BtnTest1_Click(object sender, EventArgs e) { string x = TxtBox1.Text; int num = int.Parse(x); TxtBox2.Text = string.Format("Answer = {0}", num); } When the Button is clicked, this event handler reads data from TxtBox1, parses it to an integer, and then writes it out to TxtBox2.

ListBox Control A ListBox control provides the user with a list of items. An event is generated when one of these items is selected. You can provide the list if items to be shown at design time, or they can be added at run time using the Add method.

ListBox Example private void LstBox1_SelectedIndexChanged(object sender, EventArgs e) { if (listBox1.SelectedIndex != -1) switch (LstBox1.SelectedIndex) { case 0: TxtBox2.Text = "Pizza"; break; case 1: TxtBox2.Text = "Hamburger"; break; case 2: TxtBox2.Text = "Salad"; break; case 3: TxtBox2.Text = "Drink"; break; case 4: TxtBox2.Text = "Hot Dog"; break; case 5: TxtBox2.Text = "Apple Pie"; break; }// end switch }

MessageBox Control A MessageBox control displays a Modal Dialog Box some text and optionally a Button and an icon. Message boxes are used to provide feedback information to the user. You cannot add a MessageBox at design time. Message boxes are created by using the method MessageBox.Show( ). There are several forms of this method, for example // message box with text MessageBox.show(string); // message box with text and caption MessageBox.Show(string, string); // message box with text, caption, and buttons MessageBox.Show(string, string, MessageBoxButtons);

MessageBoxButtons * OK The message box contains an OK button. * OKCancel The message box contains OK and Cancel buttons. * AbortRetryIgnore The message box contains Abort, Retry, and Ignore buttons. * YesNoCancel The message box contains Yes, No, and Cancel buttons. * YesNo The message box contains Yes and No buttons. * RetryCancel The message box contains Retry and Cancel buttons.

The response to a MessageBoxButton click comes back as a DialogResult.

MessageBox Example private void BtnQuit_Click(object sender, EventArgs e) { DialogResult response = MessageBox.Show("Do you really want to quit?",Quit", MessageBoxButtons.YesNo); if (response == DialogResult.Yes) this.Close(); }

RichTextBox Control A RichTextBox control displays one or more lines of text are used to give output or receive input from the user. // Adding text to a RichTextBox Control RTxt.Append(string); // Clearing a RichTextBox Control RTxt.Clear();

Menu Controls To add a menu bar to your form follow these steps

(1)Drag a MenuStrip from the tool box onto your form.

(2) Type then text that you want for the first item on the menu here.

You can continue to add 1 st level menu items

Or add sub-menu items here.

Create an event handler by double clicking on one of the items in your menu private void exitToolStripMenuItem1_Click(object sender, EventArgs e) { this.Close(); }