C# für Einsteiger - edenmarket.de · C# f ü r Quereinsteiger ©eden market GmbH Max-Brod-Weg 14 D -70437 Stuttgart Fon: +49 (0) 711 990 16 -50 Fax: -99 3 Einleitung

1

C# für EinsteigerModul 10: Oberflächen mit WPF

© 2009 eden market

Autor: Anton Kölbl

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

© eden market GmbH � Max-Brod-Weg 14 � D - 70437 Stuttgart

Fon: +49 (0) 711 990 16 -50 � Fax: -99 � www.edenmarket.de

2

Gliederung

1. Einleitung

2. XAML

3. Grafik

4. Databinding

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



3

Einleitung

Die Windows Presentation Foundation WPF sindwichtig(st)er Bestandteil von .NET 3.0; früher waren die Bezeichnungen Avalon und WinFX gebräuchlich.

Sie stellen ein API für anspruchsvolle Benutzeroberflächenzur Verfügung. Möglich sind z.B.

• 3D-Darstellungen

• Abspielen von Videos (mit Windows Media Player 10)

• Datenbindung

• Animationen

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



4

Einleitung

Nur noch Betriebssysteme ab XP werden unterstützt.

Technisch wird Ballast abgeworfen:

• Kein Aufsatz auf Windows SDK wie Windows.Forms

• Komponenten werden direkt über WPF gezeichnet

• Layout wird in XML definiert

• Weitergehende Verwendung von Ressourcen

• Grafik auf Vektorbasis unabhängig von Auflösung

• WPF/E (“Everywhere”) durch Silverlight auch für Browser

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



5

Einleitung

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



6

Einleitung

Längere Zeit werden die Windows.Forms und WPF parallel existieren. WPF sollte v.a. für sehr anspruchsvolle(Multimedia-)Oberflächen eingesetzt werden.

Grafik kann dann separat vom Code durch Designer entworfen werden.

Hierzu neue Expression-Produktreihe von Microsoft.

Speziell Expression Blend für XAML.

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



7

Einleitung

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



8

Einleitung

Für die Entwicklung gibt es drei Varianten:

• Code

• XAML

• XAML+Code

Ab einer gewissen Projektgröße ist nur noch die dritteVariante sinnvoll.

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



9

Einleitung

Vorgehensweise nur mit Code:

• Projekttyp WPF Application, .xaml-Dateien löschen

• Klasse von System.Windows.Window ableiten

class Window1: Window {

public Window1()

{ Title = "Ein erstes Fenster";

Width = 200; Height = 100;

}

[STAThread()]

public static void Main()

{ new Application().Run(new Window1()); }

}

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



10

Einleitung

Vorgehensweise nur mit XAML:

• selber Projekttyp, .cs-Dateien löschen

• jetzt Informationen in 2 XML-Dateien

<WindowWindowWindowWindow x:Class="WpfApplicationXaml.Window1"

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

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

Title="Fenster aus XAML" Height="300" Width="300" />

<ApplicationApplicationApplicationApplication x:Class="WpfApplicationXaml.App"



StartupUri="Window1.xaml"StartupUri="Window1.xaml"StartupUri="Window1.xaml"StartupUri="Window1.xaml" />

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



11

Einleitung

Vorgehensweise Code und XAML gemischt:

• Projekttyp WPF Application

• erzeugt– C# für Logik (Code-behind)

– XAML für UI

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



12

Gliederung

1. Einleitung

2. XAML

3. Grafik

4. Databinding

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



13

XAML

XAML ist ein neuer XML-Dialekt

Ziel:

• Trennung von Logik und UI

• UI wird von Designer erzeugt

• XAML kann von Tools generiert werden

• dann z.B. Import in Visual Studio

Zwei Namensräume werden benötigt:xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



14

XAML

XAML definiert den Inhalteines Fensters:

Container gruppierenmehrere Komponenten

<Window>

<StackPanel>

<Button Content="Click Me"/>

</StackPanel>

</Window>

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



15

XAML

Events können beim Button direkt durch Doppelclickerzeugt werden.

Methode wird in Code-behind-Klasse erzeugt:

private void Button_Click(object sender, RoutedEventArgs e)

{

MessageBox.Show("Test");

}

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



16

XAML

Properties und Events können oft direkt als XML-Attribute angegeben werden; dies ist aber nur bei Strings möglich.

<Button Content="Click Me" ClickClickClickClick="Button_Click" />

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



17

XAML

Eine alternative Syntax mit Unterelementen ist immermöglich.

<Button>

<Button.BackgroundButton.BackgroundButton.BackgroundButton.Background><SolidColorBrush Color="Blue"/> </Button.Background> <Button.ForegroundButton.ForegroundButton.ForegroundButton.Foreground> <SolidColorBrush Color="Red"/> </Button.Foreground> <Button.ContentButton.ContentButton.ContentButton.Content> This is a button </Button.Content>

</Button>

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



18

XAML

Manche komplexen Werte können über TypeConverterautomatisch umgewandelt werden. Folgende Variantensind äquivalent:

<Button Margin="10,20,10,30" Content="Hallo"/>

<Button Content="Hallo">

<Button.Margin>

<Thickness Left="10" Top="20" Right="10" Bottom="30"/> </Button.Margin>

</Button>

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



19

Übung 10, Aufgabe 1

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



20

XAML

Properties stammen oft von (evt. abstrakten) Basisklassen, deshalb ist normale XML-Validierung mitXAML nicht möglich -> spezielle Tools notwendig

Einige Properties können an alle Komponentenangehängt werden -> Elternelemente werden nichtüberfrachtet

<DockPanel>

<Button DockPanel.DockDockPanel.DockDockPanel.DockDockPanel.Dock="Left" Width="100" Height="20">left</Button>

<Button DockPanel.DockDockPanel.DockDockPanel.DockDockPanel.Dock="Right" Width="100" Height="20">right</Button>

</DockPanel>

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



21

XAML

XAML kann zur Laufzeit geschrieben und auch in die laufende Anwendung eingelesen werden:

Button origianlButton = ...

string savedButton = XamlWriter.SaveXamlWriter.SaveXamlWriter.SaveXamlWriter.Save(origianlButton);

StringReader stringReader = new StringReader(savedButton);

XmlReader xmlReader = XmlReader.Create(stringReader);

Button readerLoadButton = (Button) XamlReader.LoadXamlReader.LoadXamlReader.LoadXamlReader.Load(xmlReader);

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



22

XAML

XAML-Container stammen von der abstrakten KlassePanel in System.Windows.Controls ab.

Kindelemente sind in einer Collection Children untergebracht (muss in XML aber nicht angegebenwerden).

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



23

XAML

Canvas ist ein Container, dessen Kindelemente an den Seiten verankert werden können.

Bei Überdeckungen der Kinder kann man die Property ZIndex definieren.

<CanvasCanvasCanvasCanvas Background="LightSteelBlue">

<TextBlock FontSize="14" Canvas.TopCanvas.TopCanvas.TopCanvas.Top="100" Canvas.LeftCanvas.LeftCanvas.LeftCanvas.Left="10">Sonne</TextBlock>

<TextBlock FontSize="22" Canvas.Top="200" Canvas.Left="75">Mond</TextBlock>

</Canvas>

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



24

XAML

Prinzipiell könnte alles auch immer rein mit Code erreicht werden, ist aber meist umständlicher.

TextBlock txt1 = new TextBlock();

txt1.FontSize = 14;

txt1.Text = "Sonne";

Canvas.SetTop(txt1, 100);

Canvas.SetLeft(txt1, 10);

myCanvas.Children.Add(txt1);

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



25

XAML

Beim StackPanel werden die Kinder nacheinanderangeordnet (standardmäßig vertikal, Property Orientation kontrolliert das).

<StackPanelStackPanelStackPanelStackPanel>

<Border Background="SkyBlue" BorderBrush="Black" BorderThickness="1">

<TextBlock Foreground="Black" FontSize="12">Sonne</TextBlock>

</Border>

<Border Width="400" Background="CadetBlue" BorderBrush="Black" BorderThickness="1">

<TextBlock Foreground="Black" FontSize="14">Mond</TextBlock>

</Border>

...

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



26

XAML

Beim DockPanel werden die Kinder an den 4 Seiten und in der Mitte angeordnet (vgl. BorderLayout in Java).

<DockPanelDockPanelDockPanelDockPanel LastChildFill="True">

<Border Height="25" Background="SkyBlue" BorderBrush="Black" BorderThickness="1" DockPanel.Dock="TopDockPanel.Dock="TopDockPanel.Dock="TopDockPanel.Dock="Top"""">

<TextBlock Foreground="Black">Dock = "Top"</TextBlock>

</Border>

<Border Height="25" Background="SkyBlue" BorderBrush="Black" BorderThickness="1" DockPanel.Dock="TopDockPanel.Dock="TopDockPanel.Dock="TopDockPanel.Dock="Top"""">

<TextBlock Foreground="Black">Dock = "Top"</TextBlock>

</Border>

<Border Height="25" Background="LemonChiffon" BorderBrush="Black" BorderThickness="1" DockPanel.Dock="BottomDockPanel.Dock="BottomDockPanel.Dock="BottomDockPanel.Dock="Bottom""""> <TextBlock Foreground="Black">Dock = "Bottom"</TextBlock>

</Border>

...

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



27

XAML

Beim Grid kann eine Tabellenstruktur definiert werden.

<GridGridGridGrid VerticalAlignment="Top" HorizontalAlignment="Left" ShowGridLines="True" Width="250" Height="100"> <Grid.ColumnDefinitionsGrid.ColumnDefinitionsGrid.ColumnDefinitionsGrid.ColumnDefinitions>

<ColumnDefinition /> <ColumnDefinition /> <ColumnDefinition />

</Grid.ColumnDefinitions>

<Grid.RowDefinitionsGrid.RowDefinitionsGrid.RowDefinitionsGrid.RowDefinitions>

<RowDefinition /> <RowDefinition /> <RowDefinition /> <RowDefinition />

</Grid.RowDefinitions>

<TextBlock FontSize="20" FontWeight="Bold" Grid.ColumnSpanGrid.ColumnSpanGrid.ColumnSpanGrid.ColumnSpan="3" Grid.RowGrid.RowGrid.RowGrid.Row="0">2005 Products Shipped</TextBlock> <TextBlock FontSize="12" FontWeight="Bold" Grid.Row="1" Grid.Column="0">Quarter 1</TextBlock>

<TextBlock FontSize="12" FontWeight="Bold" Grid.Row="1" Grid.Column="1">Quarter 2</TextBlock>

<TextBlock FontSize="12" FontWeight="Bold" Grid.Row="1" Grid.Column="2">Quarter 3</TextBlock>

<TextBlock Grid.Row="2" Grid.Column="0">50000</TextBlock>

...

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



28

XAML

Im Container können die Komponenten plaziert werden. Sie erben von Control viele Eigenschaften:

• Background, Foreground

• Height, Width

• Name

• FontFamily, FontSize, FontStyle

• Cursor, Tooltip

• Margin, Padding

• Opacity, Visibility …

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



29

XAML

Standardkomponenten sind z.B.

• Label, TextBox, PasswordBox

• Button, CheckBox, RadioButton

• Menu, MenuItem

• ListBox, ComboBox

• ScrollBar, ScrollViewer

<StackPanel>

<RadioButton GroupName="colorgrp">Red</RadioButton>

<RadioButton GroupName="colorgrp">Blue</RadioButton>

<RadioButton GroupName="numgrp">1</RadioButton>

<RadioButton GroupName="numgrp">2</RadioButton>

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



30

XAML

Zusatzkomponenten sind z.B.

• ViewBox für Skalierungen

• Border

• BulletDecorator

• GroupBox

• Expander zum Auf- und Zuklappen

• Image, MediaElement

• Popup

• ProgressBar, StatusBar, ToolBar

• ToolTip

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



31

Gliederung

1. Einleitung

2. XAML

3. Grafik

4. Databinding

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



32

Grafik

Es gibt herausragende Fähigkeiten in den Bereichen

• 2D

• Bildbearbeitung

• Textdarstellung

• 3D

• Videos

Diese dürften meistens das entscheidende Kriterium fürden Einsatz von WPF darstellen.

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



33

Grafik

2D-Operationen rechnen in einer geräteunabhängigenEinheit (Device Independent Pixel) der Größe 1/96 Inch.

Auf dem Bildschirm wird das je nach dpi skaliert.

Folgende Grundformen (von Shape abgeleitet)

Line, Rectangle, Ellipse, Polyline, Polygon, Path

Alle können direkt als Komponente verwendet werden(da von UIElement abgeleitet).

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



34

Grafik

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



35

Grafik

Gemeinsame Eigenschaften der 2D-Formen:

• Stroke für den Umriss

• StrokeThickness

• Fill

Canvas ist sehr gut als Container geeignet.

<Canvas Height="300" Width="300">

<Line X1="10" Y1="10" X2="50" Y2="50" StrokeStrokeStrokeStroke="Black" StrokeThicknessStrokeThicknessStrokeThicknessStrokeThickness="4" />

...

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



36

Grafik

Affine Transformationenkönnen angewendetwerden:

<Polyline Points="25,25 0,50 25,75 50,50 25,25 25,0" Stroke="Blue" StrokeThickness="10" Canvas.Left="75" Canvas.Top="50">

<Polyline.RenderTransform>

<RotateTransform CenterX="0" CenterY="0" Angle="22" /> </Polyline.RenderTransform>

</Polyline>

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



37

Grafik

Animationen über Mausevents(Farbe / Durchsichtigkeit ändertsich)

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



38

Grafik

Farbverläufe können als Füllungeingesetzt werden (auch rund)

<Rectangle Width="200" Height="100">

<Rectangle.Fill>

<LinearGradientBrush StartPoint="0,0.5" EndPoint="1,0.5">

<GradientStop Color="Yellow" Offset="0.0" />

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

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

<GradientStop Color="LimeGreen" Offset="1.0" />

</LinearGradientBrush>

</Rectangle.Fill>

</Rectangle>

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



39

Grafik

Bei der Bildbearbeitung stellt schon die StandardklasseImage viele Möglichkeiten bereit. Folgende Formatekönnen angezeigt werden:

• bmp

• gif

• ico

• jpg

• png

• tiff

• wdp (Windows Media Photo)

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



40

Grafik

Ausschnitte können über CroppedBitmap gewähltwerden:

<Image Width="200" Grid.Column="0" Grid.Row="3" Margin="5"> <Image.Source>

<CroppedBitmap Source="{StaticResource croppedImage}" SourceRect="30 0 75 50"/>

</Image.Source>

</Image>

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



41

Grafik

Bitmapeffekte

• BlurBitmapEffect

• OuterGlowBitmapEffect

• DropShadowBitmapEffect

<Button Margin="50" Width="200">DropShadow

<Button.BitmapEffectButton.BitmapEffectButton.BitmapEffectButton.BitmapEffect>

<DropShadowBitmapEffectDropShadowBitmapEffectDropShadowBitmapEffectDropShadowBitmapEffect Color="Black"

Direction="320" ShadowDepth="25"

Softness="1" Opacity="0.5"/>

</Button.BitmapEffect>

</Button>

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



42

Grafik

Textverarbeitung: TextBox füreinfachen Text, TextBlock mitInlineCollection für unterschiedlicheFormatierungen.

Beide können als Beschriftungverwendet werden, z.B. für Buttons.

<TextBlock TextBlock TextBlock TextBlock Name="textBlock1" TextWrapping="Wrap">

<Bold>TextBlock</Bold> is designed to be <Italic>lightweight</Italic>,

and is geared specifically at integrating <Italic>small</Italic> portions

of flow content into a UI.

</TextBlock>

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



43

Grafik

Texteffekte sind möglich:

• Rotation

• Unter-, Durch-, Überstreichen

<TextBlock FontSize="36">the lazy brown dog.

<TextBlock.TextDecorations>

<TextDecorationCollection>

<TextDecoration

PenThicknessUnit="FontRecommended">

<TextDecoration.Pen>

<Pen Thickness="1.5">

<Pen.Brush> ...

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



44

Grafik

Für größere Dokumente:

• FixedDocument

• FlowDocument

Jeweils mit Viewerkomponentenz.B. in XPS

<FlowDocument>

<Paragraph FontSize="18">Flow Format Example</Paragraph> ...

<List>

<ListItem>

<Paragraph>ListItem 1</Paragraph> ...

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



45

Grafik

3D-Darstellungen können in ViewPort3D eingebettet werden:

<Canvas Width="321" Height="201">

<Viewport3D ClipToBounds="True" Width="150" Height="150" Canvas.Left="0" Canvas.Top="10">

<Viewport3D.Camera>

<PerspectiveCamera Position="0,0,2" LookDirection="0,0,-1" FieldOfView="60" />

</Viewport3D.Camera>

<Viewport3D.Children> ...

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



46

Grafik

Eine VisualBrush kann als Füllung Videos abspielen(MediaPlayer als Backend).

<TextBlock FontSize="100pt" Text="Some Text" FontWeight="Bold">

<TextBlock.Foreground>

<VisualBrushVisualBrushVisualBrushVisualBrush>

<VisualBrush.Visual>

<MediaElementMediaElementMediaElementMediaElement Source="Video.wmf" />

</VisualBrush.Visual>

</VisualBrush>

</TextBlock.Foreground>

</TextBlock>

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



47

Gliederung

1. Einleitung

2. XAML

3. Grafik

4. Databinding

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



48

Databinding

Woher kommt der Text in einer TextBox oder die Einträge in einer Liste?

Umgekehrt: Wie kommen aktualisierte Werte aus einemTextfeld zurück in Stammdaten?

Bisher: Mühsame gleichbleibende Handarbeit

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



49

Databinding

WPF bietet ein neues Modell an, um UI mit demDatenbestand abzugleichen: Databinding.

In System.Windows.Data gibt es den entscheidendenTyp Binding, der Properties synchronisieren kann.

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



50

Databinding

Beispiel: Beschriftung eines Butttons soll von Textfeldkommen.

Eine mögliche Schreibweise über Attribut:

<StackPanel>

<Button Content="{Binding ElementName=tb, Path=Text}{Binding ElementName=tb, Path=Text}{Binding ElementName=tb, Path=Text}{Binding ElementName=tb, Path=Text}"/>

<TextBlock Name="tb">Ein Test</TextBlock>

</StackPanel>

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



51

Databinding

Beispiel: Beschriftung eines Butttons soll von Textfeldkommen.

Andere mögliche Schreibweise über Kindelement:

<StackPanel>

<Button>

<Binding Binding Binding Binding ElementName="tb" Path="Text" />

</Button>

<TextBlock Name="tb">Ein Test</TextBlock>

</StackPanel>

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



52

Databinding

Modus der Aktualisierung ist über Mode einstellbar:

• Default (vordefiniert, bei TextBoxen TwoWay)

• OneTime (einmal von Quelle zu Ziel)

• OneWay (immer von Quelle zu Ziel)

• OneWayToSource (immer von Ziel zu Quelle)

• TwoWay (immer in beide Richtungen)

<Binding ... ModeModeModeMode="OneWayToSource"/>

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



53

Databinding

Das Ziel wird immer sofort aktualisiert, die Quelle nichtunbedingt. Einstellbar durch UpdateSourceTrigger mitden Werten:

• Default (bei TextBox LostFocus)

• Explicit (Methode UpdateSource() aufrufen)

• LostFocus

• PropertyChanged

<Binding ... UpdateSourceTriggerUpdateSourceTriggerUpdateSourceTriggerUpdateSourceTrigger="LostFocus"/>

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



54

Databinding

Mögliche Quellen für ein Binding:

• XAML-Element (schon betrachtet)

• Objekte aus C#

• Collections

• XML-Daten

• ADO-Datenquellen

<Binding ... UpdateSourceTrigger="LostFocus"/>

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



55

Databinding

Als Beispiel werden normale Objekte betrachtet (andereFälle ähnlich).

Klassen müssen für das Binding erfüllen:

• öffentliche Properties (Felder gehen nicht)

• Defaultkonstruktor

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



56

Databinding

• Interface INotifyPropertyChanged ausSystem.ComponentModel

// in Datenklasse

public String Name {

get { return name; }

set { name = value; OnPropertyChanged("Name") ;}

}

public void OnPropertyChanged(string prop) {

if (PropertyChanged != null)

PropertyChanged(this, new PropertyChangedEventArgs(prop));

}

public event PropertyChangedEventHandler PropertyChanged;

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



57

Databinding

XAML kann im Window auch C#-Namesräumedeklarieren:

<WindowWindowWindowWindow x:Class="DataBinding.Window1"



xmlns:clrxmlns:clrxmlns:clrxmlns:clr="clr-namespace:System;assembly=mscorlib"

xmlns:srcxmlns:srcxmlns:srcxmlns:src="clr-namespace:DataBinding"

Title="Window1" Height="300" Width="300">

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



58

Databinding

Ein Datenobjekt kann von XAML als benannteRessource erzeugt werden.

<Window x:Class="DataBinding.Window1" ... >

<Window.Resources>

<src:Produkt x:Key="p1" Name="Persil"src:Produkt x:Key="p1" Name="Persil"src:Produkt x:Key="p1" Name="Persil"src:Produkt x:Key="p1" Name="Persil" />

</Window.Resources>

...

<Binding Source="{StaticResource p1}{StaticResource p1}{StaticResource p1}{StaticResource p1}" Path="Name" />

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



59

Databinding

Eine benannte Ressource kann auch alsObjectDataProvider erzeugt werden:

<Window x:Class="DataBinding.Window1" ... >

<Window.Resources>

<ObjectDataProvider x:Key="p2" />

</Window.Resources> ...

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



60

Databinding

Im Code kann man nach der Ressource suchen und einObjekt zuweisen:

// z.B. beim Laden

Produkt produkt = ...;

ObjectDataProvider providerObjectDataProvider providerObjectDataProvider providerObjectDataProvider provider = (ObjectDataProvider) FindResource("p2");

provider.ObjectInstance provider.ObjectInstance provider.ObjectInstance provider.ObjectInstance = produkt;

C# f

C# f

C# f

C# f üü üü

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger

r Quereinsteiger



61

Übung 10, Aufgabe 2

Documents

C# für Einsteiger - edenmarket.de · C# f ü r Quereinsteiger ©eden market GmbH Max-Brod-Weg 14 D -70437 Stuttgart Fon: +49 (0) 711 990 16 -50 Fax: -99 3 Einleitung