如何仅使用CSS在JavaFX中实现闪烁效果？

你的现有代码仅配置了CSS过渡的基础属性，但未触发状态变化，且visibility属性的过渡在JavaFX中缺乏平滑效果，无法实现预期的闪烁。以下是两种可行的纯CSS（或CSS结合少量Java状态控制）方案：

方案1：纯CSS关键帧动画（自动循环闪烁） #

直接通过CSS定义循环动画，无需手动切换组件状态：

CSS样式 #

.blink {
    -fx-animation: blink 1s infinite alternate;
}

@keyframes blink {
    from { -fx-opacity: 1; }
    to { -fx-opacity: 0; }
}

Java代码修改 #

给Label添加样式类即可：

var label = new Label("Hello, world!");
label.getStyleClass().add("blink");

该方案完全通过CSS实现循环的透明度渐变，达到自然的闪烁效果，无需额外逻辑控制。

方案2：CSS过渡+伪类切换（支持启停控制） #

如果需要手动控制闪烁的开始/停止，可结合JavaFX伪类和CSS过渡特性：

CSS样式 #

.label {
    -fx-opacity: 1;
    -fx-transition-property: opacity;
    -fx-transition-duration: 0.5s;
}

.label:blinking {
    -fx-opacity: 0;
}

Java代码控制状态 #

通过定时器循环切换伪类，触发过渡效果：

var label = new Label("Hello, world!");
PseudoClass blinkingPseudoClass = PseudoClass.getPseudoClass("blinking");

Timeline blinkTimeline = new Timeline(
    new KeyFrame(Duration.seconds(0.5), e -> label.pseudoClassStateChanged(blinkingPseudoClass, true)),
    new KeyFrame(Duration.seconds(1), e -> label.pseudoClassStateChanged(blinkingPseudoClass, false))
);
blinkTimeline.setCycleCount(Animation.INDEFINITE);
blinkTimeline.play();

通过调用blinkTimeline.stop()或play()，可以随时控制闪烁的启停，过渡效果由CSS自动处理。

原有代码的问题说明 #

1. 未触发状态变化：你仅设置了transition-property: visibility，但没有任何逻辑切换visibility的值（如从visible改为hidden），因此过渡不会生效。
2. visibility属性限制：JavaFX中visibility的过渡是离散切换（无平滑效果），无法实现渐变闪烁，推荐使用opacity属性来获得流畅的过渡动画。

内容的提问来源于stack exchange，提问作者SilverCube