枠線付きのGridPane

Question

私はGridPaneの周りに境界線を付けようとしています。また、どのコンテナが私の問題で最高になるのだろうか。 GridPaneは問題があるようですが、これを行う簡単な方法はありますか？

現在の結果：https://i.imgur.com/XAwhHQB.png

public void start(Stage primaryStage) { 
     try { 
       primaryStage.setTitle("GridPane"); 

       BorderPane root = new BorderPane(); 
       Scene scene = new Scene(root, 300, 210); 

       GridPane grd =new GridPane(); 
       ColumnConstraints column1width = new ColumnConstraints(50); 
       ColumnConstraints column2width = new ColumnConstraints(70); 
       ColumnConstraints column3width = new ColumnConstraints(70); 
       RowConstraints row1Height = new RowConstraints(30); 
       grd.getColumnConstraints().addAll(column1width, column2width, column3width); 
       grd.getRowConstraints().add(row1Height); 


       Label source = new Label("Source"); 
       Label report = new Label("Report"); 
       TextField text1 = new TextField(); 
       TextField text2 = new TextField("report.txt"); 
       Button browse1 = new Button("Browse..."); 
       Button browse2 = new Button("Browse..."); 
       grd.setVgap(10); 
       grd.setHgap(10); 
       grd.setPadding(new Insets(10, 10, 10, 10)); 

       text1.setPrefSize(80, 20); 
       text2.setPrefSize(80, 20); 
       browse1.setPrefSize(80, 20); 
       browse2.setPrefSize(80, 20); 


       Label textIO = new Label("Text IO zone"); 
       textIO.getStyleClass().add("title"); 
       textIO.setPadding(new Insets(-40, -20, 0, 0)); 

       textIO.setPrefWidth(120);  
       grd.add(textIO, 0, 0); 
       grd.add(source, 0, 0); 
       grd.add(text1, 1, 0); 
       grd.add(browse1, 2, 0); 
       grd.add(report, 0, 1); 
       grd.add(text2, 1, 1); 
       grd.add(browse2, 2, 1); 

       grd.getStyleClass().add("border"); 

       grd.prefHeightProperty().bind(root.heightProperty()); 

       root.getStyleClass().add("color"); 
       root.setLeft(grd); 

       scene.getStylesheets().add(getClass().getResource("application.css").toExternalForm()); 
       primaryStage.setScene(scene); 
       primaryStage.setMinHeight(250); 
       primaryStage.setMinWidth(410); 
       primaryStage.show(); 
     } catch(Exception e) { 
      e.printStackTrace(); 
     } 
    } 

とCSSスタイル /* JavaFXのCSS - あなたは、少なくとも-fx-プロパティを使用して一つのルールを作成するまで、このコメントを残す*/

.title { 
    -fx-background-color: aliceblue; 
    -fx-translate-y: -5; 
    -fx-content-display: bottom; 
} 
.border { 
    -fx-border-insets: 5; 
    -fx-border-color: black; 
} 
.color{ 
    -fx-background-color: aliceblue; 
} 

Answer 1

あまりにもずっと前にこれについての質問がありましたが、私はそれを見つけることができません。キーは、すべての背景を同じ色に設定しています。

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

<?import javafx.geometry.Insets?> 
<?import javafx.scene.control.Button?> 
<?import javafx.scene.control.Label?> 
<?import javafx.scene.control.TextField?> 
<?import javafx.scene.layout.AnchorPane?> 
<?import javafx.scene.layout.HBox?> 
<?import javafx.scene.layout.StackPane?> 
<?import javafx.scene.layout.VBox?> 

<AnchorPane maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="400.0" prefWidth="600.0" style="-fx-background-color: white;" xmlns="http://javafx.com/javafx/8.0.60" xmlns:fx="http://javafx.com/fxml/1"> 
    <children> 
     <StackPane layoutX="150.0" layoutY="115.0" prefHeight="200.0" prefWidth="300.0" style="-fx-border-color: black; -fx-background-color: white;"> 
     <children> 
      <VBox prefHeight="200.0" prefWidth="100.0" spacing="10.0"> 
       <children> 
        <HBox spacing="10.0"> 
        <children> 
         <Label maxHeight="1.7976931348623157E308" text="Source" /> 
         <TextField prefWidth="125.0" /> 
         <Button mnemonicParsing="false" text="Browse.." /> 
        </children> 
        </HBox> 
        <HBox spacing="10.0"> 
        <children> 
         <Label maxHeight="1.7976931348623157E308" text="Report" /> 
         <TextField maxWidth="125.0" /> 
         <Button mnemonicParsing="false" text="Browse.." /> 
        </children> 
        </HBox> 
       </children> 
       <StackPane.margin> 
        <Insets left="5.0" right="5.0" top="20.0" /> 
       </StackPane.margin> 
      </VBox> 
     </children></StackPane> 
     <Label layoutX="164.0" layoutY="105.0" style="-fx-background-color: white;" text="Text IO Zone" /> 
    </children> 
</AnchorPane>