Information System Design Lab 5&6

User Interface Design

Microsoft Visual Studio is  an integrated development environment (IDE) from Microsoft.  It is used to develop console and graphical user interface (windows forms application,websites )  Visual Studio includes a code editor, debugger, forms designers ) for building GUI applications.  Visual Studio supports different programming language (Microsoft Visual Basic, Visual J#, Visual C#, and Visual C++) Microsoft Visual Studio

C reating VB /C# Application s Create the interface Set the properties Write the code

Forms: windows that contain application’s controls. – forms are used as display windows to gather info and return commands or instructions. Controls: check boxes, list boxes, etc. Properties: attributes of objects. Events: messages or requests for service. Procedures: operations or services. – include methods, functions, subroutines Creating VB/C# Applications Create the interface

How to get started in C# File  new  project

:Toolbox 2:form window 3:properties window 4:projext explorer window How to get started in C#/VB

Toolbox display buttons that represent the controls that are are available for user to add to a form How to get started

properties window Whenever an object is active, the property window lists all of the properties that are associated with that object when you click a property item,there is a message area under the properties window that explains what effect the property has on its object How to get started

Add controls to a form Objects in the toolbox

Add controls to a form (label,textbox and button )

CheckBox and RadioButton What is the difference ? Add controls to a form ((CheckBox and RadioButton RadioButtonCheckBox

Add controls to a form (GroupBox) using GroupBox

ComboBox prosperities  Text  DropDownStyle Add controls to a form (ComboBox )

ComboBox prosperities  Item Add controls to a form (ComboBox ) Run screen

ChecckedListBox is  CheckBox  ListBox Add controls to a form (ChecckedListnBox)

ChecckedListnBox properities  Item  Checkonclick Add controls to a form (ChecckedListnBox)

Toolbox 1 2 Add controls to a form (menustrip)

Add standard items 1 2 Add controls to a form (menustrip)

Add separator Type – then enter separator Add controls to a form (menustrip)

Include menu shortcut keys : In most applications,you have some way of accessing the menu options without using the mouse. this is done by using shortcut keys. Properties windows (Image,Text,Shortcut kes) Add controls to a form (menustrip)

Add code to a menu option: Double click on a menu option Add controls to a form (menustrip)

Add controls to a form (toolstrip)

dateTimePicker control: is used to display the date to the user in a single textbox format. Add controls to a form (dateTimePicker)

TabControl :allows to user to place other controls on each of the tabs independently. When the user clicks a particular tab,only those controls on that tab are displayed automatically Add controls to a form (taps)

Object name : TabControl Most important object properties : text Add controls to a form (taps)

Windows properties for TabControl Add controls to a form (taps)

textbox control passwordChar property :use to protect the textbox. Multiline property: allow to user to enter multiple lines of text Add controls to a form

How to add a form Add new form Project  add windows form

Project Project  properties The most important item that you can change here is the Startup form This will tell VB which form should be run first at startup

How to run your project Run The Application : there are several ways to run or test your application.Either …. Return to the environment After executing or running a project,clicking the close button to return to code. End execution with an error : In some case, you may want to terminate the execution during an error massage. the end button on the toolbar will accomplish this.

Add code to your form Access the code window :3 ways Enter code

Use MSGBOX function Displays a message in a dialog box, waits for the user to click a button, and then returns an integer indicating which button the user clicked. Message title

Use MSGBOX function(cont…)

Question Critical Warning Use MSGBOX function

Project  properties Publish

Example of Design interface

شرح محتويات الشاشة

Practices

Open new project

Change background image

Status bar Web browser Tool strip

Edit item of tool strip 1

Edit item of status bar

Finally