introduction about wpf

8/9/2019 Introduction About WPF

1/60

1

Introduction about

Windows Presentation Foundation

Trainer: Thoai Nguyen

Duration: 4 hours


2/60

2

Agenda

Introduce WPF XAML

Dependency Properties and Routed Events

Commands in WPF Resources & Styles in WPF

Control Templates

Data Binding Data Templates


3/60

3

What is WPF?

WPF = Windows Presentation Foundation(Avolon)

An Engine?

A graphical display system for Windows Set of .NET libraries?


4/60

4

WPF uses DirectX

Windows

.NET Framework WPF DirectX

WPF applications use DirectX nomatter what type of user interfaceyou create


5/60

5

Resolution Independence

WPF bases its scaling on the system DPIsetting


6/60

6

The Evolution ofWPF

WPF 3.0

WPF 3.5 & VS.NET 2008


7/60

7

New Features in WPF 3.5

Firefox support forXBAPs

Data binding support forLINQ

Data binding support forIDataErrorInfo.

Support for placing 2-D elements on

3-D surfaces.


8/60

8

WPF will replace Windows FORM?

Windows FORM : mature WPF : future enhancements and longevity

Windows Form is stillsupportedNo need to recode myapplication for WPF


9/60

9

Silverlight

Is a subset ofWPF Silverlight 1.0: Javascript

Silverlight 2.0: .NET languages

Silverlight 3.0: Improve performance Silverlight 4.0: still Beta atm


10/60

10

Silverlight vs Flash?

Flash is mature Silverlight is future

Development IDE

.NET Framework &Languages

Perception

Microsoft has Windows

Demo: http://www.shinedraw.com/flash-vs-

silverlight-gallery/


11/60

11

Architecture ofWPF

PresentationFramework.dll

PresentationCore.dll WindowsBase.dll

milcore.dll WindowsCodecs.dll

Direct3D User32

ManagedWPF API

MediaIntegration

La er


12/60

12

The Last Word

Hardware acceleration Resolution independence

No fixed control appearance

Declarative user interfaces Object-based drawing


13/60

13

What is XAML?

Extensible Application Markup Language,and pronounced zammel


14/60

14

Graphical User Interfaces Before WPF

Hard to separate the graphical content from the code

Each graphical element (background, button, and so on) needs to

be exported as a separate.

User interface logic needs to be embedded in the code.

..

Designers dont work on VS.NET


15/60

15

The Variants of XAML

WPF XAML XPS XAML

Silverlight XAML

WF XAML


16/60

16

XAML Compilation

BAML = Binary Application Markup Language

XAML#

i g

bly

E b dd dr ourc

BAML


17/60

17

XAML Basics

Every element = an instance of a .NETclass

Allow nested elements

Can set the properties of each classthrough attributes

XAML Demo


18/60

18

Properties and Events in XAML

Simple Properties and Type Converters Complex Properties

Markup Extensions

Attached Properties Nesting Elements

Special Characters and Whitespace

Events


19/60

19

Understanding DependencyProperties

Dependency Properties are:

not normal properties

the basis for a number of key WPF wrapped by ordinary .NET property procedures


20/60

20

Defining and Registering a DependencyProperty

They are : represented by read-only static fields

registered in a static constructor

wrapped by a standard .NET property

Example


21/60

21

How WPF Uses DependencyProperties?

change notification dynamic value resolution.


22/60

22

Understanding Routed Events

Allows an event to originate in one elementbut be raised by another one


23/60

23

Defining and Registering a Routed Event

They are : represented by read-only static fields

registered in a static constructor

wrapped by a standard .NET event definition

Example


24/60

24

Event Routing

Direct events Bubbling events

Tunneling events

Handling a Suppressed Event

Example


25/60

25

What is Attached Events?

Scenario with a Stack Panel

pnlButtons.AddHandler(Button.Click, new

RoutedEventH

andler(DoSomething));

Command 1Command 2Command 3

...


26/60

26

Commands

Limitation of Events WPF fills in the gaps with a new

commanding model


27/60

27

Still has some fairly significant gaps

Command tracking Undoable commands

Can be in different modes


28/60

28

The WPF Command Model

The ICommand Interface The RoutedCommand Class

The RoutedUICommand Class


29/60

29

Executing Commands

Command Sources


30/60

30

Executing Commands

Command Bindings

// Create the binding.

CommandBinding

inding

new CommandBinding(Appli ati nCommands.New);// Attach the event handler.binding.

ut d +=

Command_Executed;// Register the binding.t

i

.CommandBinding

.Add(binding);


31/60

31

Advanced Commands

Custom Commands Using the Same Command in Different

Places

Using a Command

Parameter

Tracking and Reversing Commands

DO IT YOURSE F


32/60

32

Short introduction about Resources

AssemblyResources Object Resources


33/60

33

Need a font for all controls?

Times New Roman

18Bold

Customized Button


34/60

34

What do styles add to the picture?

We use style instead

Customized Button


35/60

35

Creating a Style Object

Setters Triggers

Resources

BasedOn TargetType

Example


36/60

36

Style Triggers

Trigger MultiTrigger

DataTrigger

MultiDataTrigger EventTrigger

Example


37/60

37

Control Templates - Logical Trees


38/60

38

Control Templates - Logical Trees

Windows

StackPanel

Button

String

Button

String


39/60

39

Control Templates - Visual Trees

Windows

StackPanel

utton

utton

Chrome

Content

Presenter

Text lock

String

utton

utton

Chrome

Content

Presenter

Text lock

String

-Alter oneof theelements in the vis

ual treeusing st les

- Createanew template for our control

Simple WindowExample


40/60

40

Control Templates

Want a window like this?


41/60

41

Creating Control Templates

A Simple Button


42/60

42

Template Triggers

Need more visual effect?

Example Simple Button


43/60

43

TEMPLATES VS. STYLES

Both allow you to chan e theappearance of an element

Slyle cant change visual tree


44/60

44

Advanced Templates

Organizing Template Resources Building More Complex Templates

DO IT YOURSE F


45/60

45

Data Binding

is extract some information from a sourceobjectand use it to set a property in a

target object

Example Binding to the Properties of an

Element.


46/60

46

Binding Direction

OneWay TwoWay

OneTime

OneWayToSource Default


47/60

47

Binding Updates

PropertyChanged LostFocus

Explicit

Default


48/60

48

Binding to Objects That Arent Elements

The only requirement is that the informationyou want to display must be stored inpublic

properties

Use 1 of 3 options:

Source

RelativeSource

DataContext


49/60

49

Binding using Source

Calibri


50/60

50

Binding using RelativeSource


51/60

51

Binding using DataContext

When many elements bind to 1 object

.


52/60

52

Binding to a Collection ofObjects

3 properties: ItemsSource

DisplayMemberPath

ItemTemplate

Demo


53/60

53

Data Conversion

Implements IValueConverter Add the [ValueConversion] attribute

Implement a Convert() method

Implement a

ConvertBack() method

Demo


54/60

54

Data Template

to customize the way each item is shown inan ItemsControl

is a chunk ofXAML markup that defines

how a bound data object should be

displayed

ItemsControl: ListView, ListBox, ComboBox, etc

ContentControl: Panel, etc


55/60

55

DataTemplate Example


56/60

56

Second DataTemplate Example

View Demo


57/60

57

Varying Templates

Use a data trigger

Use a value converter

Use a template selector


58/60

58

Template Selectors

Inherit class DataTemplateSelector

Implement method SelectTemplate()

Vie Demo


59/60

59

Templates and Selection

If you select an item in the list, WPFautomatically sets the Foreground and

Background properties of the item container

Vie Demo


60/60

60

Exercise & Question?

introduction about wpf

Documents