Javafx同样跨越了切换按钮

Question

我需要制作一组切换按钮，如下所示，白色背景为选中按钮，两个按钮占父容器宽度的50％。 HBox内有两个切换按钮。造型

到目前为止，我试过了，就像这样。

.viewType .toggle-button {
    -fx-padding: 0 2 0 2;
    -fx-background-color: #000;
    -fx-text-fill: white;
}

.viewType .toggle-button:selected {
    -fx-padding: 0;
    -fx-background-color: white;
    -fx-text-fill: black;
    -fx-border-wdith: 2;
    -fx-border-color: black;
    -fx-border-radius: 4;
}

Answer 1

您可以在java端将maxWidth按钮设置为max double。这将在HBox中为您的按钮提供相同的宽度。希望它有用：

btn1.setMaxWidth(Double.MAX_VALUE);
btn2.setMaxWidth(Double.MAX_VALUE);

您可以查看以下链接，以获取与调整大小和对齐节点相关的有用信息：

Sizing and Aligning Nodes

Answer 2

如果您希望两个按钮的宽度相等，请使用GridPane而不是HBox，并使用列约束使两列宽度相等：

GridPane grid = new GridPane();
grid.getColumnConstraints().addAll(createCol(), createCol());
ToggleButton toggle1 = new ToggleButton("...");
toggle1.setMaxWidth(Double.MAX_VALUE);
ToggleButton toggle2 = new ToggleButton("...");
toggle2.setMaxWidth(Double.MAX_VALUE);
grid.addRow(0, toggle1, toggle2);

// ...

private ColumnConstraints createCol() {

    ColumnConstraints col = new ColumnConstraints();
    col.setPercentWidth(50);
    col.setFillWidth(true);
    return col ;

}

您可以通过配置父级来进一步控制网格窗格在其父级中的大小（详细信息取决于父级使用的窗格类型）。

SSCCE：

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.ToggleButton;
import javafx.scene.control.ToggleGroup;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.ColumnConstraints;
import javafx.scene.layout.GridPane;
import javafx.stage.Stage;

public class EqualSizedButtons extends Application {

    @Override
    public void start(Stage primaryStage) {
        GridPane grid = new GridPane();
        grid.getStyleClass().add("viewType");
        grid.getColumnConstraints().addAll(createCol(), createCol());
        ToggleButton toggle1 = new ToggleButton("A");
        toggle1.setMaxWidth(Double.MAX_VALUE);
        ToggleButton toggle2 = new ToggleButton("This is really big button B");
        toggle2.setMaxWidth(Double.MAX_VALUE);
        grid.addRow(0, toggle1, toggle2);

        new ToggleGroup().getToggles().addAll(toggle1, toggle2);

        BorderPane root = new BorderPane();
        root.setBottom(grid);

        Scene scene = new Scene(root, 600, 600);
        scene.getStylesheets().add("style.css");
        primaryStage.setScene(scene);
        primaryStage.show();
    }


    private ColumnConstraints createCol() {

        ColumnConstraints col = new ColumnConstraints();
        col.setPercentWidth(50);
        col.setFillWidth(true);
        return col ;

    }

    public static void main(String[] args) {
        launch(args);
    }
}