HBox in JavaFX

In diesem Kapitel beschäftigen wir uns mit Layouts, und eines dieser Layouts ist die HBox in JavaFX. Dazu werden wir in den nächsten Artikeln die verschiedenen Layouts sehen und die Unterschiede kennen lernen. Die HBox positioniert ihre Child Nodes horizontal, daher das H im Namen. Sie passt sich dabei der Höhe und Breite ihrer Child nodes an. Sofern die Größe des Parent Node nicht veränderbar ist,  nimmt es automatisch die Höhe des höchsten Child Nodes an. Standardmäßig werden die Child Nodes oben links angeordnet.

Beispiel für HBox in JavaFX

package application;
	
import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.TextField;
import javafx.scene.layout.HBox;
import javafx.scene.layout.Priority;
import javafx.stage.Stage;


public class Main extends Application {
	@Override
	public void start(Stage primaryStage) {
		try {
			TextField meinTextField = new TextField("Text hier bitte");
			HBox hbox = new HBox();
			
			hbox.getChildren().add(meinTextField);
		        HBox.setHgrow(meinTextField, Priority.ALWAYS);
			
			Scene scene = new Scene(hbox,400,100);
			primaryStage.setScene(scene);
			primaryStage.show();
		} catch(Exception e) {
			e.printStackTrace();
		}
	}
	
	public static void main(String[] args) {
		launch(args);
	}
}

Die setHgrow() Methode sorgt dafür, dass unser UI Controlls innerhalb der HBox horizontal wachsen. Wir sorgen hier also dafür, dass unser TextField wächst, wenn unsere HBox wächst. Damit erhalten wir folgendes Resultat:

[image img_id=”6295″ alt=”HBox in JavaFX” width=”300″ height=”117″]

Du siehst, das Text Field geht bis an den Rand der HBox in JavaFX.

HBox hbox = new HBox();
Button addButton = new Button("mehr");

hbox.getChildren().add(addButton);

addButton.setOnAction(e->{
	Button neuerButton = new Button("Button");
	hbox.getChildren().add(neuerButton);
});

Mit diesem Code füge ich der Hbox mit jedem Klick auf meinen addButton einen weiteren Button zur hbox. Nachdem ich ein paar mal geklickt habe, ist folgendes passiert:

Du siehst, die Hbox versucht verzweifelt alle Elemente in einer Zeile horizontal anzuordnen, koste es was es wolle. Auch wenn dadurch die Buttons nicht mehr leserlich sind.

Wenn du Abstände zwischen Elementen haben möchtest kannst du Padding und Spacing verwenden.

hbox.setPadding(new Insets(10,10,10,10));
hbox.setSpacing(10.0);

[image img_id=”6297″ alt=”HBox in JavaFX setpadding und setspacing” width=”745″ height=”158″]

Im nächsten Artikel werden wir uns dann mit der VBox beschäftigen. Diese ermöglicht es uns Elemente Vertikal in die Scene einzubauen.