Confidential 2009 Syntel, Inc.

Problem System
Suppose a hospital wants to create a new application for
examining and monitoring patients. The requirements for this new
application's user interface might include the following:
Displaying images and text about the patient.
Displaying and updating two-dimensional graphics showing the patient's vital
signs, such as heart rate and blood pressure.
Providing three-dimensional views and overlays of patient information.
Presenting video of ultrasounds and other diagnostics, perhaps allowing
physicians and nurses to add annotations.
Allowing hospital staff to read and make notations on documents describing
the patient and her condition.
Running both as a Windows application, allowing full capability for hospital
employees, and in a security-restricted Web browser application, allowing
more limited access by remote physicians via the Internet.


Confidential 2009 Syntel, Inc.
Without WPF
To create the forms, controls, and other typical aspects of a Windows
graphical user interface - Windows Forms,
If the interface needs to display documents - on-screen documents,
For images and two-dimensional graphics - GDI+
To display video and audio - Windows Media Player
For three-dimensional graphics, - Direct3D

Confidential 2009 Syntel, Inc.
What WPF Offers
Unification
Confidential 2009 Syntel, Inc.
World before WPF
In old days, programming for Windows was about windows,
menus, dialogs and child controls
To make it all work, we had WndProcs (windows procedure
functions) and messages
In the Microsoft Foundation Classes, we had this thing
called a document which was separate from the view
The document could be any old data and the view was the
big blank space in the middle that we fill however we have
to use MFC wrappers around GDI


Confidential 2009 Syntel, Inc.
World before WPF
In the meantime, a whole other way of interacting with
content came along with internet (Html) and Ajax coming in
Graphics hardware continues to get better (and cheaper)
and consumer expectations continue to rise, but until now,
the development experience has not improved significantly

Confidential 2009 Syntel, Inc.
Enter WPF
Microsoft recognized that something brand new was needed
that escaped the limitations of GDI+ and USER yet provided
the kind of productivity that people enjoy with frameworks
like Windows Forms
Windows Presentation Foundation (WPF) is the answer for
software developers and graphic designers who want to
create modern user experiences without having to master
several difficult technologies

Confidential 2009 Syntel, Inc.
Key Scenarios
Next-Gen Windows Smart Client applications:

Installed desktop applications

Browser applications (XAML Browser Application)

Flexible deployment
Confidential 2009 Syntel, Inc.
Windows Presentation Foundation
Deliver Innovative User Interfaces
Increase Developer-Designer Productivity
Achieve Flexible Application Deployment
Leverage Existing Code Base and Skills Set
Superior UX with UI, Media & Documents
A productive, unified approach to UI, media
and documents to deliver unmatched UX
Confidential 2009 Syntel, Inc.
Designer-Developer Productivity
Microsoft Tools for Designers &
Developers

Declarative Programming through
XAML

Third Party Tools (e.g. Aurora by
Mobiform, ZAM 3D by Electric Rain)
Designers design
With XAML designers &
developers can streamline
their collaboration

Developers add business logic
Confidential 2009 Syntel, Inc.
Declarative Programming Through XAML
XAML = Extensible Application Markup Language
Easily toolable, declarative markup
Code and content are separate
Can be rendered in the browser / standalone application
<Button Width="100"> OK
<Button.Background>
LightBlue
</Button.Background>
</Button>
Button b1 = new Button();
b1.Content = "OK";
b1.Background = new
SolidColorBrush(Colors.LightBlue);
b1.Width = 100;
C#
Dim b1 As New Button
b1.Contet = "OK"
b1.Background = New _
SolidColorBrush(Colors.LightBlue)
b1.Width = 100
VB.NET
Confidential 2009 Syntel, Inc.
Controls, Templates, Styles & Resources,
Layouts, Animation
Animation, Triggers, Timelines
<StackPanel>
<StackPanel.Triggers>
<EventTrigger RoutedEvent=Button.Click">
<EventTrigger.Actions>
<BeginStoryboard>
<BeginStoryboard.Storyboard>
<Storyboard>

<ColorAnimation To="Yellow" Duration="0:0:0.5
Storyboard.TargetName="TheBrush"
Storyboard.TargetProperty="Color" />

<DoubleAnimation To="45" Duration="0:0:2"
Storyboard.TargetName="LowerEllipseTransform"
Storyboard.TargetProperty="Angle" />

...
</StackPanel.Triggers>

remainder of contents of StackPanel, including x:Name'd
TheBrush and LowerEllipseTransform

</StackPanel>
UI Services
Templates
Layout
Controls Library
Styles and Resources
Annotation
Confidential 2009 Syntel, Inc.
Interoperability
Incrementally embrace WPF, while
leveraging existing investments.

WPF - Windows Forms Interoperability
WPF - HWNDs
Confidential 2009 Syntel, Inc.
The highlights of WPF
WPF aims to combine the best attributes of systems such
as DirectX (3D and hardware acceleration), Windows Forms
(developer productivity), Adobe Flash (powerful animation
support), and HTML (declarative markup and easy
deployment)

Confidential 2009 Syntel, Inc.
WPF Summary




Deliver Innovative User Experiences
Increase Developer-Designer Productivity
Achieve Flexible Application Deployment
Leverage Existing Code Base & Skill Set
Confidential 2009 Syntel, Inc.
XAML
Reminiscent of WinForms, youll find many of the controls
you are used to when building applications: Button,
ComboBox, ListBox, etc
However, in WPF, UI design is represented in a completely
different fashion
Instead of using a designer generated code file or a
resource file as the source of a UI definition, WPF uses
XML, Specifically, it uses XAML
Confidential 2009 Syntel, Inc.
XAML
XAML stands for eXtensible Application Markup Language
You can think of it as HTML for Windows applications, but
it is really quite a bit more expressive and powerful
XAML is a relatively simple and general-purpose
declarative programming language suitable for
constructing and initializing .NET objects
Confidential 2009 Syntel, Inc.
Elements & Attributes
The .NET Framework 3.0 includes a compiler and run-time
parser for XAML, as well as a plug-in that enables you to
view standalone WPF-based XAML files (sometimes called
loose XAML pages) inside Internet Explorer
The XAML specification defines rules that map .NET
namespaces, types, properties, and events into XML
namespaces, elements, and attributes

Confidential 2009 Syntel, Inc.
XAML
Declaring an XML element in XAML (known as an object
element) is equivalent to instantiating the corresponding
.NET object (always via a default constructor)
Setting an attribute on the object element is equivalent to
setting a property of the same name (called a property
attribute) or hooking up a handler for an event of the same
name (called an event attribute)

Confidential 2009 Syntel, Inc.
Important WPF Features
XMAL
Layout
Data Binding
Data Templates
Styles
Control Templates
3D
Animation
XAML Browser Application
Confidential 2009 Syntel, Inc.
UI Layouts
When building a UI, one of the first issues you will deal with
is how to arrange all of the UI pieces on screen
In previous MS technologies we have had limited support
for layout
.NET 2.0 offers WinForms developers some long awaited
options in this area
WPF, however, has made layout a first class citizen from
the beginning
There is quite a variety of layout options to choose from
Confidential 2009 Syntel, Inc.
StackPanel
<StackPanel>
<TextBlock>My UI</TextBlock>
<ListBox>
<ListBoxItem>Item 1</ListBoxItem>
<ListBoxItem>Item 2</ListBoxItem>
</ListBox>
<RichTextBox/>
</StackPanel>

Confidential 2009 Syntel, Inc.
StackPanel
StackPanel is one of the simplest layout options available
It does exactly what its name implies: stack elements, either
vertically or horizontally
Vertical is the default, but you can specify horizontal by
setting the Orientation property
Confidential 2009 Syntel, Inc.
DockPanel
<DockPanel>
<TextBlock DockPanel.Dock="Top">My UI</TextBlock>
<ListBox DockPanel.Dock="Right">
<ListBoxItem>Item 1</ListBoxItem>
<ListBoxItem>Item 2</ListBoxItem>
</ListBox>
<RichTextBox/>
</DockPanel>
Confidential 2009 Syntel, Inc.
DockPanel
The DockPanel allows you to dock elements to the top,
bottom, left or right of the container
The last element will, by default, fill the remaining space
Confidential 2009 Syntel, Inc.
Data Binding
Databinding and DataTemplates are the most powerful
features of WPF
support for datadinding is built into WPF from its core
Almost every graphics/UI object that you will work with in
WPF inherits from DependencyObject
The functionality supported by this base is what powers
animation, styling and databinding

Confidential 2009 Syntel, Inc.
Summary
Windows Presentation Foundation (WPF) (formerly known
by its code name "Avalon") is a brand-new presentation
framework for Windows XP and Windows Vista
WPF is a new API for creating graphical user interfaces for
the Windows platform
It is an alternative to WinForms that further empowers
developers by providing an API capable of taking full
advantage of the multimedia facilities of the modern PC
Confidential 2009 Syntel, Inc.
Summary
Unlike WinForms, it does not wrap Win32 but is completely
new, built from the ground up using .NET. The fundamental
power of WPF comes from the fact that it is vector based,
hardware accelerated and resolution independent
It includes a new graphics engine that supports 3-D
graphics, animation, and more
An XML-based markup language (XAML) for declaring the
structure of your Windows UI; and a radical new model for
controls