Introduction of Windows Application & WPF Application

Unit 8: Introduction of Windows Application & WPF Application:- This module explains
how to use Windows & WPF Application with Visual Studio 2010/2012
GUI
Definition:
Software that works at the point of contact (interface) between a computer and its user, and which
employs graphic elements (dialog boxes, icons, menus, scroll bars) instead of text characters to let the user
give commands to the computer or to manipulate what is on the screen. GUI elements are usually accessed
through a pointing device such as a mouse, pen, or stylus. All programs running under a GUI use a
consistent set of graphical elements so that once the user learns a particular interface, he or she can use all
programs without learning additional or new commands. Pioneered by Xerox and developed by
Apple computers, GUI is now employed by all modern operating systems and application programs.
These are two types of interfaces between a computer application and the user. They are
1. GUI (Graphical User Interface), where the user clicks on a visual screen that has icons, windows and
menus, by using a pointing device, such as a mouse.GUI is pronounced like "gooey".
2. CLI (Command Line Interface), where the user types a text command and the computer responds
according to that command.
Graphical user interfaces, such as Microsoft Windows and the one used by the Apple Macintosh, feature the
following basic components:

pointer : A

symbol

that

appears

on

the display

screen and

that

you

move

to select objects and commands. Usually, the pointer appears as a small angled
arrow. Text -processing applications, however, use an I-beam pointer that is shaped like a
capital I.

pointing device : A device, such as a mouse or trackball, that enables you to select objects
on the display screen.

icons : Small pictures that represent commands, files, or windows. By moving the pointer
to the icon and pressing a mouse button, you can execute a command or convert the icon
into a window. You can also move the icons around the display screen as if they were real
objects on your desk.

desktop : The area on the display screen where icons are grouped is often referred to as the
desktop because the icons are intended to represent real objects on a real desktop.

windows: You can divide the screen into different areas. In each window, you can run a
different program or display a different file. You can move windows around the display
screen, and change their shape and size at will.

menus : Most graphical user interfaces let you execute commands by selecting a choice
from a menu.

Why GUI?
We often work on school projects because we need credits :-) and we want to learn how to program. I think
that one of basic knowledge of programmer is to write a code in C++. It is possible to write almost
everything in C++. But some tasks might be little bit trickier. One of the fundamental things in C++ is
ability to work with libraries. Pure C++ can not do too much. After you explore how to write algorithms,
handle input and output, use data structures libraries you will come to need for a user interface.
Most people believe, that the program is the thing which they can see on their screens, nothing else.
Decades ago I was the same (so i used IDEs like Delphi or C++Builder). In you prior studies you discover
that it is definitely not true. But the majority of people expect from programmers, that they will write an
user interface. If you are lucky and smart, you will newer write one. But in other cases you will need
powerful (=easy) way to append user interface to your software project. By user interface I mean windows
and buttons on your screen which are handled by your stand-alone application (not web interface written in
HTML handled by web browser).

INTRODUCTION OF WINDOWS FORMS

Introduction
With all of the current talk about the Web, it may appear that the Microsoft Visual Studio development
system has de-emphasized support for building traditional Windows-based applications. Actually,
Microsoft is investing heavily in Windows-based application development.
Windows Forms is a new forms package that enables developers building Windows-based applications to
take full advantage of the rich user interface features available in the Microsoft Windows operating system.
Windows Forms is part of the new Microsoft .NET platform and leverages many new technologies
including a common application framework, managed execution environment, integrated security, and
object-oriented design principles. In addition, Windows Forms offers full support for quickly and easily
connecting to Web Services and building rich, data-aware applications based on the ADO+ data model.
With the new shared development environment in Visual Studio, developers will be able to create Windows
Forms applications using any of the languages supporting the .NET platform, including Microsoft Visual
Basic and C#.

Introduction
Windows Forms is the .NET replacement for MFC. Unlike the MFC library, which was a thin(ish) wrapper
on the Win32 API, Windows Forms is a totally object-oriented, hierarchical answer to Windows
development under .NET.
Despite its "Forms" epithet, the layout of components is not done with a resource file as is the case in MFC
dialogs and form windows. Every component is a concrete instance of a class. Placement of the components
and control of their properties are accomplished by programming them via their methods and accessors. The
drag-and-drop tools used to define a Windows Form are actually maintaining the source code that initializes,
places, and allows interaction with a target application.
Resource files are used by Windows Forms for tasks such as placing images on the form or storing localized
text, but not in the familiar format that has been used by Windows since the 1980s. As you might expect, the
new resource file format is an XML file. We'll examine resources in more detail in Chapter 3.4, "Windows
Forms Example Application (Scribble .NET)."
Windows Forms layout can be done by dragging components from a tool palette onto a form. You can use
VS.NET for this or alternatively, if you really want the whole hands-on experience, you can lay out your
forms by coding the objects directly in C#, VB, managed C++, or any of the .NET languages. To give you
the benefit of understanding what really goes on in a Windows Form, we won't be dealing with any of the
design tools early in this section. Rather, we will do as much as possible by hand and then, when you
understand the basics, move on to using the drag-and-drop tools.
User interaction in Windows Forms is accomplished through events. The components provide event
sources, such as mouse movement, position, and button clicks, and then you wire the events to handlers.
These are functions called by a standard form of delegate, which means there are no message maps of which
to keep track.

Introduction to Windows Presentation Foundation

Overview
The Windows Presentation Foundation is Microsofts next generation UI framework to create applications
with a rich user experience. It is part of the .NET framework 3.0 and higher.
WPF combines application UIs, 2D graphics, 3D graphics, documents and multimedia into one single
framework. Its vector based rendering engine uses hardware acceleration of modern graphic cards. This
makes the UI faster, scalable and resolution independent.
The followinig illustration gives you an overview of the main new features of WPF

Separation of Appearance and Behavior

WPF separates the appearance of an user interface from its behavior. The appearance is generally specified
in the Extensible Application Markup Language (XAML), the behavior is implemented in a managed
programming language like C# or Visual Basic. The two parts are tied together by databinding, events and
commands. The separation of appearance and behavior brings the following benefits:

Appearance and behaviour are loosely coupled

Designers and developers can work on separate models.
Graphical design tools can work on simple XML documents instead of parsing code.

Rich composition
Controls in WPF are extremely composable. You can define almost any type of controls as content of
another. Although these flexibility sounds horrible to designers, its a very powerful feature if you use it
appropriate. Put an image into a button to create an image button, or put a list of videos into a combobox to
choose a video file.

<Button>
<StackPanel Orientation="Horizontal">
<Image Source="speaker.png" Stretch="Uniform"/>
<TextBlock Text="Play Sound" />
</StackPanel>
</Button>

Introduction to WPF Layout

Why layout is so important
Best Practices
Vertical and Horizontal Alignment
Margin and Padding
Width and Height
Content Overflow Handling
Why layout is so important
Layout of controls is critical to an applications usability. Arranging controls based on fixed pixel
coordinates may work for an limited environment, but as soon as you want to use it on different screen
resolutions or with different font sizes it will fail. WPF provides a rich set built-in layout panels that help
you to avoid the common pitfalls.
These are the five most popular layout panels of WPF:

Grid Panel
Stack Panel
Dock Panel

Wrap Panel
Canvas Panel
Best Practices

Avoid fixed positions - use the Alignment properties in combination with Margin to position

elements in a panel
Avoid fixed sizes - set the Width and Height of elements to Auto whenever possible.
Don't abuse the canvas panel to layout elements. Use it only for vector graphics.

Use a StackPanel to layout buttons of a dialog

Use a GridPanel to layout a static data entry form. Create a Auto sized column for the labels and a
Star sized column for the TextBoxes.
Use an ItemControl with a grid panel in a DataTemplate to layout dynamic key value lists. Use
the SharedSize feature to synchronize the label widths.

Vertical and Horizontal Alignment

Use the VerticalAlignment and HorizontalAlignmant properties to dock the controls to one or multiple
sides of the panel. The following illustrations show how the sizing behaves with the different combinations.

Margin and Padding

The Margin and Padding properties can be used to reserve some space around of within the control.

The Margin is the extra space around the control.

The Padding is extra space inside the control.
The Padding of an outer control is the Margin of an inner control.

Height and Width

Alltough its not a recommended way, all controls provide a Height and Width property to give an element a
fixed size. A better way is to use the MinHeight, MaxHeight, MinWidth and
MaxWidth

properties to define a acceptable range.If you set the width or height to Auto the control sizes
itself to the size of the content.
Overflow Handling
Clipping
Layout panels typically clip those parts of child elements that overlap the border of the panel. This behavior
can be controlled by setting the ClipToBounds property to true or false.

Scrolling
When the content is too big to fit the available size, you can wrap it into a ScrollViewer. The ScrollViewer
uses two scroll bars to choose the visible area.
The visibility of the scrollbars can be controlled by the vertical and
horizontal ScrollbarVisibility properties.
<ScrollViewer>
<StackPanel>
<Button Content="First Item" />
<Button Content="Second Item" />
<Button Content="Third Item" />
</StackPanel>
</ScrollViewer>

DIFFERENCE BETWEEN WINDOWS FORMS AND WPF

WPF
Advantages:

Powerfull styling and skinning structure

Easy to create an own Look and Feel
Does support Windows Forms
The future technology for developing Vista Applications
The ability to reuse existing code
Highly advanced databinding possible

Disadvantages:

Declarative vs procedural code

Requires .NET Framework 3.0
Compared to Windows Forms, still in development fase
Requires Dx9 compatible vidcard for advanced graphics

Windows Forms:
Advantages:
Extensive documentation to be found on the internet
Plenty of examples
Does support WPF

Disadvantages:
How long will this be supported? (I've read somewhere that Microsoft is only developing WPF now,
only maintanance for Winforms)
Design your own look and feel in a application is a lot of work.