JavaFX Hover-Effekt bei Button

[ilosch]

Hallo!
Ich habe ein kleines Problem mit meinem Button. Ich habe ihn erstellt und er funktioniert auch. Das Problem liegt jetzt aber eher darin, dass ich einen Hover-Effekt bei MouseOver (also während ich mit der Maus über den Button gehe) haben möchte. Der Button merkt, dass ich mit der Maus drüber gehe, da mir dann sofort Fehlermeldungen angezeigt werden. Aber wie kriege ich diese Fehlermeldungen weg? Wo ist mein Fehler?
Da bräuchte ich Hilfe 🙂



Die border-color ist zurzeit weiss und soll bei mouse over/entered auf die Farbe #00897b wechseln.
Ich würde das gerne ohne CSS lösen nur ist da halt das Problem mit den Fehlermeldungen.

Folgend der Code-Abschnitt um den es sich handelt.
Ich füge noch die ganze Klasse hinzu in der dieses Problem auftretet vielleicht wird es so deutlicher 🙂
Da geht es dann um die Zeilen 57-72.

[CODE lang="java" title="Border Farbwechsel bei MOUSE_ENTERED"]
@FXML
public void handle(MouseEvent e) {
hinzufuegen.addEventHandler(MouseEvent.MOUSE_ENTERED, new EventHandler<MouseEvent>() {
@Override
public void handle(MouseEvent e) {
hinzufuegen.setStyle("-fx-border-color: #00897b");
}
});

loeschen.addEventHandler(MouseEvent.MOUSE_ENTERED, new EventHandler<MouseEvent>() {
@Override
public void handle(MouseEvent e) {
loeschen.setStyle("-fx-border-color: #00897b");
}
});
}[/CODE]

Mit freundlichen Grüßen
Ilosch

 

[lam_tr]

Du addest einen EventHandler in einer Event Methode, das heißt immer wenn du das die handle Mehtode ausführst fügt der für löschen und hinzufügen die Logik neu.

Mach das doch besser in die initialise Methode.

 

[ilosch]

Du addest einen EventHandler in einer Event Methode, das heißt immer wenn du das die handle Mehtode ausführst fügt der für löschen und hinzufügen die Logik neu.

Mach das doch besser in die initialise Methode.

Erstmal Dankeschön 🙂 Ich habe das jetzt ausprobiert aber irgendwie will das nicht so richtig..
Ich habe es anstatt in die Initialize zu packen es außerhalb gelassen, jetzt klappt es. Allerdings ändert die Borde Color jetzt erst seine Farbe, wenn man zum zweiten mal über den Button fährt. Gibt es eine Möglichkeit es so hinzubekommen, dass die Farbe sich schon beim ersten mal ändert?

 

[lam_tr]

Wer ruft diese Methode "handle" auf?

 

[ilosch]

Zurzeit mein Button hinzufügen und der Button loeschen.
Beide greifen auf handle zu.

 

[Thallius]

Kenne FX nicht, aber kann man das nicht einfach in CSS machen?

 

[ilosch]

Kann man schon aber ich würde gerne wissen, wie man das Problem ohne lösen kann. Es funktioniert ja jetzt, nur das er die Farbe erst beim zweiten mal drüber gehen ändert.
Aber danke für alle Antworten!

 

[lam_tr]

Zurzeit mein Button hinzufügen und der Button loeschen.
Beide greifen auf handle zu.

Dann sollte das hier ausreichend sein oder?

@FXML
public void handle(MouseEvent e) {
    hinzufuegen.setStyle("-fx-border-color: #00897b");
    loeschen.setStyle("-fx-border-color: #00897b");
}

 

[lam_tr]

Kenne FX nicht, aber kann man das nicht einfach in CSS machen?

Ich hätte das auch eher in CSS gemacht, einfacher und weniger UI Logik im Quellcode

 

[ilosch]

Dann sollte das hier ausreichend sein oder?

@FXML
public void handle(MouseEvent e) {
    hinzufuegen.setStyle("-fx-border-color: #00897b");
    loeschen.setStyle("-fx-border-color: #00897b");
}

So klappt das auch nur, dass die dann gleichzeitig die Farbe ändern und nicht erst wenn ich drüber gehe.

 

[lam_tr]

So klappt das auch nur, dass die dann gleichzeitig die Farbe ändern und nicht erst wenn ich drüber gehe.

Ich vermute mal dann muss du das mit MOUSE_ENTERED und MOUSE_EXITED.

Ich habe das bisher immer direkt in FXML den passen Event Methode gefüllt zum Beispiel onMouseEntered oder onMouseExited definiert, kannst du natürlich auch direkt im Code umsetzen.

 

[Mart]

Dein Fehler ist erstmal dass dein Handle jedesmal aufgerufen wird sobald du den Eventhandler ausführst...dieser fügt einen neuen Handler hinzu und es ist in fx nicht erlaubt 2mal einen Eventhandler für das selbe event zu haben...

was du haben möchtest mit Hover kann über ein Binding gelöst werden wenn du es hard coden möchtest ich weis nicht ob ichs komplett zusammen kriege aber es ist sowieso nur beispielhaft

button.colorProperty().bind(Bindings.when(button.hoverProperty()).then(Color.Red).otherwise((Color)null));

das ist ein Conditional Binding oder wie man das sonst nennt....ist halt ein binding mit when then otherwise...das findest du überall im internet aber wie man sieht is es ein mords Schinken an code den niemand versteht aber funktioniert wenn ich mir mehr mühe gegeben hätte 😀


aber in css wäre es einfacher

Button:hover{
    -fx-background-color: red;
}
[CODE]
das ist einfach..kann auch sauber in eine extra css datei ausgelagert werden und ist verständlich ...falls ein Button objekt gehovered wird mach den Style Effekt... dann kann man noch linear gradient und die gefühlt 1000 verschiedenen Css sachen noch machen

Man kann auch IDs benutzen und Klassen und vieeeeeeel mehr