wpf - the future of gui is near
DESCRIPTION
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.TRANSCRIPT
Bartłomiej Filipek | Jagiellonian University | bfilipek.com | [email protected]
WPF: The future of Graphical User
Interface is near!
UI
UI’s are getting better and better…
but do we, as programmers, try to
make our apps visually attractive?
UI
http://i.imgur.com/pyz0K.png It would be hard to change
those standard dialogs…
UI
But maybe we can do something with search result
browsing, photos and other resources… ?
Better?
Cooliris My app – search3D
From Apple…
Samples
Play
Samples of my app: Search3D – available on my site bfilipek.com.
Plan
What is WPF?
How can I use this?
Are there any tools?
Where can I find it?
Future?
3.0
Optimalizations
2006
Vista & Server 2008
Architecture is mostly the same as in 2.0
But…
.NET 3.0
CLR WCF
WWF WPF
WCS
We have four new and interesting components:
• WCF – communication between apps, services…
• WWF – workflows
• WCS – card space
• And WPF – new and outstanding UIs
WPF – briefly…
from MSDN
Managed
Native
GPU
WPF uses GPU to render all the
controls and elements, so it needed
a mix of native and managed code.
Communication
between managed
code and directX…
WPF - features
Controls
Video
Text
GPU
Documents
…
Controls
There are more then 120 controls,
they are written almost from
scratch…
Data
Data
Xml
Database
Variables
…
UI
Control
Data View
binding
template
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>
Effects
Animations
Almost everything can be animated!
Positions
Shapes
Colors
Sizes
…
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.
Application Model
<Window
xmlns="http://scn"
xmlns:x="http"
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>
using System.Windows; // Window, RoutedEventArgs, MessageBox
namespace SDKSample
{
public partial class AWindow : Window
{
public AWindow()
{
// InitializeComponent call is required to merge the UI
// that is defined in markup with this class, including
// setting properties and registering event handlers
InitializeComponent();
}
void button_Click(object sender, RoutedEventArgs e)
{
// Show message box when button is clicked
MessageBox.Show("Hello, Windows Presentation Foundation!");
}
}
}
Code XAML Application
Visual Tree
window grid
Panel1
Button
Menu
radioButton
Panel2
Canvas
etditBox
listbox
documentView
At the beginning the VisualTree from
Xaml is created so that it can be
effectively renderd on the screen…
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…
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>
Samples
Play
Very basic samples from MSDN or
even from the template that is in the
VisualStudio08…
Tools
Division: Artist team and Programmers Team
Programmer is not a designer…!
Artist is not a coder…!
Expression Studio
VisualStudio 2008/2010
Blend
Show some Blend UI and how it
looks…
Debug
VisualStudio 08/10
Useful tools:
Snoop
Performance Profiling Tools for WPF
Where is WPF?
Where can we use it?
Everywhere!
On the market:
VisualStudio 2010!
Yahoo! Messanger
Windows Messanger
Silverlight…
Samples
Play
Samples from Blend and some more
advanced applications…
Additionals…
PixelShaders!
XBAP
ClickOnce
Interop
WPF
Win32Api
WinForms
DirectX
XNA
OpenGL WPF can be used in one application with some
other technologies like WinForms, WinApi, etc…
When we use it with DirectX there can be some
problems with the performance…
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…!
The future
Better interop
MultiTouch!
Ribbons
Integration with Windows 7
Graphics
PixelShader 3.0
Cached Composition
+ features of .NET4!
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
Sum up
Use your imagination!
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/
Questions?
