Vaadin Panel Highlight auf Mouseover

Question

Ich habe eine Reihe von Vaadin's Panels.

Ich muss jede Panel-Komponente auf Mouseover-Ereignis hervorheben und die Hervorhebung bei Mouse-Out freigeben. Auch bei Klick muss ich den Style der Komponente dauerhaft auf einen anderen ändern.

Können Sie bitte ein Beispiel zeigen, wie es in Vaadin gemacht werden kann?

Answer 1

Als André darauf hingewiesen, für die Maus über :hover in Ihrem Stylesheet und legen Sie den Stil mit setStyle("your-special-panel"). Eine Referenz finden Sie unter here. Um den Stil nach dem Klicken zu ändern, fügen Sie zuerst einen ClickListener zum Panel hinzu (addClickListener(..)). In diesem Klick-Listener rufen Sie addStyle("style-class-clicked-panel") auf, die dann auf die Stilklasse in Ihrem Stylesheet für das angeklickte Aussehen verweist.

In Java:

[...] 
@Override 
public void click(ClickEvent event){ 
    // handle the click event 
    panel.addStyle("style-class-clicked-panel"); 
} 

In Css:

.your-special-panel:hover { 
    background-color: red; /* style for on mouse */ 
} 

.style-class-clicked-panel{ 
    background-color: yellow; /* style for clicked */ 
}