einführung in windows presentation foundation

Titel

© Zühlke 2008

Einführung in die WindowsPresentation Foundation

7. Mai 2008

Christian Moser

Folie 1

Christian MoserSoftware Architect and UX Designerwww.wpftutorial.net

Titel

© Zühlke 2008

Grundkonzepte von WPF

7. Mai 2008

Christian Moser

Folie 2

Titel

© Zühlke 2008

Was ist die Windows Presentation Foundation?

• Plattform zur Entwicklung von grafischen Benutzeroberflächen mit Microsoft .NET

• Nachfolger von Windows Forms

• Teil von .NET 3.0 oder höher

7. Mai 2008

Christian Moser

Folie 3

.NET 3.5

.NET 3.0

.NET 2.0

WindowsPresentationFoundation

WindowsCommunication

Foundation

WindowsWorkflow

Foundation

WindowsCard Space

LINQ ASP.NET 3.5 Add-in Framework Other Enhancements

Titel

© Zühlke 2008

Ziel von WPF: Vereinheitlichung verschiedener APIs

7. Mai 2008

Christian Moser

Folie 4

FormulareWinForms

2D GrafikGDI+

3D GrafikDirect 3D

ReportingCrystal Reports

MultimediaDirectShow

Windows Presentation Foundation

• Einfache Integration

• Konsistenes Programmiermodell

• Durchgängiges Layout

• Weniger Abhängigkeiten zu anderen Frameworks

Titel

© Zühlke 2008

Die Rendering Engine von WPF

• Ist komplett vektorbasiert

• Verwendet im Hintergrund DirectX

• Nutzt Hardwarebeschleunigung moderner GPUs

7. Mai 2008

Christian Moser

Folie 5

C++

.NET

Titel

© Zühlke 2008

Was sind die Minimalanforderungen?

Softwareanforderungen

• Windows XP SP2 oder höher

• .NET Framework 3.0 oder höher

Hardwareanforderungen

• WPF ist grundsätzlich auf jeder Hardware lauffähig

• Die Performance hängt alleine von der Komplexität und der Effekte der Software ab

• Hardwarerendering nur mit modernen GPUs mit DirectX 9 oder höher, sonst Softwarerendering

• Effekte erfordern Softwarerendering unter Windows XP (mit erheblichen Performance einbussen)

7. Mai 2008

Christian Moser

Folie 6

Titel

© Zühlke 2008

XAML

• eXtensible Application Markup Language

• XML basierte Sprache zum instanzieren und initialiseren von Objekten mit hierarchischen Beziehungen

• Wird auch in WCF, WF und Silverlight eingesetzt

7. Mai 2008

Christian Moser

Folie 7

<Window xmlns="http://schemas.microsoft.com/winfx/...">

<StackPanel HorizonalAlignment="Center" >

<Image Source="Images/hello.jpg" Height="80" />

<TextBlock Text="Welcome to WPF!" FontSize="14"/>

<Button Content="OK" Padding="10,4" />

</StackPanel>

</Window>

Titel

© Zühlke 2008

XAML vs. Code

• Alles was in XAML gemacht werden kann, kann auch in Code gemacht werden

• XML-Prefixes entsprechen CLR-Namespaces

• XML-Tags entsprechen Objekten (mit default Konstruktor)

• XML-Attribute entsprechen Properties

7. Mai 2008

Christian Moser

Folie 8

<StackPanel>

<TextBlock Margin="20">Hello</TextBlock>

</StackPanel>

StackPanel stackPanel = new StackPanel();

TextBlock textBlock = new TextBlock();

textBlock.Margin = new Thickness(10);

textBlock.Text = "Welcome to WPF";

stackPanel.Children.Add(textBlock);

Titel

© Zühlke 2008

XAML Namespaces

• CLR-Namespaces werden auf XML-Prefixes gemappt

7. Mai 2008

Christian Moser

Folie 9

<Window

xmlns=http://schemas.microsoft.com/winfx/2006/xaml/presentation

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

xmlns:l="clr-namespace:Zuehlke.Presentation.Controls">

<Grid>

<l:MyControl x:Name="myControl" />

</Grid>

</Window>

[assembly:XmlnsDefinition(

"http://xaml.homag.de",

“Homag.App1.UserInterface.Controls")]

Titel

© Zühlke 2008

Property Element Syntax

• Wenn Properties komplexe Inhalte haben, können sie auch als eigene Kind-Elemente ausgeschrieben werden.

7. Mai 2008

Christian Moser

Folie 10

<Rectangle Fill="Red" />

<Rectangle Width="20" Height="20">

<Rectangle.Fill>

<LinearGradientBrush>

<GradientStop Color="Red" Offset="0" />

<GradientStop Color="Blue" Offset="1" />

</LinearGradientBrush>

</Rectangle.Fill>

</Rectangle>

Titel

© Zühlke 2008

Kompilation von XAML

7. Mai 2008

Christian Moser

Folie 11

MainWindow.xaml MainWindow.cs

Assembly

Markup Compiler

C# Compiler

MainWindow.baml MainWindow.g.cs

Resources IL Code

XAML Code Behind

Titel

© Zühlke 2008

Type Converters

• Type Converters sind keine Helferlein, welche die String-Werte der XAML-Attribute in die richtigen Typen konvertieren

• Machen eine sinnvolle Verwendung von XAML überhaupt erst möglich

• Sie werden implizit aufgerufen

7. Mai 2008

Christian Moser

Folie 12

<TextBlock Background="Red" />

Das Property Background ist vom Typ Brush. Der string «Red» wird durch einem TypeConverterautomatisch in einen Brushkonvertiert.

Titel

© Zühlke 2008

Dependency Properties

Grenzen von normalen .NET Properties:

• Ein Button in WPF hat 96 Properties. 90% davon stehen in der Regel auf dem Default Wert. (Unnötiger Speicherverbrauch)

• Der Ursprüngliche Wert geht beim Überschreiben verloren

• Änderungs-Notifikation muss selber nachgebaut werden

• Um einem Typ ein Property hinzuzufügen, muss man ableiten (unflexibel)

• Die Werte werden bei hierarchischen Beziehungen nicht vererbt (FontSize, IsEnabled, IsVisible,...)

7. Mai 2008

Christian Moser

Folie 13

Titel

© Zühlke 2008

Dependency Properties > Funktionsweise

7. Mai 2008

Christian Moser

Folie 14

Button

Dep.Prop. Value

Property Speicher

DependencyObject

GetValue(key)

SetValue(key, value)

double Height

{ get; set; }

Der Button registriertseineProperties

public static readonly DependencyProperty HeightProperty =

DependencyProperty.Register("Height",

typeof(double), typeof(Button),

new FrameworkPropertyMetadata(24.0));

public int Height

{

get { return (double)GetValue(HeightProperty); }

set { SetValue(HeightProperty, value); }

}

HeightProperty 24.0

DockPanel.Dock Left

Titel

© Zühlke 2008

Dependency Properties > Vorteile

• Kein lokaler Member vorhanden

• Nur veränderte Werte belegen Arbeitsspeicher

• Eingebaute Änderungsnotifikation

• Jedes Property hat Metadaten (z.Bsp. Default Wert)

• Werte können vererbt werden

• Der Wert eines Dependency Property wird bei jedemAufruf ( GetValue() ) dynamisch aufgelöst.

• Dadurch können Werte durch Styles, Trigger oderAnimationen temporär “überlagert” werden

7. Mai 2008

Christian Moser

Folie 15

Titel

© Zühlke 2008

Prioritäten bei der dynamischen Wertauflösung

7. Mai 2008

Christian Moser

Folie 16

9. Default Value

8. Inherited Value

7. Default Style Setter

6. Default Style Trigger

5. Custom Style Setter

4. Custom Template Trigger

3. Custom Style Trigger

2. Local Value / Binding Expr.

1. Animation

GetValue()

2. Local Value

SetValue()

Titel

© Zühlke 2008

Attached DependencyProperties

• Attached Properties ermöglichen es einem WPF Control um beliebige Properties zu erweitern

• Keine Ableitung notwendig

• Eröffnet flexible Anwendungszenarien

• Beispiel: «Attachen» von Layout Eigenschaften

7. Mai 2008

Christian Moser

Folie 17

<Canvas>

<Button Canvas.Top="20" Canvas.Left="20"

Content="Button" />

</Canvas>

<DockPanel>

<Button DockPanel.Dock="Left" Content="Button" />

</DockPanel>

Titel

© Zühlke 2008

Logical- und Visualtree

• UI Elemente in WPF haben eine hierarchische Beziehung untereinander

• Diese Beziehungen werden für Rendering, Events, Ressourcen oder Vererbung von Werten verwendet

• Man unterscheidet zwischen dem Logical- und dem Visual-Tree

• Der logical Tree bildet die hierarchie der UI Elemente ab.

• Der visual Tree enthält alle Elemente, die visuell dargestellt werden. (Ein UI Element in WPF besteht wiederum aus mehreren atomaren Elementen) 7. Mai 2008

Christian Moser

Folie 18

Titel

© Zühlke 2008

Logical- und Visual Tree

Visual Tree• Rendern der Elemente

• Hit Testing

• IsEnabled

• Opacity

• Transformation

7. Mai 2008

Christian Moser

Folie 19

Logical Tree• Vererbung von Properties

• Routed Events

• Auflösen von DynamicResources

• ElementName DataBinding

Window

Border

AdornerDecorator

ContentPresenter AdornerLayer

Grid

Label Button

Border

ContentPresenter

TextBlock

Border

ContentPresenter

TextBlock

Titel

© Zühlke 2008

Routed Events

• RoutedEvents werden auf einem WPF Element ausgelöst und traversieren den LogicalTree nach oben und unten

• Es gibt jeweils einen Event mit der RoutingStrategie Bubbling

• Und einen PreviewEvent mit der RoutingStrategie Tunneling

7. Mai 2008

Christian Moser

Folie 20

Window

Grid

Button

Image

Button

TextBlock

Click

PreviewClick

Titel

© Zühlke 2008

Applikationstypen

7. Mai 2008

Christian Moser

Folie 21

Formularbasiert

SeitenbasiertBrowserbasiert

Titel

© Zühlke 2008

Microsoft Silverlight

• «Kleiner Bruder» von WPF.

• 4MByte Browser Plugin

• API ist 99% kompatibel mit .NET und WPF, jedoch nur ein Subset der Funktionen.

• Verfügbar für Windows, Mac und Linux

• Out-of-the-Browser Apps möglich

7. Mai 2008

Christian Moser

Folie 22

Titel

© Zühlke 2008

Wrap-up

• Was sind die grossen Vorteile von WPF?

• Wozu dient XAML?

• Was sind Dependency Properties?

• Wie funktioniert der Logical- und Visualtree

• Wa sind Routed Events?

• Welche Applikationstypen gibt es?

• Was ist der Unterschied zwischen WPF und Silverlight?

7. Mai 2008

Christian Moser

Folie 23

Titel

© Zühlke 2008

Entwicklungswerkzeuge

7. Mai 2008

Christian Moser

Folie 24

Titel

© Zühlke 2008

Visual Studio 2010 für Entwickler

• XAML Editor für Entwickler

• Gute IntelliSense

• Gute Funktionen für Dateanbindung

• Wenig grafische Unterstützung

7. Mai 2008

Christian Moser

Folie 25

Titel

© Zühlke 2008

Expression Blend für Designer

7. Mai 2008

Christian Moser

Folie 26

• XAML Werkzeug für Designer

• Erstellen von WPF Prototypen

• Erstellen von Animationen

• Import von Adobe Photoshop/Illustrator

• Öffnet gleiche Solution wie VisualStudio

• TFS Integration

Titel

© Zühlke 2008

Snoop

• Snoop ist ein nützliches Tool zum Analysieren von Layoutproblemen in WPF

• Kostenloser Download: http://blois.us/Snoop/

7. Mai 2008

Christian Moser

Folie 27

http://blois.us/Snoop/



Titel

© Zühlke 2008

Controls

7. Mai 2008

Christian Moser

Folie 28

Titel

© Zühlke 2008

UserControls vs. CustomControls

• UserControls fassen mehrere Controls zu einer wiederverwendbaren Einheit zusammen (Composition)

• CustomControls erweitern ein bestehendes Control um weitere Funktionen (Extension)

7. Mai 2008

Christian Moser

Folie 29

Titel

© Zühlke 2008

Mitgelieferte Controls

7. Mai 2008

Christian Moser

Folie 30

Titel

© Zühlke 2008

Flexible Komposition

7. Mai 2008

Christian Moser

Folie 31

• Die wichtigste Aufgabe von WPF Elementen ist die Darstellung von Inhalt.

• Inhalt könenn Daten oder andere Elemente sein.

• Dies erlaubt eine sehr flexible Komposition.

• Deutlich weniger UserControls werden benötigt

<Button Content="Hello" />

<Button>

<Button.Content>

<Image Source="winlogo.png" />

</Button.Content>

</Button>

Titel

© Zühlke 2008

Wrap-up

• Wieso braucht es in WPF viel weniger CustomControls als in WinForms?

• Was ist der Unterschied zwischen UserControls und Custom Controls?

7. Mai 2008

Christian Moser

Folie 32

Titel

© Zühlke 2008

Layout

7. Mai 2008

Christian Moser

Folie 33

Titel

© Zühlke 2008

Layout Panels

7. Mai 2008

Christian Moser

Folie 34

Grid Stack Panel Canvas

Wrap Panel Dock Panel

Titel

© Zühlke 2008

Margin, Padding und Alignment

7. Mai 2008

Christian Moser

Folie 35

<Button HorizontalAlignment="Left"

VerticalAlignment="Top"

Margin="8,0,8,8" >

Test

</Button>

Titel

© Zühlke 2008

Best Practices

• Positionieren sie Elemente mit Alignment, Padding und Margin

• Vermeiden sie fixe Grössen für Elemente

• Missbrauchen sie den Canvas Panel nicht für die Platzierung von UI Elementen (WinForms Style)

7. Mai 2008

Christian Moser

Folie 36

Titel

© Zühlke 2008

Transformation

• Jedes Element kann in WPF transformiert werden

• LayoutTransform wirkt sich auf das Layout aus

• RenderTransform wirkt sich nur auf die Darstellung aus

7. Mai 2008

Christian Moser

Folie 37<Button>

<Button.RenderTransform>

<RotateTransform Angle="30" />

</Button.RenderTransform>

</Button>

<Button>

<Button.LayoutTransform>

<RotateTransform Angle="30" />

</Button.LayoutTransform>

</Button>

Titel

© Zühlke 2008

Wrap-up

• Was ist der Unterschied zwischen WPF und WinForms layouting?

• Welche Panels gibt es und was sind ihre Stärken?

• Auf was muss beim Layouten von User Interfaces unter WPF geachted werde?

• Was ist der Unterschied zwischen Layout- und Rendertransform?

7. Mai 2008

Christian Moser

Folie 38

Titel

© Zühlke 2008

Data Binding

7. Mai 2008

Christian Moser

Folie 39

Titel

© Zühlke 2008

Markup Extensions

• Markup Extensions sind eine Art XAML-Makros, welche einen Wert zur Laufzeit auflösen.

• Sie haben folgende Syntax:

• WPF bietet bereits folgende MarkupExtensions an:

• Beispiel: 7. Mai 2008

Christian Moser

Folie 40

<TextBlock Text="{Binding Path=Vorname}" />

{StaticResource} {x:Null}

{DynamicResource} {x:Type}

{Binding} {x:Array}

{RelativeSource} {x:Static}

{TemplateBinding}

{Name Param=Value, Param=Value}

Titel

© Zühlke 2008

Source.NET Property

TargetDependencyProperty

Grundkonzept des Databindings

• DataBinding synchronisiert die Werte zweier Properties miteinander

• Typischerweise wird dadurch ein Wert eines Datenobjektes mit einem UI Element verbunden

• Dies kann uni- oder bidirektional erfolgen

• Ein ValueConverter kann unpassende Datenformate konvertieren

7. Mai 2008

Christian Moser

Folie 41Binding

Converter

INotifyPropertyChanged

Titel

© Zühlke 2008

Datenquellen für Bindings

Andere WPF Elemente{Binding Path=Text, ElementName=textBox}

Übergeordnete WPF Elemente{Binding Path=Text,

RelativeSource={RelativeSource

Mode=FindAncestor,

AncestorType=ListBox}}

DataContext{Binding Path=Text}

Explizite Objekte{Binding Path=Text Source={StaticResource myObject}}

7. Mai 2008

Christian Moser

Folie 42

Titel

© Zühlke 2008

DataContext

• Jedes WPF Element hat ein DataContext Property.

• Dieses wird über den LogicalTree vererbt.

• Ermöglicht das Binding auf ein DatenObjekt

• Die default Source eines {Bindings} ist immer der DataContext.

<Button Content="{Binding Name}" />

DataContext = customer1;

7. Mai 2008

Christian Moser

Folie 43

Titel

© Zühlke 2008

UpdateTrigger und Binding Direction

• Der UpdateSourceTrigger bestimmt, wann das Binding aktualisiert werden soll:

PropertyChanged

LostFocus

Explicit

• Der Mode bestimmt die Richtung, in die der Wert übertragen werden soll

OneWay

TwoWay

OneWayToSource7. Mai 2008

Christian Moser

Folie 44

Titel

© Zühlke 2008

INotifyPropertyChanged

• Jedes Datenobjekt muss das INotifyPropertyChanged Interface implementieren, damit das WPF Binding dieÄnderungen mitbekommt.

7. Mai 2008

Christian Moser

Folie 45

public class Customer : INotifyPropertyChanged

{

private string _name;

public string Name

{

get { return _name; }

set

{

_name = value;

NotifyPropertyChanged("Name");

}

}

public event PropertyChangedEventHandler PropertyChanged;

private void NotifyPropertyChanged( string name)

{

if( PropertyChanged != null )

PropertyChanged(this, new PropertyChangedEventArgs(name));

}

}

Titel

© Zühlke 2008

Value Converter

• ValueConverter können das Datenformat bei einem Binding in beide Richtungen konvertieren

<Button Content="{Binding Name, Converter={h:BoolToVisibilityConverter}}" />

public class BoolToVisibilityConverter : IValueConverter

{

#region IValueConverter Members

public object Convert(object value, Type targetType, object parameter,

CultureInfo culture)

{

return (bool) value ? Visibility.Visible : Visibility.Collapsed;

}

public object ConvertBack(object value, Type targetType, object parameter,

CultureInfo culture)

{

throw new NotImplementedException();

}

#endregion

}

7. Mai 2008

Christian Moser

Folie 46

Titel

© Zühlke 2008

Das Model-View-ViewModel Pattern

• Ein WPF-Pattern zum Anbinden von Daten an die View

• Entstehung:– Das DataBinding von WPF ist wirklich brauchbar– Jedes Element hat einen DataContext– Man möchte oft mehrere Daten-Objekte in einer View anzeigen– Das ViewModel aggregiert diese zu einem Objekt, das dann über

den DataContext zugänglich ist

• Vorteile:– Saubere Trennung von

Präsentation und Logik– UI Logik wird durch

Unit-Tests testbar

7. Mai 2008

Christian Moser

Folie 47

ViewButton

TextBox

ViewModel

DataContext

DataBinding

Titel

© Zühlke 2008

Commands in WPF

• Commands vereinfachen das Binden von Funktionen an das UI

• Ein Command kapselt folgende 3 Funktionen in das ICommand Interface:

Execute(object param);

CanExecute(object param);

event CanExecuteChanged;

• Commands können flexibel an diverse UI Elemente gebunden werden (Button, Menu, KeyboardShortcut)

• IsEnabled des UI Elements wird automatisch gesteuert

7. Mai 2008

Christian Moser

Folie 48

Titel

© Zühlke 2008

Möglichkeit 1 : Vordefinierte Commands von WPF verwendenApplicationCommands Close, Copy,Cut, Delete, Find, Help, New, Open, Paste,

Print, PrintPreview, Properties, Redo, Replace, Save, SaveAs, SelectAll, Stop, Undo

ComponentCommands MoveDown, MoveLeft, MoveRight, MoveUp, ScrollByLine, ScrollPageDown, ScrollPageLeft, ScrollPageRight, ScrollPageUp, SelectToEnd, SelectToHome, SelectToPageDown, SelectToPageUp

MediaCommands ChannelDown, ChannelUp, DecreaseVolume, FastForward, IncreaseVolume, MuteVolume, NextTrack, Pause, Play, PreviousTrack, Record, Rewind, Select, Stop

NavigationCommands BrowseBack, BrowseForward, BrowseHome, BrowseStop, Favorites, FirstPage, GoToPage, LastPage, NextPage, PreviousPage, Refresh, Search, Zoom

EditingCommands AlignCenter, AlignJustify, AlignLeft, AlignRight, CorrectSpellingError, DecreaseFontSize, DecreaseIndentation, EnterLineBreak, EnterParagraphBreak, IgnoreSpellingError, IncreaseFontSize, IncreaseIndentation, MoveDownByLine, MoveDownByPage, MoveDownByParagraph, MoveLeftByCharacter, MoveLeftByWord, MoveRightByCharacter, MoveRightByWord

7. Mai 2008

Christian Moser

Folie 49

Titel

© Zühlke 2008

Möglichkeit 1 : Vordefinierte Commands von WPF verwenden > Beispiel

7. Mai 2008

Christian Moser

Folie 50

<TextBox x:Name="textBox" Width="200" />

<Button Command="Cut"

CommandTarget="{Binding ElementName=textBox}"

Content="Cut" />

<Button Command="Copy"


Content="Copy" />

<Button Command="Paste"


Content="Paste" />

Titel

© Zühlke 2008

Möglichkeit 2:Eigene Commands implementieren

• Selber das ICommand Interface implementieren

<Button Content="Say Hello!" Command="{Binding HelloCommand}" />

public partial class Window1 : Window

{

public ICommand HelloCommand { get; set; }

public Window1()

{

InitializeComponent();

DataContext = this;

HelloCommand = new DelegateCommand {ExecuteDelegate = SayHello};

}

private void SayHello(object parameter)

{

MessageBox.Show("Hello WPF!");

}

}

7. Mai 2008

Christian Moser

Folie 51

Titel

© Zühlke 2008

Universell und nützlich: Der RelayCommand

• Das RelayCommand ist eine generische Implementierung des Command Patternspublic class RelayCommand : ICommand

{

public Action<object> ExecuteDelegate { get; set; }

public Predicate<object> CanExecuteDelegate { get; set; }

#region ICommand Members

public bool CanExecute(object parameter)

{

return CanExecuteDelegate(parameter);

}

public event EventHandler CanExecuteChanged;

public void Execute(object parameter)

{

ExecuteDelegate(parameter);

}

#endregion

}

7. Mai 2008

Christian Moser

Folie 52

Titel

© Zühlke 2008

Finden von DataBinding Problemen

• Im Debug Output werden Databinding Fehler ausgegeben

• Durch den Einsatz eines leeren ValueConverters in dem sie einen Breakpoint setzen können

• Durch das Binden auf ein einfacheres Objekt

7. Mai 2008

Christian Moser

Folie 53

Titel

© Zühlke 2008

Wrap-up

• Wie funktioniert das DataBinding in WPF?

• Wie können unterschiedliche Datenformate gebunden werden?

• Was sind Commands?

• Wozu dient der RelayCommand?

7. Mai 2008

Christian Moser

Folie 54

Titel

© Zühlke 2008

Styles

• Styles sind eine Liste von Werten für Properties, die auf ein WPF Element angewendet werden können

• Sie fassen gleiche Eigenschaften zusammen und machen das Design wartbar

• Ähnlich wie CSS bei HTML

7. Mai 2008

Christian Moser

Folie 56

<Style x:Key="DefaultButtonStyle" TargetType="Button">

<Setter Property="Background" Value="Red" />

<Setter Property="FontSize" Value="12" />

</Style>

<Button Style="{StaticResource DefaultButtonStyle}" />

Titel

© Zühlke 2008

Control Templates

• WPF Controls sind «lookless». Nur das Verhalten ist vorgegeben.

• Ein Default Template ist vorgegeben.

• Das Template kann komplett ersetzt werden

7. Mai 2008

Christian Moser

Folie 57

<ControlTemplate x:Key="SpecialButton" TargetType="Button">

<Grid>

<Ellipse Fill="{TemplateBinding Background}">

</Ellipse>

<ContentPresenter />

</Grid>

</ControlTemplate>

<Button Template="{StaticResource SpecialButton}" />

Titel

© Zühlke 2008

Data Templates

• DataTemplates ermöglichen es in Listen komplexe Daten anzuzeigen.

7. Mai 2008

Christian Moser

Folie 58

<DataTemplate x:Key="EmployeeDataTemplate">

<Grid>

<Grid.ColumnDefinitions>

<ColumnDefinition Width="60"/>

<ColumnDefinition Width="*"/>

</Grid.ColumnDefinitions>

<Border Margin="5" BorderBrush="Black" BorderThickness="1">

<Image Source="{Binding Path=Image}"

Stretch="Fill" Width="50" Height="50" />

</Border> <StackPanel Grid.Column="1" Margin="5">

...

</DataTemplate>

Titel

© Zühlke 2008

Triggers

• Triggers machen Styles und Templates aktiv

• Sie setzen bestimmte Werte, wenn ein Zustand eintritt

• Der Zustand kann durch Properties, Events oder Daten ausgelöst werden

<Style TargetType="Button">

<Setter Property="Background" Value="Red" />

<Style.Triggers>

<Trigger Property="IsMouseOver">

<Setter Property="Background" Value="Green" />

</Trigger>

</Style.Triggers>

</Style>

7. Mai 2008

Christian Moser

Folie 59

Titel

© Zühlke 2008

Ressourcen

• Jedes WPF Element kann beliebig viele Ressourcen verwalten.

• Ressourcen werden über den Logical Tree vererbt.

• Farben, Bilder, Geometrien, Styles, Templates und Schriftgrössen sind typische Ressourcen.

7. Mai 2008

Christian Moser

Folie 60

Window

Grid

Label Button

Application Applikationsweite Ressourcen

Lokale Ressourcen

Titel

© Zühlke 2008

Ressourcen > Beispiel

• Jede Ressource enthält durch das x:Key Attribut einen eindeutigen Schlüssel

• Auf Ressourcen kann mit {StaticResource} oder {DynamicResource} zugegriffen werden

• Ressourcen sollten nach folgendem Schema benannt werden: [Verwendungszweck][RessourceTyp]

7. Mai 2008

Christian Moser

Folie 61

Definition:<Application.Resources>

<SolidColorBrush x:Key="highlightBrush" Color="Red" />

</Application.Resources>

Zugriff:

<TextBlock Foreground="{StaticResource highlightBrush}" />

Titel

© Zühlke 2008

Verwaltung von Ressourcen

• Ressourcen in ein separates Projekt auslagern

• Für jedes Control ein eigenes ResourceDictionary anlegen

• Die ResourceDictionaries zu einem Haupt-Dictionary zusammenmergen

• Das Haupt-Dictionary auf Application Level reinmergen.

• Die Ressourcen nach folgendem Schema benennen:[Verwendungszweck][ResourceTyp]

7. Mai 2008

Christian Moser

Folie 62

Titel

© Zühlke 2008

Wrap-up

• Was sind Styles?

• Was sind ControlTemplates?

• Was sind DataTemplates?

• Was sind Triggers?

• Was sind Ressourcen?

• Wie werden Ressourcen optimal verwaltet?

7. Mai 2008

Christian Moser

Folie 63

Titel

© Zühlke 2008

Integration von WPF in WinForms

• WPF Content kann einfach mit einem ElementHost Control in WinForms integriert werden

7. Mai 2008

Christian Moser

Folie 65

Titel

© Zühlke 2008

Integration von WinForms in WPF

• Windows Forms Controls können mittels WindowsFormsHost in WPF integriert werden

<Window x:Class="WinFormInWPF.Window1"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

xmlns:wf="clr-namespace:System.Windows.Forms;assembly=System.Windows.Forms">

<Grid>

<WindowsFormsHost>

<wf:ListBox x:Name="lstBox"/>

</WindowsFormsHost

</Grid>

</Window>

7. Mai 2008

Christian Moser

Folie 66

Titel

© Zühlke 2008

Model-View-ViewModel Pattern

• Empfohlenes Pattern für die Anbindung von Daten an das UI

• Entkoppelung zwischen Darstellung und Logik

• Reines DataBinding zum Verdrahten von Daten und Commands

• Flexibler Tausch von Controls

• Einfaches Testen mit normalen Unit Tests

7. Mai 2008

Christian Moser

Folie 68

Titel

© Zühlke 2008

Model-View-ViewModel Pattern

7. Mai 2008

Christian Moser

Folie 69

View

ViewModel

DataBinding

Daten Daten Daten

• Das ViewModel fasst alle Daten und Befehle einer View zu einer «Fassade» zusammen

• Die Anbindung an die View erfolgt ausschliesslich über DataBinding

DataContext = viewModel;

Titel

© Zühlke 2008

Lokalisierung

7. Mai 2008

Christian Moser

Folie 70

{h:Translate ResourceKey1}

{h:Translate ResourceKey2}

TranslationManagerstring GetString( string resourceKey)

event LanguageChanged;

Text Ressourcen

Titel

© Zühlke 2008

Touch Enabled Technologies

15.01.2010


Folie 72

Native Touch Support

• Microsoft .NET 4.0 on Windows 7

• Silverlight 3.0

Touch HardwareTouch Hardware

Windows 7Windows XP,Vista

Multitouch Driver

.NET 4.0.NET 3.5

Multitouch ApplicationMultitouch Application

Native Multitouch supportAdditional Driver required

Titel

© Zühlke 2008

Weitere Informationen

Internet: www.wpftutorial.net

7. Mai 2008

Christian Moser

Folie 76

http://www.wpftutorial.net/

einführung in windows presentation foundation

Technology