如何在桌面应用程序中使用 CSS 样式使 Javafx 中的文本或图像闪烁？

Question

我试图在JavaFX.
我怎样才能做到JavaFX？

我是这个平台的新手，请给我一些指导。

Answer 1

我在上面参考了我开发的简单示例。下面是我的 Fxml 文件：

FxmlDocument.fxml:
<?xml version="1.0" encoding="UTF-8"?>

<?import javafx.scene.control.Button?>
<?import javafx.scene.control.Label?>
<?import javafx.scene.layout.AnchorPane?>

<AnchorPane id="AnchorPane" prefHeight="283.0" prefWidth="320" stylesheets="@application.css" xmlns="http://javafx.com/javafx/8.0.111" xmlns:fx="http://javafx.com/fxml/1" fx:controller="blinkimagecolor.FXMLDocumentController">
   <children>
      <Label fx:id="label" alignment="CENTER" layoutX="40.0" layoutY="36.0" prefHeight="131.0" prefWidth="232.0" style="-fx-background-image: url('/images/Printer_T.png'); -fx-background-position: center; -fx-background-repeat: no-repeat;" stylesheets="@application.css" />
      <Button fx:id="button" layoutX="134.0" layoutY="209.0" mnemonicParsing="false" onAction="#buttonpressAction" text="Button" />
   </children>
</AnchorPane>

下面是我的控制器类：

FXMLDocumentController.java:-
import java.net.URL;
import java.time.Duration;
import java.util.ResourceBundle;
import javafx.animation.Animation;
import javafx.animation.KeyFrame;
import javafx.animation.Timeline;
import javafx.css.PseudoClass;
import javafx.event.ActionEvent;
import javafx.event.EventHandler;
import javafx.fxml.FXML;
import javafx.fxml.Initializable;
import javafx.scene.control.Button;
import javafx.scene.control.Label;


public class FXMLDocumentController implements Initializable {

    @FXML
    private Label label;
    @FXML
    private Button button;

    Timeline flasher ;
    PseudoClass flashHighlight;
    int i = 0;
    @Override


    public void initialize(URL url, ResourceBundle rb) {
        // TODO
        flashHighlight = PseudoClass.getPseudoClass("flash-highlight");
        flasher = new Timeline(new KeyFrame(javafx.util.Duration.seconds(0.5), e -> {
            label.pseudoClassStateChanged(flashHighlight, true);
        }),
                new KeyFrame(javafx.util.Duration.seconds(1.0), e -> {
            label.pseudoClassStateChanged(flashHighlight, false);
        })
    );
    flasher.setCycleCount(Animation.INDEFINITE);

    }    

    @FXML
    private void buttonpressAction(ActionEvent event) {

        if(i == 0){
            flasher.play();
            i = 1;
            System.out.println("start method");
        }else{
            flasher.stop();
            i = 0;
            System.out.println("stop method");
            label.pseudoClassStateChanged(flashHighlight, false);
        }
        System.out.println("Out of button function");

    }

}

下面是我的主类：

public class BlinkImageColor extends Application {

    @Override
    public void start(Stage stage) throws Exception {
        Parent root = FXMLLoader.load(getClass().getResource("FXMLDocument.fxml"));

        Scene scene = new Scene(root);

        stage.setScene(scene);
        stage.show();
    }

    /**
     * @param args the command line arguments
     */
    public static void main(String[] args) {
        launch(args);
    }

}

CSS文件是：

application.css:-
:flash-highlight{
    -fx-background-color:red;
}

这个工作正常，但是如果我想多次应用相同的东西，我怎么能在不创建多个时间线的情况下做到这一点，我如何才能独立地同时为多个标签使用相同的时间线。

当我们点击按钮时，这个会起作用，背景颜色会以红色闪烁，如果我们点击同一个按钮，它就会停止闪烁的颜色。

像上面一样，如果我们有多个按钮和多个标签，它们需要像上面的按钮单击一样独立工作。与共同的时间轴。我们怎么做？