如何让CSS装饰的JavaFX按钮在鼠标悬停时颜色变暗

能不能获取并修改CSS里的颜色？ #

能是能，但不建议直接修改CSS定义的颜色值——CSS样式是全局或组件级的，改了会影响所有使用该样式的组件，而且JavaFX里通过代码解析CSS获取属性操作起来麻烦还容易出错。更靠谱的做法是用CSS伪类或者自定义样式类来实现悬停效果，要么全在CSS层面搞定，要么结合Java代码动态切换样式类。

推荐的实现方案 #

方案1：纯CSS搞定（最通用、首推） #

直接在CSS里给按钮添加:hover伪类，把悬停时的背景色设为原颜色的暗化版本即可。如果原颜色是固定值，直接写暗化后的色值；要是用了CSS变量，JavaFX 16+还支持derive()这种颜色函数，能直接基于原颜色调暗。

示例CSS：

/* 基础按钮样式 */
.custom-button {
    -fx-background-color: #4CAF50; /* 原背景色 */
    -fx-text-fill: white;
    -fx-font-size: 14px;
}

/* 悬停时变暗：derive第二个参数为负数表示变暗，正数表示变亮 */
.custom-button:hover {
    -fx-background-color: derive(#4CAF50, -20%);
}

然后给按钮添加这个样式类：

button.getStyleClass().add("custom-button");

不管按钮是用CSS还是代码设置的基础样式，只要通过:hover伪类定义效果就能生效。如果原颜色用了CSS变量，也能直接套用：

.root {
    --button-bg: #4CAF50;
}

.custom-button {
    -fx-background-color: var(--button-bg);
}

.custom-button:hover {
    -fx-background-color: derive(var(--button-bg), -20%);
}

方案2：Java代码+CSS伪类（动态场景适用） #

要是需要动态开关悬停效果，可以用JavaFX的PseudoClass手动触发状态，再在CSS里定义这个伪类的样式。

Java代码：

import javafx.css.PseudoClass;

private static final PseudoClass HOVER_DARKEN = PseudoClass.getPseudoClass("hover-darken");

// 给按钮绑定鼠标事件
button.setOnMouseEntered(e -> button.pseudoClassStateChanged(HOVER_DARKEN, true));
button.setOnMouseExited(e -> button.pseudoClassStateChanged(HOVER_DARKEN, false));

对应的CSS：

.custom-button:hover-darken {
    -fx-background-color: derive(-fx-background-color, -20%);
}

这种方式能在Java代码里控制是否启用悬停变暗效果，样式仍由CSS管理，不会冲掉原有的CSS装饰。

方案3：调整原代码使其覆盖CSS #

要是非得用Java代码修改背景色，就得让代码设置的样式优先级高于CSS——通过设置行内样式（inline style）就能实现。

代码调整：

private Color originalColor;

// 先初始化获取按钮的原始背景色（包含CSS设置的颜色）
public void initButtonStyle(Button button) {
    originalColor = (Color) button.getBackground().getFills().get(0).getFill();
}

public void toggleButtonDarken(Button button) {
    Color currentColor = (Color) button.getBackground().getFills().get(0).getFill();
    Color targetColor = currentColor.equals(originalColor) ? originalColor.darker() : originalColor;
    // 设置行内样式，优先级高于CSS
    button.setStyle("-fx-background-color: #" + targetColor.toString().substring(2, 8) + ";");
}

注意：这种方式需要提前初始化获取原始颜色，要是按钮的CSS样式动态变化，还得重新获取原始颜色，稳定性不如纯CSS方案。

总结 #

优先选择纯CSS伪类+derive函数的方案，这最符合JavaFX的设计思路，通用且易于维护，不用编写复杂的Java代码，还能完美兼容CSS装饰的按钮。

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