JavaFx:按钮边框和悬停

时间:2015-06-06 08:17:05

标签: java css javafx java-8

我正在使用Java 8.我有工具栏和按钮。

我想实现以下内容:

  • 在工具栏上的通常状态(没有鼠标悬停)时,只能看到按钮标签(没有背景,也没有边框)。
  • 当用户鼠标悬停在按钮上时,必须看到常用按钮。

如何通过css进行操作?

3 个答案:

答案 0 :(得分:22)

使用样式删除背景:

.button {
    -fx-background-color: transparent;
}

悬停时,只需使用modena.css

中的按钮样式即可恢复所有内容
.button:hover{
    -fx-background-color: -fx-shadow-highlight-color, -fx-outer-border, -fx-inner-border, -fx-body-color;
    -fx-background-insets: 0 0 -1 0, 0, 1, 2;
    -fx-background-radius: 3px, 3px, 2px, 1px;
    -fx-padding: 0.333333em 0.666667em 0.333333em 0.666667em; /* 4 8 4 8 */
    -fx-text-fill: -fx-text-base-color;
    -fx-alignment: CENTER;
    -fx-content-display: LEFT;
}

答案 1 :(得分:2)

可以通过鼠标侦听器控制背景透明度,即通过以编程方式设置CSS(这减少了对外部样式表的需求):

final String IDLE_BUTTON_STYLE = "-fx-background-color: transparent;";
final String HOVERED_BUTTON_STYLE = "-fx-background-color: -fx-shadow-highlight-color, -fx-outer-border, -fx-inner-border, -fx-body-color;";


button.setStyle(IDLE_BUTTON_STYLE);
button.setOnMouseEntered(e -> button.setStyle(HOVERED_BUTTON_STYLE));
button.setOnMouseExited(e -> button.setStyle(IDLE_BUTTON_STYLE));

答案 2 :(得分:2)

我同意netzwerg。如果你使用fxml和javafx,那么你应该在控制器类的initialize()方法中包含这些代码行。

控制器类的示例:

public class Controller implements Initializable{
    private Button test;
    private static final String IDLE_BUTTON_STYLE = "-fx-background-color: transparent;";
    private static final String HOVERED_BUTTON_STYLE = "-fx-background-color: -fx-shadow-highlight-color, -fx-outer-border, -fx-inner-border, -fx-body-color;";

    @Override
    public void initialize(URL location, ResourceBundle resources) {
        button.setStyle(IDLE_BUTTON_STYLE);
        button.setOnMouseEntered(e -> button.setStyle(HOVERED_BUTTON_STYLE));
        button.setOnMouseExited(e -> button.setStyle(IDLE_BUTTON_STYLE));
    }
}