© best_vector/Shutterstock.com
Kolumne: XAML Expertise

Kolumne: XAML Expertise


In der Kolumne „XAML Expertise“ präsentiert Gregor Biswanger Top-How-tos zum Thema XAML. Einsteiger und fortgeschrittene XAML-Experten sollen hier durch geballtes Wissen gesättigt werden. Heute gibt es folgende Expertisen: „WPF: Scroll Synchronization mit dem ScrollSync Behavior“, „WPF: TextBox-Text per Data Binding markieren“ und „UWP: Mehr Performance durch Deferred Loading“. Viel Spaß mit XAML Expertise.

WPF: Scroll Synchronization mit dem ScrollSync Behavior

Sie kennen mit Sicherheit den Vergleichseditor in Visual Studio. Wenn man eine alte mit einer neuen Codedatei vergleichen möchte, wird jeweils links und rechts ein Panel angezeigt. Hier ist das Scrolling zueinander synchron. Wenn Sie das Gleiche mit Inhaltssteuerelementen wie einer ListBox oder einem DataGrid umsetzen möchten, werden Sie schnell überrascht sein, dass es gar nicht so einfach ist wie erwartet. Das liegt daran, dass es kein direktes Scrollevent gibt. Und die richtigen Methoden zum Steuern der Scrollbar fehlen ebenfalls.

Die gesamte Scrollbar-Logik kommt vom ScrollViewer-Steuerelement, das als Kindelement bei der ListBox oder beim DataGrid eingebettet ist. Der Zugriff ist nur über den VisualTreeHelper möglich. Der ScrollViewer bietet passenderweise ein ScrollChanged-Event. Abonniert man es, können die aktuellen Scrollkoordinaten an ein weiteres Steuerelement zugewiesen werden. Auch das funktioniert nur, wenn man auf dessen ScrollViewer zugreift. Hierfür gibt es dann die ScrollToVerticalOffset- und ScrollToHorizontalOffset-Methoden. Wird diese Lösung händisch in die Code-Behind-Datei implementiert, sind nur wenige Zeilen Code nötig (Listing 1).

Listing 1: Eine Scroll-Synchronization-Logik für zwei ListBoxes

public partial class MainWindow : Window { public MainWindow() { InitializeComponent(); Loaded += OnLoaded; } private void OnLoaded(object sender, RoutedEventArgs e) { var scrollViewer = GetScrollViewer(listBoxA); scrollViewer.ScrollChanged += OnScrollChanged; } private ScrollViewer GetScrollViewer(DependencyObject dependencyObject) { var border = VisualTreeHelper.GetChild(dependencyObject, 0); return (ScrollViewer)VisualTreeHelper.GetChild(border, 0); } private void OnScrollChanged(object sender, ScrollChangedEventArgs eventArgs) { var scrollViewer = GetScrollViewer(listBoxB); if (scrollViewer != null) { scrollViewer.ScrollToVerticalOffset(eventArgs.VerticalOffset); scrollViewer.ScrollToHorizontalOffset(eventArgs.HorizontalOffset); } } }

Etwas attraktiver wäre hingegen, wenn diese UI-Logik sauber ausgelagert würde, sodass die Code-Behind-Datei frei von Code wäre und für weitere Projekte wiederverwendet werden könnte. Genau dazu eignet sich das Schreiben eines eigenen WPF Behaviors. Dabei handelt es sich um fertige UI-Funktionalitäten, die als Snippet via Drag-and-drop auf das gewünschte Steuerelement gezogen werden. Blend für VisualStudio bietet Behaviors, wie sie schon seit Expression Blend 4 für WPF und Silverlight bekannt sind. Zum Schreiben eigener Behaviors muss vorher das Behaviors SDK installiert sein. Dazu einfach einen Rechtsklick auf das WPF-Projekt und im Kontextmenü Design in Blend auswählen. In Blend findet man die Behaviors beim Assetsfenster unter dem Punkt Behaviors. Ist das SDK nicht installiert, klicken Sie auf den vorgeschlagenen Link. Anschließend können Sie zum Test ein Behavior aus der Liste auf ein UI-Steuerelement per Drag-and-drop platzieren. So können Sie sicherstellen, dass die beiden wichtigen Assemblies System.Windows.Interactivity und Microsoft.Expression.Interactions schon ei...

Neugierig geworden? Wir haben diese Angebote für dich:

Angebote für Gewinner-Teams

Wir bieten Lizenz-Lösungen für Teams jeder Größe: Finden Sie heraus, welche Lösung am besten zu Ihnen passt.

Das Library-Modell:
IP-Zugang

Das Company-Modell:
Domain-Zugang