JavaFX布局(面板和组)

JavaFX中容纳节点的容器有面板和组(group)

特点:1. Group类常用于将节点组合成组并作为一个组进行转换和缩放

​ 2. 面板和UI组件对象是可以改变大小的,但是组,形状,以及文本对象是不能改变大小的

下面是用于容纳和组织节点的面板

pane 布局面板的基类,它有getChildren()方法来返回面板中的节点列表

StackPane 节点放置在面部中央,并且叠加在其他面板之上

FlowPane 节点以水平方式一行一行放置,或者以垂直方式一列一列放置

GridPane 节点放置在一个二维网格的单元格中

BorderPane 将节点放置在顶部,右面,底部,左面以及中间区域

HBox 节点放在单行中

VBox 节点放在单列中

FlowPane

import javafx.application.Application;
import javafx.geometry.Insets;
import javafx.scene.Scene;
import javafx.scene.control.Label;
import javafx.scene.control.TextField;
import javafx.scene.layout.FlowPane;
import javafx.stage.Stage;

public class MyjavaFX10 extends Application{
	@Override
	public void start(Stage primaryStage) {
		FlowPane pane = new FlowPane();//设置一个FlowPane面板。
		pane.setPadding(new Insets(11,12,13,14));//使用Insets对象设置它的padding(填充)属性,设置它的面板边框大小(以像素为单位,按照上右下左的顺序)
		pane.setHgap(5);//指定面板中两个相邻节点之间的水平间距
		pane.setVgap(5);//指定面板中两个相邻节点之间的垂直间距
		pane.getChildren().addAll(new Label("First Name"),new TextField()
				,new Label("MI:"),new TextField()
				,new Label("Last Name"),new TextField());//将节点添加到面板之中
		Scene scene = new Scene(pane,200,250);//将面板放在场景里面
		primaryStage.setTitle("ShowFlowPane");//设置舞台标题
		primaryStage.setScene(scene);//将场景放在舞台上面
		primaryStage.show();//展示
	}
	public static void main(String[] args) {
		 Application.launch(args);
	} 

运行后会产生六个由文字和文本域组成的节点,拉长之后可以观察到六个节点是呈水平方向放置,符合FlowPane规则(注意:文本域节点只能加载到一个面板中,也只能加一次,将一个节点加入一个面板中多次或者加入不同面板中将引起运行时错误)

GridPane

import javafx.geometry.HPos;
import javafx.geometry.Insets;
import javafx.geometry.Pos;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.control.Label;
import javafx.scene.control.TextField;
import javafx.scene.layout.GridPane;
import javafx.stage.Stage;
import javafx.application.Application;
import javafx.application.Application;
public class MyjavaFX11 extends Application{
	@Override
	public void start(Stage primaryStage) {
		GridPane pane = new GridPane();
		pane.setAlignment(Pos.CENTER);
		pane.setPadding(new Insets(11.5,12.5,13.5,14.5));//使用Insets对象设置它的padding(填充)属性,设置它的面板边框大小(以像素为单位,按照上右下左的顺序)
		pane.setHgap(5.5);//指定面板中两个相邻节点之间的水平间距
		pane.setVgap(5.5);//指定面板中两个相邻节点之间的垂直间距
		pane.add(new Label("First Name"),0, 0);//以坐标的形式放置标签和文本域的位置
		pane.add(new TextField(), 1, 0);
		pane.add(new Label("MI"), 0, 1);
		pane.add(new TextField(), 1, 1);
		pane.add(new Label("Last Name"), 0, 2);
		pane.add(new TextField(), 1, 2);
	    Button btAdd = new Button("Add Name");//设置一个按钮
	    pane.add(btAdd, 1,3);//设置按钮的位置
	    GridPane.setHalignment(btAdd, HPos.RIGHT);//setHalignment()方法为按钮节点设置水平对齐
	    Scene scene = new Scene(pane);//将面板放在场景里面
	    primaryStage.setTitle("ShowGridPane");//设置舞台标题
	    primaryStage.setScene(scene);//将场景放在舞台上面
	    primaryStage.show();//展示
	}
	public static void main(String[] args) {
		// TODO Auto-generated method stub
		Application.launch(args);
	}
} 

默认情况下网格面板会根据其中内容的首选尺寸来重新调整行和列的尺寸,哪怕网格面板调整为比他的首选尺寸更大。可以通过调用setPrefWidth和setPrefHeight方法来为其中内容的首选宽度和高度设置一个大的值,这样当网格面板变大时,内容将自动伸展来填满网格面板。

BorderPane

import javafx.application.Application;
import javafx.geometry.Insets;
import javafx.scene.Scene;
import javafx.scene.control.Label;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.StackPane;
import javafx.stage.Stage;
public class MyjavaFX12 extends Application{
	@Override
	public void start(Stage primaryStage) {
		BorderPane pane = new BorderPane();
		pane.setTop(new CustomPane("Top"));//为上下左右中设置五个节点,五个节点都在面板上面
		pane.setBottom(new CustomPane("Bottom"));
		pane.setLeft(new CustomPane("Left"));
		pane.setCenter(new CustomPane("Center"));
		pane.setRight(new CustomPane("Right"));
		Scene scene = new Scene(pane);//将面板放在场景里面
	    primaryStage.setTitle("ShowGridPane");//设置舞台标题
	    primaryStage.setScene(scene);//将场景放在舞台上面
	    primaryStage.show();//展示
	}
class CustomPane extends StackPane{//定义了StackPane的CustomPane类,
	public CustomPane(String title) {
		getChildren().add(new Label(title));//加入一个标签(标题)
		setStyle("-fx-border-color:red");//为边框颜色设置样式
		setPadding(new Insets(11.5,12.5,13.5,14.5));//设置内边距
	}
}
	public static void main(String[] args) {
		// TODO Auto-generated method stub
		Application.launch(args);
	}
}

注意:

  1. 一个面板是一个节点,所以一个面板可以加入到另外一个面板之中

  2. 要将一个面板从区域移除,如:顶部,调用setTop(null).

  3. 如果一个区域没有被占据,那么就不会分配空间给这个区域

HBox和VBox

import javafx.geometry.Insets;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.control.Label;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.HBox;
import javafx.scene.layout.VBox;
import javafx.stage.Stage;
public class MyjavaFX13 extends Application{
	@Override
	public void start(Stage primaryStage) {
		BorderPane pane = new BorderPane();
		pane.setTop(getHBox());//设置节点放在上面
		pane.setLeft(getVBox());//设置节点放在左侧
		Scene scene = new Scene(pane);//将面板放在场景里面
	    primaryStage.setTitle("ShowGridPane");//设置舞台标题
	    primaryStage.setScene(scene);//将场景放在舞台上面
	    primaryStage.show();//展示
	}
    private HBox getHBox() {
    	HBox hbox = new HBox(15);
    	hbox.setPadding(new Insets(15,15,15,15));
    	hbox.setStyle("-fx-background-color:gold");
    	hbox.getChildren().add(new Button("Computer Science"));
    	hbox.getChildren().add(new Button("Chemistry"));
    	return hbox;
    }
    private VBox getVBox() {
    	VBox vbox = new VBox();
    	vbox.setPadding(new Insets(15,5,5,5));
    	vbox.getChildren().add(new Label("Courses"));
    	Label[] courses = {new Label("CSIC 1301"),new Label("CSIC 1302")
    			,new Label("CSIC 2410"),new Label("CSIC 3720")};//将新节点放入数组中,方便进一步编写
    	for(Label course: courses) {//将数组里面的元素遍历
    		VBox.setMargin(course, new Insets(0,0,0,15));//setMargin()方法,为节点设置边距
    		vbox.getChildren().add(course);//将节点放入对象
    	}
    	vbox.getChildren().add(new Label("Courses"));
    	return vbox;
    }
	public static void main(String[] args) {
		// TODO Auto-generated method stub
		Application.launch(args);
	}
} 
Logo

CSDN联合极客时间,共同打造面向开发者的精品内容学习社区,助力成长!

更多推荐