SlideShare a Scribd company logo
1 of 15
Download to read offline
XAML Expertise
Top XAML-Tipps aus den letzten fünf Jahren
Gregor Biswanger | Freier Dozent, Berater, Trainer und Autor
about.me/gregor.biswanger
Über mich
 Freier Dozent, Berater und Trainer
 Schwerpunkte Softwarearchitektur, XAML, Web
und Cross-Plattform Entwicklung
 Technologieberater für die Intel Developer Zone
 Sprecher auf Konferenzen und User Groups
 Freier Autor für heise.de, dotnetpro,
WindowsDeveloper und viele weitere
Fachmagazine
 Video-Trainer bei video2brain und MicrosoftGregor Biswanger
Microsoft MVP, Intel Black Belt &
Intel Software Innovator
cross-platform-blog.de
about.me/gregor.biswanger
Wie alles begann… Silverlight Expertise!
 Erste Ausgabe beim dot.net-Magazin
am 4. März 2010
 Silverlight How-To´s für Einsteiger
und fortgeschrittene Entwickler
Bye bye Silverlight Expertise… Willkommen XAML Expertise!
 Am 6. Juni 2012 war die
Geburtsstunde von XAML Expertise
 How-To´s für WPF und Silverlight for
Windows Phone
 Heute auch für Universal Windows
Apps und allgemein zu XAML
 Insgesamt sind es bereits über
180 Top-Tipps
 Einige werden regelmäßig auf
Entwickler.de veröffentlicht
Data Binding auf Events mit Behaviors
 Das ICommand Binding hat einen
Memory-Leak
 Zusätzlicher Aufwand und Rauschen bei
der Implementierung vom ICommand
 Man möchte auf unterschiedliche Events
reagieren
 Die Lösung: Expression Blend Behaviors
Automatische INotifyPropertyChanged Implementierung mit Fody
 Das INotifyPropertyChanged sorgt
immer für unnötigen Aufwand
 Lösung: Aspektorientierte
Programmierung
 Open-Source-Projekt
PropertyChanged.Fody
 Oder PostSharp
Bessere MVVM-Struktur mit View Model Tuck Away
 Kostenlose Visual Studio Erweiterung
 Für VS2013 und VS2015
 https://visualstudiogallery.msdn.microsoft.com/cbe8ae32-555e-
4e10-91b9-ee0d57bab037
 https://visualstudiogallery.msdn.microsoft.com/5c6cde68-1a38-
4646-b851-29675996f9a7
 Verknüpft ViewModel und View zu einer
Datei (Code-Behinde-Like)
 Wichtig! Der Name der XAML-Datei muss
mit View enden und das ViewModel mit der
Endung ViewModel
 Anschließend wird im Menü unter Tools >
ViewModel Tuck Away geklickt
Aus einem ViewModel eine Oberfläche generieren mit den
XAML Power Toys
 Kostenlose Erweiterung
 https://visualstudiogallery.msdn.microsoft.
com/2abb43bb-350b-4f2c-bc0f-
a8262a0094d3?SRC=VSIDE
 Dieses ermöglicht durch einen Wizard
das Generieren von Oberflächen anhand
von ViewModels oder Datenklassen
 Mit einem Rechtsklick im XAML-Editor,
können die XAML Power Toys im
Kontextmenü ganz unten gestartet
werden
Projektcode deaktivieren und XAML Designer Probleme vermeiden
 Einer der häufigsten Fehler bei XAML-Projekten
ist, dass Logik im Konstruktor vom ViewModel
ausgeführt wird
 Bisherige Lösung:
 DesignerProperties.GetIsInDesignMode(this))
(WPF)
 if(Windows.ApplicationModel.DesignMode.Desig
nModeEnabled) (Universal-Apps)
 Weitere Lösungen:
 Im Menü unter Tools | Options | XAML Designer die
Checkbox Run project code in the XAML Designer
deselektieren
 Oder direkt beim XAML-Designer
XAML Editor ohne Designer öffnen
 Designer beansprucht viel Performance
 Irrelevante wenn man regelmäßig direkt
im XAML-Code arbeitet
 Lösung: Direkt in den Optionen
deaktivieren ;)
 Tools > Options > Text Editor > XAML >
Miscellaneous > ‚Always open
documents in full XAML view‘
Produktiver entwickeln mit vsXEN
 Kostenlose Erweiterung
 https://visualstudiogallery.msdn.micros
oft.com/4ccf48f8-a305-4970-a363-
386ed5eb4ea5
 Emmet für XAML
 Direkt im XAML-Editor „btn“
eingeben und durch drücken der Tab-
Taste wird daraus ein Button-Element
implementiert
XAML-Code Formatieren mit Magie
 Best Practices Design Guide-Lines für die XAML-
Struktur:
1. x:Name sollte immer an erster Stelle stehen.
2. Attribute sollen je nach Priorität in eigenständige Zeilen
untereinander stehen
3. Zusammenhängende Attribute wie Height und Width,
oder HorizontalAlignment und VerticalAlignment,
gehören immer gruppiert zusammen
 Genau diese Magie macht eine Visual Studio
Extension namens XAML Magic
 https://visualstudiogallery.msdn.microsoft.com/0d682c2
e-3c5e-4f0e-8b54-d37ecb25eb7e
 XAML Magic startet man mit einem Rechtsklick im
XAML-Editor, im Kontextmenü an erster Stelle
SpeedObservableCollection
 Jede Änderung löst ein PropertyChanged-Event aus
 Unschön beim befüllen von großen Collections
 Lösung: Eigene Implementierung der ObservableCollection
 https://entwickler.de/online/ui-elemente-der-mausposition-
finden-speed-observablecollection-wp7-app-als-trial-anbieten-
teil-2-154285.html
FRAGEN?
http://about.me/Gregor.Biswanger
Ich freue mich auf Feedback!
Vielen Dank!

More Related Content

More from Gregor Biswanger

Kuck mal, Node.js! Einstieg für .NET Entwickler mit Visual Studio Code und Ty...
Kuck mal, Node.js! Einstieg für .NET Entwickler mit Visual Studio Code und Ty...Kuck mal, Node.js! Einstieg für .NET Entwickler mit Visual Studio Code und Ty...
Kuck mal, Node.js! Einstieg für .NET Entwickler mit Visual Studio Code und Ty...Gregor Biswanger
 
Aber schnell! Top HTML5 Performance Tipps für Hybrid- und Web-Apps
Aber schnell! Top HTML5 Performance Tipps für Hybrid- und Web-AppsAber schnell! Top HTML5 Performance Tipps für Hybrid- und Web-Apps
Aber schnell! Top HTML5 Performance Tipps für Hybrid- und Web-AppsGregor Biswanger
 
Roadshow: Einstieg in die Hybrid-App Entwicklung mit dem Intel XDK und Apache...
Roadshow: Einstieg in die Hybrid-App Entwicklung mit dem Intel XDK und Apache...Roadshow: Einstieg in die Hybrid-App Entwicklung mit dem Intel XDK und Apache...
Roadshow: Einstieg in die Hybrid-App Entwicklung mit dem Intel XDK und Apache...Gregor Biswanger
 
Clevere Tipps zum Thema Facebook Posts
Clevere Tipps zum Thema Facebook PostsClevere Tipps zum Thema Facebook Posts
Clevere Tipps zum Thema Facebook PostsGregor Biswanger
 
Responsive Webdesign mit Bootstrap
Responsive Webdesign mit BootstrapResponsive Webdesign mit Bootstrap
Responsive Webdesign mit BootstrapGregor Biswanger
 
Intel XDK: Cross-Plattform Entwicklung – Apps Entwickeln für alle Plattformen...
Intel XDK: Cross-Plattform Entwicklung – Apps Entwickeln für alle Plattformen...Intel XDK: Cross-Plattform Entwicklung – Apps Entwickeln für alle Plattformen...
Intel XDK: Cross-Plattform Entwicklung – Apps Entwickeln für alle Plattformen...Gregor Biswanger
 
Multi Touch.Prio.Conference 2009
Multi Touch.Prio.Conference 2009Multi Touch.Prio.Conference 2009
Multi Touch.Prio.Conference 2009Gregor Biswanger
 

More from Gregor Biswanger (7)

Kuck mal, Node.js! Einstieg für .NET Entwickler mit Visual Studio Code und Ty...
Kuck mal, Node.js! Einstieg für .NET Entwickler mit Visual Studio Code und Ty...Kuck mal, Node.js! Einstieg für .NET Entwickler mit Visual Studio Code und Ty...
Kuck mal, Node.js! Einstieg für .NET Entwickler mit Visual Studio Code und Ty...
 
Aber schnell! Top HTML5 Performance Tipps für Hybrid- und Web-Apps
Aber schnell! Top HTML5 Performance Tipps für Hybrid- und Web-AppsAber schnell! Top HTML5 Performance Tipps für Hybrid- und Web-Apps
Aber schnell! Top HTML5 Performance Tipps für Hybrid- und Web-Apps
 
Roadshow: Einstieg in die Hybrid-App Entwicklung mit dem Intel XDK und Apache...
Roadshow: Einstieg in die Hybrid-App Entwicklung mit dem Intel XDK und Apache...Roadshow: Einstieg in die Hybrid-App Entwicklung mit dem Intel XDK und Apache...
Roadshow: Einstieg in die Hybrid-App Entwicklung mit dem Intel XDK und Apache...
 
Clevere Tipps zum Thema Facebook Posts
Clevere Tipps zum Thema Facebook PostsClevere Tipps zum Thema Facebook Posts
Clevere Tipps zum Thema Facebook Posts
 
Responsive Webdesign mit Bootstrap
Responsive Webdesign mit BootstrapResponsive Webdesign mit Bootstrap
Responsive Webdesign mit Bootstrap
 
Intel XDK: Cross-Plattform Entwicklung – Apps Entwickeln für alle Plattformen...
Intel XDK: Cross-Plattform Entwicklung – Apps Entwickeln für alle Plattformen...Intel XDK: Cross-Plattform Entwicklung – Apps Entwickeln für alle Plattformen...
Intel XDK: Cross-Plattform Entwicklung – Apps Entwickeln für alle Plattformen...
 
Multi Touch.Prio.Conference 2009
Multi Touch.Prio.Conference 2009Multi Touch.Prio.Conference 2009
Multi Touch.Prio.Conference 2009
 

XAML Expertise – Top-XAML-Tipps aus den letzten fünf Jahren

  • 1. XAML Expertise Top XAML-Tipps aus den letzten fünf Jahren Gregor Biswanger | Freier Dozent, Berater, Trainer und Autor about.me/gregor.biswanger
  • 2. Über mich  Freier Dozent, Berater und Trainer  Schwerpunkte Softwarearchitektur, XAML, Web und Cross-Plattform Entwicklung  Technologieberater für die Intel Developer Zone  Sprecher auf Konferenzen und User Groups  Freier Autor für heise.de, dotnetpro, WindowsDeveloper und viele weitere Fachmagazine  Video-Trainer bei video2brain und MicrosoftGregor Biswanger Microsoft MVP, Intel Black Belt & Intel Software Innovator cross-platform-blog.de about.me/gregor.biswanger
  • 3. Wie alles begann… Silverlight Expertise!  Erste Ausgabe beim dot.net-Magazin am 4. März 2010  Silverlight How-To´s für Einsteiger und fortgeschrittene Entwickler
  • 4. Bye bye Silverlight Expertise… Willkommen XAML Expertise!  Am 6. Juni 2012 war die Geburtsstunde von XAML Expertise  How-To´s für WPF und Silverlight for Windows Phone  Heute auch für Universal Windows Apps und allgemein zu XAML  Insgesamt sind es bereits über 180 Top-Tipps  Einige werden regelmäßig auf Entwickler.de veröffentlicht
  • 5. Data Binding auf Events mit Behaviors  Das ICommand Binding hat einen Memory-Leak  Zusätzlicher Aufwand und Rauschen bei der Implementierung vom ICommand  Man möchte auf unterschiedliche Events reagieren  Die Lösung: Expression Blend Behaviors
  • 6. Automatische INotifyPropertyChanged Implementierung mit Fody  Das INotifyPropertyChanged sorgt immer für unnötigen Aufwand  Lösung: Aspektorientierte Programmierung  Open-Source-Projekt PropertyChanged.Fody  Oder PostSharp
  • 7. Bessere MVVM-Struktur mit View Model Tuck Away  Kostenlose Visual Studio Erweiterung  Für VS2013 und VS2015  https://visualstudiogallery.msdn.microsoft.com/cbe8ae32-555e- 4e10-91b9-ee0d57bab037  https://visualstudiogallery.msdn.microsoft.com/5c6cde68-1a38- 4646-b851-29675996f9a7  Verknüpft ViewModel und View zu einer Datei (Code-Behinde-Like)  Wichtig! Der Name der XAML-Datei muss mit View enden und das ViewModel mit der Endung ViewModel  Anschließend wird im Menü unter Tools > ViewModel Tuck Away geklickt
  • 8. Aus einem ViewModel eine Oberfläche generieren mit den XAML Power Toys  Kostenlose Erweiterung  https://visualstudiogallery.msdn.microsoft. com/2abb43bb-350b-4f2c-bc0f- a8262a0094d3?SRC=VSIDE  Dieses ermöglicht durch einen Wizard das Generieren von Oberflächen anhand von ViewModels oder Datenklassen  Mit einem Rechtsklick im XAML-Editor, können die XAML Power Toys im Kontextmenü ganz unten gestartet werden
  • 9. Projektcode deaktivieren und XAML Designer Probleme vermeiden  Einer der häufigsten Fehler bei XAML-Projekten ist, dass Logik im Konstruktor vom ViewModel ausgeführt wird  Bisherige Lösung:  DesignerProperties.GetIsInDesignMode(this)) (WPF)  if(Windows.ApplicationModel.DesignMode.Desig nModeEnabled) (Universal-Apps)  Weitere Lösungen:  Im Menü unter Tools | Options | XAML Designer die Checkbox Run project code in the XAML Designer deselektieren  Oder direkt beim XAML-Designer
  • 10. XAML Editor ohne Designer öffnen  Designer beansprucht viel Performance  Irrelevante wenn man regelmäßig direkt im XAML-Code arbeitet  Lösung: Direkt in den Optionen deaktivieren ;)  Tools > Options > Text Editor > XAML > Miscellaneous > ‚Always open documents in full XAML view‘
  • 11. Produktiver entwickeln mit vsXEN  Kostenlose Erweiterung  https://visualstudiogallery.msdn.micros oft.com/4ccf48f8-a305-4970-a363- 386ed5eb4ea5  Emmet für XAML  Direkt im XAML-Editor „btn“ eingeben und durch drücken der Tab- Taste wird daraus ein Button-Element implementiert
  • 12. XAML-Code Formatieren mit Magie  Best Practices Design Guide-Lines für die XAML- Struktur: 1. x:Name sollte immer an erster Stelle stehen. 2. Attribute sollen je nach Priorität in eigenständige Zeilen untereinander stehen 3. Zusammenhängende Attribute wie Height und Width, oder HorizontalAlignment und VerticalAlignment, gehören immer gruppiert zusammen  Genau diese Magie macht eine Visual Studio Extension namens XAML Magic  https://visualstudiogallery.msdn.microsoft.com/0d682c2 e-3c5e-4f0e-8b54-d37ecb25eb7e  XAML Magic startet man mit einem Rechtsklick im XAML-Editor, im Kontextmenü an erster Stelle
  • 13. SpeedObservableCollection  Jede Änderung löst ein PropertyChanged-Event aus  Unschön beim befüllen von großen Collections  Lösung: Eigene Implementierung der ObservableCollection  https://entwickler.de/online/ui-elemente-der-mausposition- finden-speed-observablecollection-wp7-app-als-trial-anbieten- teil-2-154285.html