JavaFX Transition - Darken button on hover

Question

Я новичок в JavaFX. Я пытаюсь создать свой собственный подкласс Button, который будет иметь на анимации для ввода мыши и мыши. Анимация, которую я пытаюсь достичь, - это простой «темный» или «тусклый» переход, который будет затемнять цвет фона кнопки, когда пользователь навешивается над кнопкой, и будет оживлять его до нормального состояния, когда мышь выйдет из кнопки.

Сначала я думал, что смогу добиться этого с помощью FillTransition, но для этого мне понадобится конкретный темный цвет кнопки, который зависит от цвета кнопки. Итак, теперь я пытаюсь в основном исчезать и исчезать черным прямоугольником с низкой непрозрачностью поверх кнопки, но прямоугольник, похоже, вообще не появляется.

Вот код моей кнопки:

public class FlatButton extends Button { 

    private Rectangle dimRectangle; 
    private Duration dimDuration = Duration.millis(250); 
    private Color dimColor = new Color(0,0,0,0.11); 

    public FlatButton(String text) { 
     super(text); 

     getStyleClass().addAll("flat-button-style"); 
     createEffect(); 
    } 

    private void createEffect() 
    { 
     dimRectangle = new Rectangle(this.getWidth(), this.getHeight(), dimColor); 
     dimRectangle.setOpacity(1.0); 
     dimRectangle.setX(this.get); 


     FadeTransition enterTransition = new FadeTransition(dimDuration, this); 
     enterTransition.setInterpolator(Interpolator.EASE_OUT); 
     enterTransition.setFromValue(0.0); 
     enterTransition.setToValue(1.0); 

     FadeTransition exitTransition = new FadeTransition(dimDuration, this); 
     exitTransition.setInterpolator(Interpolator.EASE_OUT); 
     exitTransition.setFromValue(1.0); 
     exitTransition.setToValue(0.0); 


     this.setOnMouseEntered(new EventHandler<MouseEvent>(){ 

      public void handle(MouseEvent mouseEvent){ 
       enterTransition.play(); 
      } 
     }); 

     this.setOnMouseExited(new EventHandler<MouseEvent>(){ 

      public void handle(MouseEvent mouseEvent){ 
       exitTransition.play(); 
      } 
     }); 
    } 

} 

EDIT: Часть в коде "новый FadeTransition (dimDuration, это);" должен быть «новый FadeTransition (dimDuration, dimRectangle);». Это то, что я тестировал.

EDIT2: Я понял, что "dimRectangle = новый Rectangle (this.getWidth(), this.getHeight(), dimColor);" на самом деле не работает, но я еще не нашел способ сделать прямоугольник заполнить размеры кнопок.

Answer 1

Вы можете использовать эффект ColorAdjust и изменить его brightness с использованием Timeline.

public class ButtonFadeDemo extends Application { 

    @Override 
    public void start(Stage primaryStage) { 

     try { 

      Pane root = new Pane(); 

      Button button = new Button("Click me!"); 

      ColorAdjust colorAdjust = new ColorAdjust(); 
      colorAdjust.setBrightness(0.0); 

      button.setEffect(colorAdjust); 

      button.setOnMouseEntered(e -> { 

       Timeline fadeInTimeline = new Timeline(
         new KeyFrame(Duration.seconds(0), 
           new KeyValue(colorAdjust.brightnessProperty(), colorAdjust.brightnessProperty().getValue(), Interpolator.LINEAR)), 
           new KeyFrame(Duration.seconds(1), new KeyValue(colorAdjust.brightnessProperty(), -1, Interpolator.LINEAR) 
           )); 
       fadeInTimeline.setCycleCount(1); 
       fadeInTimeline.setAutoReverse(false); 
       fadeInTimeline.play(); 

      }); 

      button.setOnMouseExited(e -> { 

       Timeline fadeOutTimeline = new Timeline(
         new KeyFrame(Duration.seconds(0), 
           new KeyValue(colorAdjust.brightnessProperty(), colorAdjust.brightnessProperty().getValue(), Interpolator.LINEAR)), 
           new KeyFrame(Duration.seconds(1), new KeyValue(colorAdjust.brightnessProperty(), 0, Interpolator.LINEAR) 
           )); 
       fadeOutTimeline.setCycleCount(1); 
       fadeOutTimeline.setAutoReverse(false); 
       fadeOutTimeline.play(); 

      }); 

      root.getChildren().addAll(button); 

      Scene scene = new Scene(root, 800, 400); 
      primaryStage.setScene(scene); 
      primaryStage.show(); 

     } catch (Exception e) { 
      e.printStackTrace(); 
     } 
    } 


    public static void main(String[] args) { 
     launch(args); 
    } 
}