WINDOWS PRESENTATION FOUNDATION ( WPF) - Martin Kühn 08.03.2012
←
→
Transkription von Seiteninhalten
Wenn Ihr Browser die Seite nicht korrekt rendert, bitte, lesen Sie den Inhalt der Seite unten
WINDOWS
PRESENTATION FOUNDATION (WPF)
Martin Kühn
08.03.2012
Übersicht • Theorie hinter WPF • Grundlagen von XAML • Dependency Properties • Templates • Vortragsdauer: ca. 30 Minuten
THEORIE HINTER WPF
Theorie hinter WPF • WPF ist ein Framework zur Beschreibung von GUI-Formularen und Grafiken • Ähnlich wie das Qt-Framework oder GTK+ Beispiel-Formular in einer WPF-Anwendung:
Theorie hinter WPF • Formulare lassen sich in der auf XML basierenden Sprache XAML beschreiben
Theorie hinter WPF
• Basiskonzept: Trennung von Präsentationsebene
und Programmierebene
• XAML-Datei beschreibt Formulardaten
• XAML-Datei hat Code-Behind (z.B. in C#) der den
Programmiercode enthält Formularbeschreibung
Code-Behind
Theorie hinter WPF • WPF ist ein mächtiges und umfangreiches Werkzeug zur Erstellung von GUIs für Desktop- und Webanwendungen • Teil des .NET-Frameworks seit Version 3.0 • Verwendbar mit Visual Studio 2010 und Microsoft Expression Blend
Theorie hinter WPF Wie erstelle ich eine WPF-Anwendung?
GRUNDLAGEN VON XAML
Grundlagen von XAML • XAML = Extensible Application Markup Language • Beschreibungssprache für Formulare • Case-sensitive • XML-basierend
Grundlagen von XAML • Jede WPF-Anwendung besteht aus einer App.xaml die den Einstiegspunkt des Programmes darstellt (ähnlich der Main-Methode in Java) • In ihr lassen sich anwendungsweit Ressourcen (Icons, Grafiken, Farben, etc.) festlegen
Grundlagen von XAML • Jedes Formular (also jedes Fenster und jeder Dialog) wird in einer eigenen XAML-Datei definiert
Grundlagen von XAML
Syntax und Sprachaufbau von XAML:
• Tags beschreiben u.a. die GUI-Elemente. Sie werden mit eingeleitet
und mit geschlossen. Zwischen den Tags lässt sich meist der Inhalt
von Elementen definieren:
OK
• Im Anfangstag lassen sich die Properties der Steuerelemente festlegen:
Hallo
• Ist bei manchen Elementen der Inhalt nur über eine Zahl oder einen String
definiert, lässt er sich meistens auch über die Content, Text o.Ä.
Eigenschaft festlegen. Das Tag kann dann selbstschließend mit sein.
Das folgende Beispiel ist äquivalent zum oberen:Alle Properties von Steuerelementen können auch im Visual Studio- Eigenschaftenfenster geändert werden:
Grundlagen von XAML
Standard XAML-Namensräume
Rumpf einer XAML-Datei (xmlns = XML namespace)
Fenstertitel
Minimale und tatsächliche
Größe des Fensters
Das Fenster soll
beim Starten in
der Mitte des
Bildschirms
Ein Grid ist ein Container
Window-Tag definiert ein Fenster platziert werden
in dem Steuerelemente
platziert werden könnenGrundlagen von XAML Übersicht der wichtigsten Steuerelemente Button
Grundlagen von XAML Übersicht der wichtigsten Container Container steuern die Anordnung der Steuerelemente StackPanel Grid DockPanel
Grundlagen von XAML Margin-Eigenschaft von Steuerelementen • Eigenschaft die jedes Steuerelement hat • Sie beschreibt die Entfernung zwischen Element und seinem übergeordnetem Element oder Nachbarelementen • Nützlich um Lücken zwischen die Steuerelemente einzufügen
Grundlagen von XAML
Programmierbeispiel:
Einfache Anwendung, die bei Klick auf einen
Button eine MessageBox ausgibtDEPENDENCY PROPERTIES
Dependency Properties • Mit Dependency Properties können Properties von Steuerelementen an andere Properties gebunden werden • Man kann z.B. eine TextBox mit einem String verbinden oder eine CheckBox mit einem Boolean • Enorme Arbeitserleichterung Beispiel: Binde die IsEnabled Eigenschaft eines Textfeldes an den Zustand einer Checkbox:
Dependency Properties
BeispielprogrammDependency Properties
Definieren in der Code-Behind Datei eine Property
und eine DependencyProperty:
Name der Property
Datentyp der Property
Datentyp des OwnersDependency Properties Der DataContext des Window muss auf sich selbst gesetzt werden, damit bekannt ist worauf sich die folgenden Property-Angaben beziehen.
Dependency Properties
Verbinden im XAML-Code die beiden Steuerelemente:
Name der Property
Bindungsrichtung
Update-TriggerDependency Properties
Bindungsrichtungen:
• OneWay: Daten werden aus der Property in das Steuerelement gelesen
Quelle Ziel
(Property: EnableTextBox) (Property: TextBox.IsEnabled)
• OneWayToSource: Daten aus dem Steuerelement werden in das
Property geschrieben
Quelle Ziel
(Property: EnableTextBox) (Property: CheckBox.IsChecked)
• TwoWay: Daten werden aus dem Property in das Steuerelement
gelesen, aber Änderungen im Steuerelement werden auch in die
Property geschrieben
Quelle ZielDependency Properties
Update-Trigger:
• PropertyChanged: Die Bindungen zu einer Property werden
bei deren Änderung aktualisiert.
(z.B. beim Tippen des Textes in einer TextBox)
• LostFocus: Die Bindung zu einer Property wird aktualisiert,
wenn das Steuerelement den Fokus verliert
(z.B. wenn eine TextBox abgewählt wird)Dependency Properties
BeispielprogrammTEMPLATES
Templates • Manchmal möchte man den Steuerelementen ein individuelles Aussehen verpassen • Oder man möchte ganz neue Steuerelemente erstellen • Templates ermöglichen Anpassung bis ins kleinste Detail • Microsoft Expression Blend sehr nützlich für die Bearbeitung von Templates
Templates Wir wollen im folgenden als Beispiel einen eigenen Button „templaten“, d.h. ihm einen individuellen Look verpassen:
Templates • Templates sind in WPF Ressourcen • Werden in der Window.Resources-Umgebung in einem ResourceDictionary gespeichert
Templates • Legen zunächst eine Farbe für die Umrandung des Buttons fest • Farben werden in WPF als SolidColorBrush (ebenfalls Ressourcen) gespeichert • Die Farbe (hier blau) wird als Hexwert in die Color- Eigenschaft geschrieben
Templates • Hintergrund soll ein Farbverlauf von weiß nach blau sein • Farbverläufe können in WPF als LinearGradientBrush definiert werden • Anfangs- und Endfarbe werden mittels GradientStop definiert
Templates • Button soll seine Optik beim Überfahren mit der Maus (Hover) verändern • Button soll seine Optik beim Klick verändern • Definieren auch hierfür jeweils Farbverläufe
Templates • Setzen nun aus den Farben und Farbverläufen unser ControlTemplate für den Button zusammen (zunächst nur den Standard-Look) • Border definiert eine Fläche mit einer Kontur (BorderBrush) und einem Hintergrund (Background) • Mittels StaticResource lassen sich die vordefinierten Ressourcen abrufen • Das ContentControl definiert das Text-Label im Button
Templates • Legen zu guter Letzt im Template unsere vordefinierten Hintergründe beim Überfahren und Klicken mit der Maus fest • Mittels Trigger lässt sich der Zustand eines Steuerelementes überwachen und ein Ereignis auslösen • Mittels Setter lassen sich im XAML-Code Properties eines Steuerelementes neue Werte zuweisen
Templates
BeispielprogrammABSCHLUSS
Fazit • WPF ist ein mächtiges Tool zur Erstellung von GUIs • XAML zur Beschreibung von Formularen • Dependency Properties und Templating verfügbar Was nützt uns das bei der Spieleprogrammierung? • Ermöglicht es uns individuelle Menüs und Einstellungsdialoge zu erstellen • Hilfreich für die Entwicklung von Tools wie eigene Programmierumgebungen oder z.B. Level-Editoren
Ressourcen • Wikipedia (DE/EN) • http://www.stackoverflow.com • http://www.gowinfx.de/WPF%20Tutorial/kap1.html • http://openbook.galileocomputing.de/visual_csharp_2010/v isual_csharp_2010_17_001.htm • Tutorials zu den einzelnen Steuerelementen sehr leicht bei Google zu finden: „wpf “ + Steuerelementname
DANKE FÜRS ZUHÖREN!
FRAGEN?
Sie können auch lesen
