Presentation about Windows Presentation Foundation - that appeared in the .NET Framework 3.0. The technology gives us ability to create outstanding UI for our applications. I gave that lecture for IT Academic Days at my University.

1. WPF: The future of Graphical User
Interface is near!
Bartłomiej Filipek | Jagiellonian University | bfilipek.com | mail@bfilipek.com

2. UI
UI’s are getting better and better…
but do we, as programmers, try to
make our apps visually attractive?

3. UI
It would be hard to change
those standard dialogs… http://i.imgur.com/pyz0K.png

4. UI
But maybe we can do something with search result
browsing, photos and other resources… ?

5. Better?
Cooliris
My app – search3D
From Apple…

6. Samples
Play
Samples of my app: Search3D – available on my site bfilipek.com.

7. Plan
 What is WPF?
 How can I use this?
 Are there any tools?
 Where can I find it?
 Future?

8. 3.0
 Optimalizations
 2006
 Vista & Server 2008
 Architecture is mostly the same as in 2.0
 But…

9. .NET 3.0
WWF WPF
WCF WCS
CLR
We have four new and interesting components:
• WCF – communication between apps, services…
• WWF – workflows
• WCS – card space
• And WPF – new and outstanding UIs

10. WPF – briefly…
Managed Communication
between managed
code and directX…
Native
from MSDN
WPF uses GPU to render all the
controls and elements, so it needed
a mix of native and managed code. GPU

11. WPF - features
 Controls
 Video
 Text
 GPU
 Documents
 …

12. Controls
There are more then 120 controls,
they are written almost from
scratch…

13. Data
Data
binding
Xml UI
Database
Variables Control
…
template
Data View

14. Data Template
<DataTemplate DataType="{x:Type local:Task}">
<StackPanel>
<TextBlock Text="{Binding Path=TaskName}" />
<TextBlock Text="{Binding Path=Description}"/>
<TextBlock Text="{Binding Path=Priority}"/>
</StackPanel>
</DataTemplate>

15. Effects

16. Animations
 Almost everything can be animated!
 Positions
 Shapes
 Colors
 Sizes
…

17. 3D
 Lights
 Cameras
 Animations
 Meshes
 …
Although WPF is based on the GPU
redering, it is designed to render
GUIs not scenes like in FPP
games… it would be hard to do some
complicated 3D game in that.

18. Application Model
using System.Windows; // Window, RoutedEventArgs, MessageBox
namespace SDKSample
{
public partial class AWindow : Window
<Window
xmlns="http://scn" {
xmlns:x="http" public AWindow()
x:Class="SDKSample.AWindow" {
Title="Window with Button" // InitializeComponent call is required to merge the UI
Width="250" Height="100"> // that is defined in markup with this class, including
// setting properties and registering event handlers
<!-- Add button to window --
InitializeComponent();
>
<Button Name="button" }
Click="button_Click">Click
Me!</Button> void button_Click(object sender, RoutedEventArgs e)
{
</Window> // Show message box when button is clicked
MessageBox.Show("Hello, Windows Presentation Foundation!");
}
}
}
Code XAML Application

19. Visual Tree
At the beginning the VisualTree from
Xaml is created so that it can be Button
effectively renderd on the screen…
Panel1 Menu
radioButton
grid
window
Canvas
listbox
Panel2
etditBox
documentView

20. XAML
<Window
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
x:Class="SDKSample.AWindow"
Title="Window with Button"
Width="250" Height="100">
<!-- Add button to window -->
<Button Name="button" Click="button_Click">Click Me!</Button>
</Window>
XAML is based on XML, and in some
part is similar to XBL (from Mozilla).
XAML is designed to describe UI in
more effective and intuitive way than
we could code in C# for instance…

21. Animations
<Rectangle
Name="MyRectangle"
Width="100"
Height="100"
Fill="Blue">
<Rectangle.Triggers>
<!-- Animates the rectangle's opacity. -->
<EventTrigger RoutedEvent="Rectangle.Loaded">
<BeginStoryboard>
<Storyboard>
<DoubleAnimation
Storyboard.TargetName="MyRectangle"
Storyboard.TargetProperty="Opacity"
From="1.0" To="0.0" Duration="0:0:5"
AutoReverse="True" RepeatBehavior="Forever" />
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Rectangle.Triggers>
</Rectangle>

22. Samples
Play
Very basic samples from MSDN or
even from the template that is in the
VisualStudio08…

23. Tools
 Division: Artist team and Programmers Team
 Programmer is not a designer…!
 Artist is not a coder…!
 Expression Studio
 VisualStudio 2008/2010

24. Blend
Show some Blend UI and how it
looks…

25. Debug
 VisualStudio 08/10
 Useful tools:
 Snoop
 Performance Profiling Tools for WPF

26. Where is WPF?
 Where can we use it?
 Everywhere! 
 On the market:
 VisualStudio 2010!
 Yahoo! Messanger
 Windows Messanger
 Silverlight…

27. Samples
Play
Samples from Blend and some more
advanced applications…

28. Additionals…
 PixelShaders!
 XBAP
 ClickOnce

29. Interop
Win32Api
WPF WinForms
XNA
DirectX
WPF can be used in one application with some
other technologies like WinForms, WinApi, etc… OpenGL
When we use it with DirectX there can be some
problems with the performance…

30.  RIA
 Competitor for Adobe Flash
 Subset of WPF’s XAML
 Less features and a bit limited
 But it can be used in browsers
without the whole .NET
platform…!

31. The future
 Better interop
 MultiTouch!
 Ribbons
 Integration with Windows 7
 Graphics
 PixelShader
3.0
 Cached Composition
 + features of .NET4!

32. Advice
 Use powerful fatures of WPF with a care!
 Do you really need 3D?
 2d is far more better for UI
 3d can be used usually in rare cases
 Colors
 Layout
 Performance

33. Sum up
Use your imagination!

34. Sources…
 http://silverlight.net/showcase/
 MS: The Professional Developers Conference 09
 MSDN
 Tutorials:
 http://www.wpftutorial.net
 codeproject: WPF: A Beginner's Guide - Part 1 of n
 http://joshsmithonwpf.wordpress.com/
 http://sachabarber.net/

35. Questions?

36. Thanks for watching 
Bartłomiej Filipek
bfilipek.com
mail@bfilipek.com