Seiten

Donnerstag, 4. November 2010

Quick Tipp: MouseOver VisualState für die gesamte Oberfläche eines ListBoxItem

Das Template eines ListBoxItems kennt den VisualState MouseOver. Wenn man den Mauszeiger über ein ListBoxItem bewegt, wird der VisualState MouseOver aber standardmäßig nur dann aktiviert, wenn der Mauszeiger über den sichtbaren Inhalt bewegt wird. Der sichtbare Inhalt wird durch den ContentPresenter des Templates definiert. Das ListBoxItem selbst ist aber in der Regel breiter, als der ContentPresenter bzw. als der Inhalt des ListBoxItems. Dieses Verhalten kann unerwünscht sein.

Nachfolgend beschreibe ich, was man machen muss, damit der VisualState MouseOver immer aktiviert wird, wenn der Mauszeiger über irgendeinen Punkt des ListBoxItems bewegt wird.

Es wird vorausgesetzt, dass irgendwo auf der Oberfläche eines Silverlight 4-Projekts eine ListBox mit mindestens einem ListBoxItem vorhanden ist. Dieses ListBoxItem wird mit einem Linksklick aktiviert. Als nächstes: Rechtsklick -> Vorlage bearbeiten -> Kopie bearbeiten, im Dialogfenster dem neuen Style einen Namen geben, bestätigen und man landet in der Vorlage des ListBoxItems.

Dann wird die Registerkarte "Zustände" selektiert. Für das weitere Vorgehen bitte darauf achten, dass "Basis" aktiviert ist:


Im Objektbaum der Vorlage das Element "fillColor" selektieren:


Dieses Element ist bewirkt visuell die Veränderung im VisualState MouseOver.

Wenn man jetzt im Eigenschaftenpanel einen Blick auf die Eigenschaft "IsHitTestVisible" dieses Elements wirft, so ist diese Eigenschaft standardmäßig nicht aktiviert:



Um den MouseOver VisualState für das gesamte ListBoxItem einzurichten, wird die Eigenschaft "IsHitTestVisible" aktiviert:



... und zack ... fertig ist diese Lösung.

Viel Spass damit.

Keine Kommentare:

Kommentar veröffentlichen