.NET Framework 3.0 - Presentation

About Me

• Patrik Löwendahl– C# MVP– Certified Vista Touchdown Trainer– Instructor @ Cornerstone– Blog @ www.lowendahl.net

• Cornerstone– Swedens largest CPLS– 4 Course centers, Stockholm, Malmoe,

Gothenburg, Sundsvall.

Agenda

• WPF Solutions

• WPF Data Binding

• WPF Interop with Windows Forms

• WPF/e

WPF Solutions

• Overview

• Styles and Resources

• 3D Rendering

WPF Vision

• Integrated, vector-based composition engine

– Utilizing the power of the PC throughout the graphics stack

• Unified approach to UI, Documents, and Media

– Integration as part of development and experience

• Declarative programming– Bringing designers directly into

application development

• Ease of deployment– Allowing administrators to deploy and

manage applications securely

WPF Controls

• Controls are ”lookless”– Behaviour and rendering is separated

• Based on basic shapes

• Includes Actions, Triggers, Styling

WPF Styles

• Styles sets up control rendering

• Microsoft delivers Expression Suite to create styles

• Styles can be shareable throughout the application

• Styles can be dynamic

WPF Data Binding

• Declarative

• Shared data sources

• Master / Detail Binding

WPF Databinding model

• Target– Any property, any element

• Source– CLR Object– WPF Element– ADO.NET– XML

• Dynamic– INotifyPropertyChanged, DependencyProperty or

PropertyDescriptor• Multiple models

– One Time– One Way– Two Way

• Value Converter

Control

“Data Item” Property

Binding

Property

Declarative DataBinding

<Image Source="truck.png"Canvas.Left= "{Binding Path=Value, ElementID=horzPos}"/>

<Slider Orientation= "Horizontal" Name="horzPos" Value="40"/>

{Binding Path=Value, ElementName=horzPos}

Static Data Sources

• Add to resource dictionary– Named source objects– Point to lists or methods

• Use with resource binding– {StaticResource theCars}

<Window> <Window.Resources> <ObjectDataProvider x:Key=“theCars" ObjectType=" {x:Type Cars}" /> </Window.Resources>

...

<TextBlock TextContent="{Binding Path=Bar, Source={StaticResource myData} }" />

Share Common Source

StackPanel

Image

HorizontalSlider

Value= {Binding Path=XPos, Source={StaticResource myData}}

Canvas.Left= {Binding Path=XPos, Source={StaticResource myData}}

DataContext= {Binding Source={StaticResource myData}}

Value= {Binding Path=XPos}

Canvas.Left= {Binding Path=XPos}

Using DataTemplates

DataTemplate

class Car{ string Image {get;set} string Model {get;set}}

<DataTemplate x:Key="carTemplate"> <Border BorderBrush="Blue" BorderThickness="2" Background="LightGray" Margin="10" Padding="15,15,15,5"> <StackPanel> <Image HorizontalAlignment="Center" Source="{Binding Path=Image}" /> <Border HorizontalAlignment="Center" BorderBrush="Navy" Background="#DDF" BorderThickness="1" Margin="10" Padding="3"> <TextBlock FontSize="18" Text="{Binding Path=Model}" /> </Border> </StackPanel> </Border></DataTemplate>

Master Details Binding

• Use ItemsControl (e.g. ListBox) as master– Set

IsSynchronizedWithCurrentItem="True"

• Other bindings on same source will follow master

WPF Interop with Windows Forms

• How do I get from here to there?– Do I rewrite everything?– Too much code to rewrite– Existing plug-ins– Existing controls– Existing documents

WPF Interop with Windows Forms

• How do I get from here to there?– Do I rewrite everything?– Too much code to rewrite– Existing plug-ins– Existing controls– Existing documents

Using existing code with WPF

• Package into a control

• Use control inside WPF Content

• Look and feel issues

Mixed Applictaion Considerations

• Lower Initial Cost

• Potential higher TCO

• ”Airspace”

”Airspace”

• One Pixel One Technology

WPF

File Edit View Help

Win32

DirectX

WPF

File Edit View Help

Win32

DirectX

”Airspace”

• One Pixel One TechnologyFile Edit View Help

Win32

DirectX

WPF

File Edit View Help

Win32

WPF

DirectX

Interop best practices

Canvas

Chrome

Show me the Code

private void WindowLoaded(object sender, EventArgs e)

{ WindowsFormsHost host = new WindowsFormsHost(); host.Height = new Length(120); host.Width = new Length(150); swf.Control child = new UserControl1(); child.Dock = swf.DockStyle.None; host.AddChild(child); border.Child = host;}

WPF/e

• Subset of XAML focused on interactive content

• WPF/E provides execution environments for the XAML subset– Browsers: IE, Firefox, Safaric, Netscape,

others... • Supported trough browser plug-ins

– OS: W2K, XP, Vista and MAC OsX– Devices: Windows Mobile, etc

WPF/E Architecture

Increased developer productivity

• Integrated Platform for UI, Text, and Media• Declarative Programming (XAML)• Brings Designers Into the Application• Development Process

– Tools for Designers: Microsoft Expression– Tools for Developers: Visual Studio– 3rd Party Support: Mobiform, Electric Rain

WPF/E Programming model

• XAML and JavaScript in a web page– Access "WPF/E" via JavaScript– Support inline and external XAML/script

• XAML and .NET Framework code– "WPF/E" hosts a x-platform .NET runtime

• Code (C#) is compiled into an intermediate language (IL)• IL is run in a secure and “managed” environment

– "WPF/E" loads external package containing IL and XAML

External package

<html>

<body>

<object/embed id=“wpfehost” size=“…”>

<param name=“source” value=“default.wpfe”/>

<param name=“startuppage” value=“default.xaml”/>

</…>

</body>

</html>

default.wpfe contains:- default.xaml (compressed)- It may also contain:

- Other XAML files- XAML and script files-Resources (images, media, fonts, others)

Programming model

sample.xaml:

<Page Name=“p1”>

<Button Name=“b1”>Turn Red</Button>

</Page>

sample.cs (becomes sample.il):

b1.Click += new EventHandler(Button1_Click);

void Button1_Click(object sender, EventArgs e) {

p1.Background = Brushes.Red;

}