JavaFX/fxml：整个窗口旁边的垂直按钮

Question

我使用GridPane作为舞台的主要场景，布局完全是在FXML文件中定义的。我想有一个按钮在窗口的整个边（即在我的GridPane的所有行上），如下所示：

然而，我就是不能让它工作。更确切地说，它似乎只是按钮不会增加整个高度。我已经为按钮设置了gridpane.vgrow=always、maxheight=“infinity”和gridpane.fillheight=true，但按钮仍然与其中的文本一样长，并且放在侧面的中心。

我如何使按钮延伸到整个网格窗格？正如开头提到的，我当然已经正确设置了GridPane.rowspan。这并不是按钮没有正确地放置在网格窗格中，只是它自己不会占用整个可用的垂直空间。

请注意，我更喜欢通过FXML而不是Java代码的解决方案，因为我不希望在我的类中有这样的布局代码。

谢谢你！

Answer 1

最简单的方法是使用CSS。请执行以下步骤：

若要旋转按钮中使用的标签,请使用：

.button > .text {
    -fx-rotate: 90;
}

要扩展按钮以使用整个高度,请使用Infinity作为首选高度：

.button {
    -fx-pref-height: Infinity;
    -fx-pref-width: 75;
}

<?xml version="1.0" encoding="UTF-8"?>

<?import javafx.scene.control.Button?>
<?import javafx.scene.layout.ColumnConstraints?>
<?import javafx.scene.layout.GridPane?>
<?import javafx.scene.layout.RowConstraints?>
<?import javafx.scene.layout.VBox?>

<GridPane styleClass="root" xmlns="http://javafx.com/javafx/8.0.65" xmlns:fx="http://javafx.com/fxml/1">
   <columnConstraints>
      <ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" />
      <ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" />
   </columnConstraints>
   <rowConstraints>
      <RowConstraints minHeight="50.0" vgrow="SOMETIMES" />
      <RowConstraints minHeight="50.0" prefHeight="30.0" vgrow="SOMETIMES" />
      <RowConstraints minHeight="50.0" prefHeight="30.0" vgrow="SOMETIMES" />
   </rowConstraints>
   <children>
      <Button mnemonicParsing="false" text="Button" GridPane.rowSpan="3" />
      <VBox style="-fx-background-color: white;" GridPane.columnIndex="1" GridPane.hgrow="ALWAYS" GridPane.rowIndex="1" GridPane.vgrow="ALWAYS" />
      <VBox style="-fx-background-color: white;" GridPane.columnIndex="1" GridPane.hgrow="ALWAYS" />
      <VBox style="-fx-background-color: white;" GridPane.columnIndex="1" GridPane.hgrow="ALWAYS" GridPane.rowIndex="2" />
   </children>
</GridPane>

CSS

root是分配给GridPane的样式类。

.root {
    -fx-background-color: grey;
    -fx-hgap: 5;
    -fx-vgap: 5;
    -fx-padding: 5;
}

.root > .button > .text {
    -fx-rotate: 90;
}

.button {
    -fx-pref-height: Infinity;
    -fx-pref-width: 75;
}

主

import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.stage.Stage;

public class Main extends Application {

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

        FXMLLoader fxmlLoader = new FXMLLoader(getClass().getResource("/grid.fxml"));
        final Parent root = fxmlLoader.load();
        final Scene scene = new Scene(root, 685, 411);
        scene.getStylesheets().add(getClass().getResource("/grid.css").toExternalForm());
        primaryStage.setScene(scene);
        primaryStage.show();
    }

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