有没有办法在JavaFX中实现这个CSS动画？

html和css代码：

我从你那里得到了这个密码

div{
位置：相对位置；
显示：内联块；
填充：15px 70px；
边框：5px实心#B17461；
颜色：#B17461；
字体大小：30px；
字体系列：arial；
背景图像：线性梯度（#B17461，#B17461）；
背景位置：50%50%；
背景重复：无重复；
背景大小：0%100%；
过渡：背景尺寸.5s，颜色.5s；
}
div:悬停{
背景大小：100%100%；
颜色：#fff；
}

---

NEXT

此简单应用程序的功能与您展示的基本相同：

包示例；
导入javafx.animation.animation；
导入javafx.animation.Transition；
导入javafx.application.application；
导入javafx.geometry.Insets；
导入javafx.scene.scene；
导入javafx.scene.control.Label；
导入javafx.scene.layout.*；
导入javafx.scene.paint.Color；
导入javafx.scene.paint.paint；
导入javafx.scene.text.Font；
导入javafx.scene.text.TextAlignment；
导入javafx.stage.stage；
导入javafx.util.Duration；
公共类主扩展应用程序{
公共静态void main（字符串[]args）{
启动（Main.class，args）；
}
@凌驾
public void start（Stage）引发异常{
最终窗格根=新窗格（）；
//此颜色将用于文本颜色（未悬停）、边框和背景色（悬停时）
最终油漆颜色=color.web（#B17461”）；
//基本材料：文本、字体和文本颜色
最终标签=新标签（“下一个”）；
label.setFont（Font.Font（“Arial”，50.0））；
标签。setTextFill（颜色）；
label.setTextAlignment（TextAlignment.CENTER）；
//和你一样的填充物
标签。设置填充（新插图（15,70,15,70））；
//边框的设置与您的设置相同（5px实心）
label.setOrder（新边框（新边框笔划（颜色、BorderStrokeStyle.SOLID、CornerRadii.EMPTY、新边框宽度（5）））；
//也许有更好的方法可以做到这一点，但这是我知道的一种。简单的转换动画，循环时间为.5s
//JavaFX将在当前“进度”（从0.0到1.0）的每一帧上调用插值方法，因此我们只需计算其中的背景大小
最终动画=新过渡（）{
{
设置循环次数（持续时间为500毫升）；
}
@凌驾
受保护的空心插值（双进度）{
最终双倍总计=label.getWidth（）/2.0；
最终双电流=（1.0-进度）*总计；
标签.收进背景（新背景（新背景填充（颜色，CornerRadii.EMPTY，新插图（0.0，当前，0.0，当前）））；
}
};
//“悬停”：更改文本颜色并启动动画
label.setonMouseCentered（事件->{
label.setTextFill（Color.web（“#fff”）；
动画。playFromStart（）；
});
//“取消覆盖”：停止动画，重置背景和文本颜色
label.setOnMouseExited（事件->{
动画。停止（）；
标签.立根（空）；
标签。setTextFill（颜色）；
});
root.getChildren（）.add（标签）；
舞台场景（新场景（根））；
stage.sizeToScene（）；
stage.show（）；
}
}

基本上，我只是在标签上以编程方式完成css中的所有内容。

---

对于动画，我使用了一个简单的

转换

与标签背景的

插入值相结合。插图描述了背景不应填充的空间大小，就像填充一样，但只用于背景。
这个简单的应用程序的功能与您展示的基本相同：

包示例；
导入javafx.animation.animation；
导入javafx.animation.Transition；
导入javafx.application.application；
导入javafx.geometry.Insets；
导入javafx.scene.scene；
导入javafx.scene.control.Label；
导入javafx.scene.layout.*；
导入javafx.scene.paint.Color；
导入javafx.scene.paint.paint；
导入javafx.scene.text.Font；
导入javafx.scene.text.TextAlignment；
导入javafx.stage.stage；
导入javafx.util.Duration；
公共类主扩展应用程序{
公共静态void main（字符串[]args）{
启动（Main.class，args）；
}
@凌驾
public void start（Stage）引发异常{
最终窗格根=新窗格（）；
//此颜色将用于文本颜色（未悬停）、边框和背景色（悬停时）
最终油漆颜色=color.web（#B17461”）；
//基本材料：文本、字体和文本颜色
最终标签=新标签（“下一个”）；
label.setFont（Font.Font（“Arial”，50.0））；
标签。setTextFill（颜色）；
label.setTextAlignment（TextAlignment.CENTER）；
//和你一样的填充物
标签。设置填充（新插图（15,70,15,70））；
//边框的设置与您的设置相同（5px实心）
label.setOrder（新边框（新边框笔划（颜色、BorderStrokeStyle.SOLID、CornerRadii.EMPTY、新边框宽度（5）））；
//也许有更好的方法可以做到这一点，但这是我知道的一种。简单的转换动画，循环时间为.5s
//JavaFX将在当前“进度”（从0.0到1.0）的每一帧上调用插值方法，因此我们只需计算其中的背景大小
最终动画=新过渡（）{
{
设置循环次数（持续时间为500毫升）；
}
@凌驾
受保护的空心插值（双进度）{
最终双倍总计=label.getWidth（）/2.0；
最终双电流=（1.0-进度）*总计；
标签.收进背景（新背景（新背景填充（颜色，CornerRadii.EMPTY，新插图（0.0，当前，0.0，当前）））；
public class Main extends Application {

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

    @Override
    public void start(Stage stage) throws Exception {
        Rectangle rect = new Rectangle(300, 30, Color.web("B17461"));
        rect.setScaleX(0);
        Button button = new Button("A Button");
        StackPane pane = new StackPane(rect, button);
        pane.setBackground(new Background(new BackgroundFill(Color.BLACK, CornerRadii.EMPTY, Insets.EMPTY)));

        TranslateTransition trans = new TranslateTransition(Duration.millis(500), rect);
        trans.setFromX(-150);
        trans.setToX(0);
        ScaleTransition scale = new ScaleTransition(Duration.millis(500), rect);
        scale.setFromX(0);
        scale.setToX(1);
        FillTransition fade = new FillTransition(Duration.millis(500), rect, Color.web("B17461"), Color.WHITE);
        Transition t = new ParallelTransition(trans, scale, fade);

        pane.setOnMouseEntered(me -> {
            t.stop();
            t.setRate(1);
            t.play();
        });
        pane.setOnMouseExited(me -> {
            t.stop();
            t.setRate(-1);
            t.play();
        });

        Scene scene = new Scene(pane);
        stage.setTitle("Transition");
        stage.setScene(scene);
        stage.setMinWidth(300);
        stage.setMinHeight(60);
        stage.show();
    }
}