Christian Moser Software Developer and UX Designer Zühlke Engineering AG

Präsentation zum Thema: "Christian Moser Software Developer and UX Designer Zühlke Engineering AG"—  Präsentation transkript:

1 Christian Moser Software Developer and UX Designer Zühlke Engineering AG http://www.wpftutorial.net

2 Sie kennen die wichtigsten Styling- Konzepte von Silverlight Sie wissen, welches Konzept sich für welche Lösung eignet. Sie können die Konzepte in Ihren Projekten anwenden

3

4

5 Ein übersichtliches Screendesign steigert die Usability Bilder und Farben transportieren Emotionen Markante Farben und Formen schaffen einen Wiedererkennungseffekt Das Nutzungserlebnis wird gesteigert

6

7 Jedes Silverlight Control besitzt eine Liste von Eigenschaften Height, Width, Background, Foreground, FontFamily, FontSize,Content, Margin, Padding,… Die Eigenschaften können direkt am Control überschrieben werden

8 Ohne Styling Mit Styling

9 Ergebnis ist direkt sichtbar Einfaches Konzept Keine Beeinflussung von anderen Elementen Geeignet für Eigenschaften, die nur für ein Control gelten

10 Die XAML Datei wird gross und unübersichtlich Durch die hohe Redundanz wird das Design schlecht wartbar

11

12 Definition Anwendung

13

14 Trennen die grafische Präsentation vom Inhalt Fassen gleiche Eigenschaften zusammen Können auf mehrere Controls angewendet werden Das Design ist besser wartbar

15 Das Aussehen eines Controls kann nicht beliebig verändert werden (z.Bsp. Form) Fehlersuche in komplexen Styles kann aufwändig sein

16 Definition Anwendung

17

18 Sind Objekte, die von mehreren Controls verwendet werden können Ressourcen können an jedes Control angehängt werden Ressourcen werden hierarchisch vererbt Eine Ressource wird durch einen eindeutigen Schlüssel identifiziert

19

20

21 Logik und Präsentation sind getrennt Die Logik definiert die Eigenschaften und das Verhalten Die Präsentation wird durch ein Template definiert Templates bestehen wiederum aus primitiven Controls Jedes Controls hat ein Default Template Das Template kann ersetzt werden

22 Background Content BorderBrush IsEnabled BorderThikness IsFocussed Button Binding

23 Stellt den Inhalt der Content Eigenschaft innerhalb eines ControlTemplates dar

24 Definition Anwendung

25 Disabled Normal MouseOver Pressed Unfocused Focused Common States Focus States Pro Gruppe ist nur ein Zustand aktiv Aktive Zustände werden überlagert

26 Die möglichen Zustände werden durch das Control vorgegeben Das ControlTemplate definiert das Aussehen der verschiedenen Zustände Der VisualStateManager steuert die Zustände und Übergänge

27

28 Definieren das Aussehen eines Items in einer Liste Der DataContext ist auf das dazugehörige Datenobjekt der Liste gesetzt

29 ItemTemplate

30

31 ItemsPanelTemplate

32 http://www.telerik.com/silverlighthttp://www.infragistics.com http://www.componentone.com

33 Inline Styling ist einfach, das Design ist jedoch schlecht wartbar Styles fassen Eingenschaften zusammen und können auf mehrere Controls angewendet werden. ControlTemplates ersetzen das Aussehen eines Controls DataTemplates ersetzen das Aussehen eines Items in einer Liste

34