1

I have a button which changes it's color when hovered over, but i want to make this color transition seem smooth. How can i achieve this effect?

buttonLogin.setOnMouseEntered(new EventHandler<MouseEvent>() {
            @Override
            public void handle(MouseEvent e){
                buttonLogin.setStyle("-fx-background-color: "
                                + "rgba(1, 147, 255, 0.3);"
                                + "\n-fx-border-color: "
                                + "rgba(1, 147, 255, 0.5);");
            }
        });

        buttonLogin.setOnMouseExited(new EventHandler<MouseEvent>() {
            @Override
            public void handle(MouseEvent e){
                buttonLogin.setStyle("-fx-background-color: "
                                + "rgba(255, 255, 255, 0.5);"
                                + "\n-fx-border-color: "
                                + "rgba(255, 255, 255, 0.8);");
            }
        });

I tried using fadetransitions, animation but i found it hard to understand. Can someone please explain?

Taerus
  • 475
  • 6
  • 20

1 Answers1

2

You need to add an event listener when the user's mouse is hovering over your button. About the rest, at present the only solution I know is here.

If I'm not mistaken, with the arrival of JavaFX 8, developers can now make animations with CSS with the new CSS API. I'm just studying about it at the time. Please check the link here.

If you need to, you can get the new version of JavaFX 8 here.

If you have any luck, please comment.

Community
  • 1
  • 1
Loa
  • 2,117
  • 3
  • 21
  • 45
  • Thanks for your reply. I found that solution too much of a hassle to achieve what i wanted and i didn't quite understand its aproach. Therefore i changed the color scheme so that it doesnt hurt the eyes when it isn't transitioned from color to color. Will have to stick with it till the newer version comes out :) – Taerus Jan 23 '14 at 00:04