Professional Documents
Culture Documents
What to expect?
Basic working knowledge of WPF
No prior WPF knowledge required
Some background
A typical windows app used to rely on
User32
creating and managing windows, receiving window messages
DirectX platform
A tricky game platform for windows app
Relied on hardware acceleration close collaboration with
graphic card vendors
Fast. Use whatever I can from the graphics engine to take
advantage of GPU.
DirectX is more efficient because it understands higherlevel ingredients such as textures and gradients that can
be rendered directly by the video card.
Some background
(contd.)
Some background
Win App rendering style
Individual paint
Real state model
(contd.)
Resolution Independence
Typical windows app
Will look smaller on high resolution
Will look larger on low resolution
Resolution independence
Calculates how many pixels required to
make an inch.
So one inch of control remains one inch
of control
Resolution Independence
(contd.)
Due to resolution independence it
requires you to think differently.
Vector rather then bitmap
Bitmap such as icons dont scale properly.
Provides rich support for vectors graphics
which has no scaling issues.
Adds to UI Element
1. Databinding
2. Animation
3. Styles
4. Positioning
XAML
Extensible Application Markup
Language
A standard based upon xml
Pronounced as zammel
WWF
Silverlight
WPF
XPS (Formatted electronic documents)
XAML Basics
Every element in a XAML document
maps to an instance of a .NET class.
You can set the properties of each
class through attributes.
Setup complex properties via child
elements.
Properties in XAML
Simple Properties
Complex Properties
Type Converters
A type converter is used to
To bridge the gap between string values
and non string properties, the XAML
parser needs to perform a conversion.
The conversion is performed by type
converter
Any property decorated with
TypeConverter attribute will work
Any class decorated with TypeConverter
then XAML will use that for each
property of that class.
Layout
Typical windows application controls
were fixed in place.
Dock and Anchor
Layout Philosophy
A WPF window can hold only a single element.
In WPF, layout is determined by the container that
you use.
Elements (such as controls) should not be explicitly sized.
You can limit controls to acceptable sizes by setting a maximum
and minimum size.
Fixed size elements dont work for localization and dynamic
content.
Arrange stage
The container arranges the child elements
as per preferred size.
If element preferred size is not possible, it will be
truncated unless MinimumSize is mentioned.
Layout Containers
Stack Panel
As the name implies it stacks the elements
On top of each other
Orientation Default or Vertical
Side by side
Orientation Horizontal
Properties
HorizontalAlignment
VerticalAlignment
Margin
Minimum Width, Hight
Width, Height
Dock Panel
Docks control to edges
Top
Bottom
Left
Right
ShowGridLines
Grid.RowSpan
Grid.ColumnSpan
Grid Splitter
Uniform Grid
Canvas.Left
Canvas.Top
Explicit sizes
Canvas.ZIndex
Dependency Properties
Dependency properties are required
for a range of WPF features.
change notification
Data binding & Triggers
Dynamic Resolution
1
Project Style
Theme Style
7
8
Attached Properties
Dependency property
Defined in a class but applied in another
Grid.Row
Grid.Column
Dependency Props
Lets check them out for real
Local value
Style
Style trigger
Inheritance
Local Value
WPF Events
WPF introduced new event model
called Routed Events
These events have more travelling power
Direct Events
Like ordinary events. E.g. Mouse enter
Bubble Up Events
Move up the control hierarchy
E.g. MouseUp
End of
Day 1
Day 1 Recap
WPF
What it does?
Advantages over win forms
XAML
Benefits of XAML?
Events
Types ?
When to use what type?
Dependency Props
Dynamic resolution?
Benefits
Layout
Panels?
When to use what panel?
WPF Commands
Application command management
Command invocation from various points
Central control
Enabling / disabling
Input Gestures
Prebuild commands
ApplicationCommands
NavigationCommands
EditingCommands
ComponentCommands
MediaCommands
Custom commands
Command Sources
Can be the controls who implement
ICommandSource interface.
Expose following properties
Command
CommandParameter
CommandTarget
Command Binding
Each command source will be
disabled until a command binding is
not made.
Command binding tells
What to do when command is invoked?
How to determine if command can be
executed?
WPF Resources
A reusability tool
Any type can be a resource as long as it can be
used with XAML
Represented with a key
Can be applied to a certain type e.g. Buttons
Resource Hierarchy
Application Level
Window Level
Control Level
WPF Resources
Static
Should be loaded before its referenced.
Handler to resource is obtained once
Normally used for
To improve performance gains
Dynamic
Handler to resource is created every time when it is accessed
Normally used for
System resources
When resources change based upon some other parameters such as
user preferences, locale etc
You want to improve first time load time for better load performance.
Resource dictionaries
Element binding
Extract some information from a
source object and use it to set a
property in a target object.
The target property is always a
dependency property, and its usually in
a WPF element
Element Binding
Binding Modes
OneWay
TwoWay
OneTime
OneWayToSource
Can be used to set a property which is not
dependency property
Default
Element Binding
Binding Updates
PropertyChanged
As soon as the property is changed the
binding is updated
LostFocus
Explicit
The source is not updated unless you call
the BindingExpression.UpdateSource()
method.
Default
Bind to DataContext
Lets check out code in visual studio
Markup Extensions
Attribute starting with { mark the start of an extension
Provides an instance of appropriate object
Convenient specialized syntax
Types
Static Resource
Dynamic Resource
Source
Relative Source
Binding
x:Type
x:Static
x:Null
x:Array
Localization
Lets check out localization features
of WPF application.
Styles
One of the most powerful concepts
Work like CSS
Essentially style is a collection of property
settings
Control Templates
Change the UI appearance
Implemented via Style
Dependency property Template
Object of type ControlTemplate
Things to be investigated
Based upon what you have learned so
far you can check the following at your
own.
Different UI controls
Menus
Toolbars
etc.
What to expect
In the next and last session we will
be
Exploring what is EF
Entity Framework 4.0
Entities
POCO
Animation
Replaced timer based system with
property based system.
It paints pixels, not controls
Animation is segregated from controls
Data binding
Pull information out of an object and
stuff it into another one
DataContext
{Binding. expression
Lets check it out.
We will create a small UI binding to a table in
database.
Data binding
Binding to collection of objects
WPF classes which derive from ItemsControl can
display a list of objects
ListBox, ComboBox, ListView, DataGrid
Three properties
ItemsSource
(collection implementing IEnumerable)
DisplayMemberPath
ItemTemplate
Custom data template to change the way control is rendered.
Data Formatting
StringFormat, Multibinding
Validation
Data Views
Automatically created and sits between your data
source and bound control. (CollectionViewSource)
Tracks current item and supports sorting, filtering and
grouping
Independent of data source, i.e. you can apply two
different filters on different controls against same data
source
View Scenarios
IBindingList data source, a BindingListCollectionView
(ADO.NET DataTable)
IList data source, a ListCollectionView (ObservableCollection)
Ienumerable data source a CollectionView.
List View
Adds to List box functionality
Adds columns to list box
Switch between views without rebinding