Introduction to WPF

Windows Presentation Foundation codename Avalon Mark Blomsma

Software architect Develop-One

Agenda
Introductions Why WPF? Demos : The Basics Visual Studio Orcas with Cider Expressions Interactive Designer

1/27/2006

2006 Develop-One

Mark Blomsma
Professional developer since 1992 Microsoft Certified Professional Microsoft Most Valuable Professional (MVP) for three years running Consultant at Develop-One Software Architect at Omnext.NET

1/27/2006

2006 Develop-One

Why WPF?
Windows Presentation Foundation, part of WinFx, is a completely new presentation framework replacing User, GDI, GDI+, Win32 Competes with HTML, Macromedia Flash, SVG Give developers the tools to make Office quality applications, but also Flash like websites.
1/27/2006 2006 Develop-One 4

Demos : The Basics

Hello World The Application Object The content model EventHandling Databinding

1/27/2006

2006 Develop-One

Hello World
C# example
using System; using System.Windows; namespace AvalonExample { class MyApp { [STAThread] static void Main(){ MessageBox.Show(Hello World!); }

}
}

1/27/2006

2006 Develop-One

Hello World
XAML example
<Page xmlns="http://schemas.microsoft.com/winfx/avalon/2005" xmlns:x="http://schemas.microsoft.com/winfx/xaml/2005"> <TextBlock>Hello World!</TextBlock> </Page>

1/27/2006

2006 Develop-One

Application Object
Application object acts as container for more complex applications public class MyApp : Application
{

MainWindow [STAThread] static void Main(string[] args) { Application events like

}

MyApp app = new MyApp(); app.Startup +=Shutdown app.OnApplicationStartup; Startup & app.Run(args);

void OnApplicationStartup(object sender, StartupEventArgs e) { Window w = new Window(); w.Title = "Mark says: Hello World!"; w.Show(); } }
1/27/2006 2006 Develop-One 8

Content Model
WPF offers strong separation of behaviour (API) and presentation Behaviour (API) consists of
Commands, Properties, Events & Methods

Presentation of controls is controlled by

Nested content Templates

1/27/2006

2006 Develop-One

StackPanel example
<Window x:Class="Demo4.Content.Window1" xmlns="http://schemas.microsoft.com/winfx/avalon/2005" xmlns:x="http://schemas.microsoft.com/winfx/xaml/2005" Title="Demo4.Content"> <StackPanel Orientation=Vertical"> <Button Name="button1">Just text</Button> <Button Name="button2"> <Image Source="banner.jpg" Name="image1" Width="100"/> </Button> <Button Name="button3"> <StackPanel Orientation="Vertical"> <TextBlock>Just text<LineBreak/>The next line</TextBlock> <Image Source="banner.jpg" Name="image1" Width="100"/> </StackPanel> </Button> </StackPanel> </Window>

1/27/2006

2006 Develop-One

10

Grid example
<Window x:Class="Demo4.Content.Window1" xmlns="http://schemas.microsoft.com/winfx/avalon/2005" xmlns:x="http://schemas.microsoft.com/winfx/xaml/2005" Title="Demo4.Content"> <Grid ShowGridLines="True"> <Grid.ColumnDefinitions> <ColumnDefinition/> <ColumnDefinition/> <ColumnDefinition/> </Grid.ColumnDefinitions> <Grid.RowDefinitions> <RowDefinition/> <RowDefinition/> <RowDefinition/> </Grid.RowDefinitions> <TextBlock Grid.Column="0" Grid.Row="0">Top left</TextBlock> <TextBlock Grid.Column="1" Grid.Row="1">Middle</TextBlock> <TextBlock Grid.Column="2" Grid.Row="2">LRight</TextBlock> </Grid> </Window>
1/27/2006 2006 Develop-One 11

Eventhandling
Most significant feature is Event Bubbling called EventRouting void innerButton_Click(object sender, RoutedEventArgs
{

e)

RoutedEventArgs
MessageBox.Show("Hello SDN!");

e.Handled = true; e.Handled = true;

}

1/27/2006

2006 Develop-One

12

Databinding
New ways of databinding? Important features:
Window.DataContext StaticResources DataTemplates ObservableCollection

Tip: Use INotifyPropertyChanged

1/27/2006 2006 Develop-One 13

Databinding example
<StackPanel Name="pnlMain"> <TextBlock>Name: </TextBlock> <TextBox Name="txtName" Text="{Binding Path=Name}/> <TextBlock>City:</TextBlock> <TextBox Name="txtCity" Text="{Binding Path=City}/> <StackPanel Orientation="Horizontal"> <Button Name="btnPrevious Click="btnPrevious_Click">&lt;</Button> <Button Name="btnNext Click="btnNext_Click">&gt;</Button> </StackPanel> <ListBox Name="lstCustomers IsSynchronizedWithCurrentItem="True ItemsSource="{Binding}"/> </StackPanel>

1/27/2006

2006 Develop-One

14

Demo : Orcas with Cider

Demo based on the March CTP Download from
http://msdn.microsoft.com/windowsvista

1/27/2006

2006 Develop-One

15

Demo : Expressions Interactive Designer

A.k.a. Sparkle Will this kill Macromedia Flash? Download from http://msdn.microsoft.com
(http://www.microsoft.com/downloads/details.aspx?FamilyId=D1336F3E-E677-426B-925C-C84A54654414&displaylang=en)

1/27/2006

2006 Develop-One

16

Links
http://www.microsoft.com/products/expression/en/default.mspx http://blogs.infosupport.com/ernow/ http://channel9.msdn.com/wiki/default.aspx/Cider.HomePage http://www.develop-one.com

1/27/2006

2006 Develop-One

17