JavaFX ListViewがGridPaneを使用してTextAreaでカバーされています

Question

GUIを使用して少しゲームをしていますが、レイアウトに問題があります。私はそれを実行すると

私はこれを取得：

ListView

はTextAreaでカバーされて、私はその隣にそれを取得しようとしています。この例のように：ここで

は、私が持っているコードは、これまでのところです：

import javafx.application.Application; 
import javafx.geometry.Insets; 
import javafx.geometry.VPos; 
import javafx.scene.Scene; 
import javafx.scene.control.Button; 
import javafx.scene.control.Label; 
import javafx.scene.control.ListView; 
import javafx.scene.control.TextArea; 
import javafx.scene.layout.GridPane; 
import javafx.stage.Stage; 

public class test extends Application { 

    Stage window; 
    ListView<String> listView; 
    TextArea descArea = new TextArea(); 
    TextArea actionDescArea = new TextArea(); 
    Label healthLabel = new Label("Health:"); 
    Label manaLabel = new Label("Mana:"); 
    Label healthDisplay = new Label("100/100"); 
    Label manaDisplay = new Label("100/100"); 
    Button actionBtn = new Button("Action"); 

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

    @Override 
    public void start(Stage primaryStage) throws Exception { 
     window = primaryStage; 
     window.setTitle("Game"); 

     GridPane grid = new GridPane(); 
     grid.setPadding(new Insets(10, 10, 10, 10)); 
     grid.setVgap(10); 
     grid.setHgap(10); 

     descArea.setPrefWidth(750); 
     descArea.setPrefHeight(550); 
     descArea.setWrapText(true); 
     descArea.setEditable(false); 
     GridPane.setConstraints(descArea, 0, 0, 1, 2); 

     GridPane.setConstraints(healthLabel, 1, 0); 
     GridPane.setValignment(healthLabel, VPos.TOP); 

     GridPane.setConstraints(healthDisplay, 2, 0); 
     GridPane.setValignment(healthDisplay, VPos.TOP); 

     GridPane.setConstraints(manaLabel, 1, 1); 
     GridPane.setValignment(manaLabel, VPos.TOP); 

     GridPane.setConstraints(manaDisplay, 2, 1); 
     GridPane.setValignment(manaDisplay, VPos.TOP); 

     listView = new ListView<>(); 
     listView.getItems().addAll("Action 1", "Action 2", "Action 3", "Action 4"); 
     listView.setPrefWidth(260); 
     listView.setMaxWidth(260); 
     listView.setPrefHeight(150); 
     GridPane.setConstraints(listView, 0, 2, 1, 1); 

     actionDescArea.setPrefWidth(100); 
     actionDescArea.setPrefHeight(150); 
     actionDescArea.setMaxWidth(100); 
     actionDescArea.setWrapText(true); 
     actionDescArea.setEditable(false); 
     GridPane.setConstraints(actionDescArea, 0, 2, 2, 1); 

     actionBtn.setPrefWidth(260); 
     actionBtn.setPrefHeight(60); 
     GridPane.setConstraints(actionBtn, 0, 3); 

     grid.getChildren().addAll(descArea, healthLabel, healthDisplay, manaLabel, manaDisplay, listView, actionBtn, actionDescArea); 

     Scene scene = new Scene(grid, 950, 750); 
     window.setScene(scene); 
     window.show(); 
    } 

誰もが正しい方向に私を指すことができれば、それは素晴らしいことです！

感謝:)のノート取る

Answer 1

いくつかのこと：ここで

GridPane.setConstraints(descArea, 0, 0, 1, 2); 

を、TextAreaのdescAreaはCOLSPANはここで、0

GridPane.setConstraints(listView, 0, 2, 1, 1); 

としてcolumnIndexにして1でありListView listViewのcolspanは1で、columnIndexは0です。

ここ

、TextAreaのactionDescAreaはCOLSPANは、我々はlistView次へactionDescAreaを配置する場合、それは後者のそれよりも大きいcolumnIndexにする必要があります0

としてcolumnIndexにして2である持っています。我々はそれが成長し、descArea以下の幅全体をカバーしたい場合はまた、我々はdescAreaの下でなければなりません両方listViewとactionDescAreaいるので、さらにmaxWidth

GridPane.setConstraints(actionDescArea, 1, 2, 1, 1); 
GridPane.setHgrow(actionDescArea, Priority.ALWAYS); 

をPriority.AlwaysとしてHgrowを設定し、削除する必要があり、そのCOLSPANはする必要があります2.

GridPane.setConstraints(descArea, 0, 0, 2, 2); 

ソリューション：

import javafx.application.Application; 
import javafx.geometry.Insets; 
import javafx.geometry.VPos; 
import javafx.scene.Scene; 
import javafx.scene.control.Button; 
import javafx.scene.control.Label; 
import javafx.scene.control.ListView; 
import javafx.scene.control.TextArea; 
import javafx.scene.layout.GridPane; 
import javafx.scene.layout.Priority; 
import javafx.stage.Stage; 

public class Test extends Application { 

    Stage window; 
    ListView<String> listView; 
    TextArea descArea = new TextArea(); 
    TextArea actionDescArea = new TextArea(); 
    Label healthLabel = new Label("Health:"); 
    Label manaLabel = new Label("Mana:"); 
    Label healthDisplay = new Label("100/100"); 
    Label manaDisplay = new Label("100/100"); 
    Button actionBtn = new Button("Action"); 

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

    @Override 
    public void start(Stage primaryStage) throws Exception { 
     window = primaryStage; 
     window.setTitle("Game"); 

     GridPane grid = new GridPane(); 
     grid.setPadding(new Insets(10, 10, 10, 10)); 
     grid.setVgap(10); 
     grid.setHgap(10); 

     descArea.setPrefWidth(750); 
     descArea.setPrefHeight(550); 
     descArea.setWrapText(true); 
     descArea.setEditable(false); 
     GridPane.setConstraints(descArea, 0, 0, 2, 2); 

     GridPane.setConstraints(healthLabel, 2, 0); 
     GridPane.setValignment(healthLabel, VPos.TOP); 

     GridPane.setConstraints(healthDisplay, 3, 0); 
     GridPane.setValignment(healthDisplay, VPos.TOP); 

     GridPane.setConstraints(manaLabel, 2, 1); 
     GridPane.setValignment(manaLabel, VPos.TOP); 

     GridPane.setConstraints(manaDisplay, 3, 1); 
     GridPane.setValignment(manaDisplay, VPos.TOP); 

     listView = new ListView<>(); 
     listView.getItems().addAll("Action 1", "Action 2", "Action 3", "Action 4"); 
     listView.setPrefWidth(260); 
     listView.setMaxWidth(260); 
     listView.setPrefHeight(150); 
     GridPane.setConstraints(listView, 0, 2, 1, 1); 

     actionDescArea.setPrefWidth(100); 
     actionDescArea.setPrefHeight(150); 
     actionDescArea.setWrapText(true); 
     actionDescArea.setEditable(false); 
     GridPane.setConstraints(actionDescArea, 1, 2, 1, 1); 
     GridPane.setHgrow(actionDescArea, Priority.ALWAYS); 

     actionBtn.setPrefWidth(260); 
     actionBtn.setPrefHeight(60); 
     GridPane.setConstraints(actionBtn, 0, 3); 

     grid.getChildren().addAll(descArea, healthLabel, healthDisplay, manaLabel, manaDisplay, listView, actionBtn, actionDescArea); 

     Scene scene = new Scene(grid, 950, 750); 
     window.setScene(scene); 
     window.show(); 
    } 
} 

出力：