1 / 26

Lecture Set 3

Lecture Set 3. Introduction to Visual Basic Concepts Part A – User Interfaces and Windows Forms – The Toolbox. Objectives. Compare command-line interfaces and forms-based interfaces – basics of forms-based interfaces Design user interface for a Windows application

ivy
Download Presentation

Lecture Set 3

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Lecture Set 3 Introduction to Visual Basic Concepts Part A – User Interfaces and Windows Forms – The Toolbox

  2. Objectives • Compare command-line interfaces and forms-based interfaces – basics of forms-based interfaces • Design user interface for a Windows application • Create Windows Application project using the Visual Studio IDE • Use controls to create the user interface for a Windows Application project • Create code for a Windows Application project

  3. Comparing Command-line and Form-based Interfaces • User interfaces can be roughly categorized into two types • Command-line interfaces use textual input and output • The end user interacts with an application by typing commands • You just did this • Most Windows user interfaces are form-based visual interfaces • The end user interacts with an application through its visual elements

  4. Comparing a Command-line Interface and a Form-based Interface

  5. Principles of a User Interface • Control – The end user should control the application • User-friendliness – The interface should help the end user accomplish tasks • Intuitiveness – The interface should follow a direct style that proceeds logically (left to right; up and down?) • Consistency – The user interface should have consistent fonts and shapes • Feedback – The interface should provide clear and immediate feedback

  6. Principles of a User Interface (continued) • Graphics – Avoid use of unnecessary graphics • Color – Pleasant but not overdone • Input – Minimize transitions between the keyboard and mouse where possible • User protection – prevent bad input data • Screen resolution – The user interface should adapt to different screen resolutions • Users may be visually impaired, requiring larger fonts

  7. Designing a User Interface • A user interface should be designed before it is implemented • Design user interface using a tool such as Visio • Pencil and paper works fine too • A simple pencil and paper sketch will often do • Name your controls so that you know that you have at all times • Be consistent with user names – see suggestions used in the text

  8. Designing a User Interface

  9. Principles of Control Design • Alignment – Align control instances vertically or horizontally • Balance – Distribute control instances evenly about the form • Color – Use soft colors with adequate contrast between foreground and background colors • Users may be colorblind • Function grouping – Group control instances based on their function • Consistent sizing – Control instances should have the same size

  10. A Poor User Interface

  11. An Improved User Interface

  12. Other “Interesting” Forms Pages • Windows versus web forms pages • Amazon • Southwest Airlines • Your instructor’s web page • Right click on link  Open Hyperlink

  13. Creating a Windows Application Project 1 • The steps to create a Console Application project and Windows Application project are nearly the same • Use the New Project Dialog box • Use the Windows Application template • The templates vary based on the Visual Studio edition • Assign a name to the solution, as necessary

  14. Creating a Windows Application Project 2 • There is a lot to learn • Forms design – sort of fun • Tools – such as Visio • Software design • Tools – UML, Data Tables, Behavior modelling • How to use the Visual Studio IDE • Tools – tons of on-line and text references • Get the right one for your level • VB .NET • Tools – tons of on-line and text references • Here we go …

  15. Differences Between Console and Windows Application Projects • Console projects are procedural • Console projects have a textual (character-based) user interface • Windows Application projects are event driven • Windows Application projects have a visual user interface consisting of controls - buttons and boxes of varying purposes, shapes, and sizes

  16. Anatomy of a Windows Application Project • The Windows Forms Designer is used to create a form’s visual interface • Controls appearing in the Toolbox are used to create the visual interface of a form • The Properties window provides a visual way to set properties for the form and control instances created on the form • So … what are these things

  17. Selected Windows of the Visual Studio IDE

  18. The Solution Explorer • The role of the Solution Explorer is the same for Console and Windows Application projects • It organizes the various parts of a solution • The project and support files are the same • The role of project references is the same • However, Windows Application projects reference different assemblies and namespaces  • In other words, the FCL elements you get “for free” are not the same • Form files appear instead of module files (although you can develop module files as well). • What’s in a Form File? We shall see soon.

  19. Solution Explorer for a WindowsApplication Project

  20. Form Methods and Events • Methods • The Close method closes the form and unloads it from memory • The Hide method makes a form invisible • Events • The Load event fires when a form is loaded into memory for the first time • You will find these in a typical Windows Forms window

  21. The Toolbox and Windows Forms Designer • The Toolbox and Windows Forms Designer are used together to create an application’s visual interface • The Toolbox contains controls • Controls created on a form are called control instances – they are objects or instances of a class • View the Windows Forms Designer by • Selecting the form in the Solution Explorer and clicking View Designer • Clicking View, Designer on the menu bar

  22. Toolbox Tabs • The Toolbox contains the controls that can be drawn on any form, and is divided into tabs • The All Windows Forms tab lists all controls • The Common Controls tab lists the most frequently used controls • The Containers tab lists controls used to group other controls • The Menus & Toolbars tab contains controls are used to create a menu system and toolbars • You should understand what these tools are • Hint – they are OBJECTS – instances of a class • We will see more about this in Slide Set 3B

  23. Toolbox Tabs (continued) • The Data tab contains controls used to work with a database • The Components tab contains controls used to work with Windows services (Windows components) • The Printing tab contains controls used to work with a printer • The Dialogs tab contains standard dialog boxes • The Crystal Reports tab contains controls used with the Crystal Reports reporting software

  24. The Organization of Controls in the Toolbox

  25. Introduction to Forms • A title bar appears along the top of a form  • An optional control box appears in the title bar • The control box contains Minimize, Maximize, Restore, and Close buttons • The buttons on the control box may be disabled or hidden • An icon appears on the left side of the title bar • Below the title bar appears an optional menu • The region inside a form's border is called the clientarea

  26. Characteristics of a Form 2 • What you see when you open a Form – Code Mode • Pull down View – see Object Browser, Design mode, and other elements

More Related