在JavaFX中添加按钮后,ToolBar的大小不正确

时间:2017-11-03 08:40:45

标签: java css javafx

我想添加只有图像的按钮,即没有任何文字,只是图标按钮。

这是我的按钮类:

package custom.toolbar;

import javafx.scene.control.Button;

class MyButton extends Button {

    MyButton() {
        getStyleClass().add("my-button");
        setMinSize(25, 25);
        setMaxSize(25, 25);
    }
}

我创建了自定义工具栏,可以派生JavaFX ToolBar。

package custom.toolbar;

import javafx.scene.control.ToolBar;

class MyToolBar extends ToolBar {

    MyToolBar() {
        getStyleClass().add("my-toolbar");
    }
}

CSS文件:

.my-button {
    -fx-background-image: url("../img/icon/open.png");
    -fx-background-repeat: no-repeat;
    -fx-background-position: center;
    -fx-background-size: 16px 16px;
    -fx-background-color: transparent;
}

.my-button:hover {
    -fx-border-color: lightgray;
    -fx-background-color: #ededed;
    -fx-border-width: 1px;
    -fx-border-radius: 2px;
}

.my-toolbar {
    -fx-background-color: lightcyan;
}

最后是Main class本身:

package custom.toolbar;

import javafx.application.Application;
import javafx.geometry.Insets;
import javafx.scene.Scene;
import javafx.scene.layout.AnchorPane;
import javafx.stage.Stage;

public class Main extends Application {

    @Override
    public void start(Stage primaryStage) throws Exception {

        AnchorPane anchorPane = new AnchorPane();
        anchorPane.setPadding(new Insets(20));
        anchorPane.setStyle("-fx-background-color: white");

        MyToolBar myToolBar = new MyToolBar();

        for (int i = 0; i < 5; i++)
            myToolBar.getItems().add(new MyButton());

        anchorPane.getChildren().addAll(myToolBar);

        String styleCss = getClass().getResource("/css/my-toolbar.css").toExternalForm();

        Scene scene = new Scene(anchorPane);
        scene.getStylesheets().add(styleCss);
        primaryStage.setScene(scene);
        primaryStage.show();
    }
}

我在ToolBar上添加了5个按钮。 ToolBar的颜色是lightcyan,这是因为我只想突出显示工具栏的大小。

这是截图。

正如您所看到的那样,ToolBar的大小小于所有带有insets的按钮的大小。而且我不知道为什么填充在AnchorPane中不起作用。

如何解决?

1 个答案:

答案 0 :(得分:0)

要修正MyToolBar的尺寸,请将PreferedSize添加到MyButton

class MyButton extends Button {
    MyButton() {
        getStyleClass().add("my-button");
        setPrefSize(25, 25);
        setMinSize(25, 25);
        setMaxSize(25, 25);
    }
}

如果您锚定节点,则填充仅适用于AnchorPane

例如:

AnchorPane anchorPane = new AnchorPane();
anchorPane.setPadding(new Insets(20));

MyToolBar myToolBar = new MyToolBar();
AnchorPane.setTopAnchor(myToolBar, 0.0);
AnchorPane.setLeftAnchor(myToolBar, 0.0);

anchorPane.getChildren().addAll(myToolBar);