【Java】javafx界面布局

一、面板类

（1）Pane面板

（2）HBox面板

（3）VBox面板

（4）BorderPane面板

（5）FlowPane面板

(6)GridPane面板

（7）StackPane面板

二、Color类和Font类

三、Line类（直线）

四、Text类

一、面板类

（1）Pane面板

package com.javafx;

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.layout.Pane;
import javafx.scene.paint.Color;
import javafx.scene.shape.Circle;
import javafx.scene.shape.Rectangle;
import javafx.stage.Stage;


public class Panex extends Application {

    @Override
    public void start(Stage primaryStage) throws Exception {
        Circle circle=new Circle(25, Color.LIGHTCORAL);
        circle.setCenterX(100);
        circle.setCenterY(50);
        Rectangle rectangle=new Rectangle(100,40,Color.LIGHTBLUE);
        rectangle.relocate(100,50);
        //旋转
        rectangle.setRotate(-33);
        Pane pane=new Pane(circle,rectangle);
       // pane.getChildren().addAll(circle, rectangle);
        Scene scene=new Scene(pane,300,200);
        primaryStage.setTitle("面板图形");
        primaryStage.setScene(scene);
        primaryStage.show();
    }

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

（2）HBox面板

实现水平排列的控件框

package com.javafx;

import javafx.application.Application;
import javafx.geometry.Insets;
import javafx.scene.Scene;
import javafx.scene.layout.HBox;
import javafx.stage.Stage;
import javafx.scene.control.Button;

public class HBox2 extends Application {
    @Override
    public void start(Stage primaryStage) throws Exception {
        Button button1=new Button("确定");
        Button button2=new Button("取消");
        //设置按钮大小
        button1.setPrefSize(200,20);
        button2.setPrefSize(100,20);

        HBox hBox=new HBox(button1,button2);
        //水平框中内容与边界之间的距离（上、右、下、左）
        hBox.setPadding(new Insets(15,12,15,12));
        //水平框中控件之间的距离
        hBox.setSpacing(10);

        Scene scene=new Scene(hBox,300,50);
        primaryStage.setTitle("HBxo");
        primaryStage.setScene(scene);
        primaryStage.show();

    }

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

（3）VBox面板

实现垂直排列的控件框

package com.javafx;

import javafx.application.Application;
import javafx.geometry.Pos;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.layout.VBox;
import javafx.stage.Stage;

public class VBox2 extends Application {
    @Override
    public void start(Stage primaryStage) throws Exception {
        Button red=new Button("红色");
        Button green=new Button("绿色");
        Button blue=new Button("蓝色");
        Button yellow=new Button("黄色");
        blue.setPrefSize(100,20);

        VBox vBox=new VBox(red,green,blue,yellow);
        //设置控制框居中对齐
        vBox.setAlignment(Pos.CENTER);
        //垂直框之间的距离
        vBox.setSpacing(20);

        Scene scene=new Scene(vBox,300,200);
        primaryStage.setTitle("VBox");
        primaryStage.setScene(scene);
        primaryStage.show();

    }

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

（4）BorderPane面板

边界面板，将面板分为中央（Center）、上（Top）、右（Right）、下（Bottom）、左（Left）五个区域，每个区域可以放置一个控件或其他面板

package com.javafx;

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.layout.BorderPane;
import javafx.stage.Stage;

public class BorderPane2 extends Application {
    @Override
    public void start(Stage primaryStage) throws Exception {
        BorderPane pane=new BorderPane();
        pane.setCenter(new Button("中央区域"));
        pane.setTop(new Button("上部工具条"));
        pane.setRight(new Button("右部"));
        pane.setBottom(new Button("下部状态栏"));
        pane.setLeft(new Button("左部菜单"));

        Scene scene=new Scene(pane,300,150);
        primaryStage.setScene(scene);
        primaryStage.setTitle("边界面板");
        primaryStage.show();
    }

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

（5）FlowPane面板

流式面板，可按行或列摆放，当这行或列不能容纳所有控件时，自动转换下一行或一列

package com.javafx;

import javafx.application.Application;
import javafx.geometry.Insets;
import javafx.geometry.Orientation;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.layout.FlowPane;
import javafx.stage.Stage;

public class FlowPane2 extends Application {
    @Override
    public void start(Stage primaryStage) throws Exception {
        //定义一个按钮数组
        Button[] buttons=new Button[8];
        FlowPane pane=new FlowPane();

        //排列方向先水平
        //pane.setOrientation(Orientation.HORIZONTAL);
        //排列方向先垂直
        pane.setOrientation(Orientation.VERTICAL);
        pane.setPadding(new Insets(15,10,15,10));
        pane.setVgap(9);
        pane.setHgap(9);
        for(int i=0;i<8;i++){
            buttons[i]=new Button("按钮"+(i+1));
            pane.getChildren().add(buttons[i]);
        }
        Scene scene=new Scene(pane,300,100);
        primaryStage.setScene(scene);
        primaryStage.setTitle("FlowPane面板");
        primaryStage.show();
    }

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

(6)GridPane面板

网格面板，可以灵活的创建包含行与列的网格

（将一种面板嵌套在另一种面板中）

package com.javafx;

import javafx.application.Application;
import javafx.geometry.Insets;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.control.Label;
import javafx.scene.control.PasswordField;
import javafx.scene.control.TextField;
import javafx.scene.layout.GridPane;
import javafx.scene.layout.HBox;
import javafx.stage.Stage;

public class GridPane2 extends Application {
    @Override
    public void start(Stage primaryStage) throws Exception {
        Label label1=new Label("用户名");
        Label label2=new Label("口令");
        //文本框
        TextField field1=new TextField();
        //密码框
        PasswordField field2=new PasswordField();
        Button ok=new Button("确定");
        Button cannel=new Button("取消");

        //创建水平控件框
        HBox hBox=new HBox(ok,cannel);
        //两个按钮之间的距离
        hBox.setSpacing(20);
        hBox.setPadding(new Insets(10,20,10,20));

        //根面板
        GridPane pane=new GridPane();
        pane.setHgap(10);
        pane.setVgap(10);
        pane.setPadding(new Insets(10,10,10,10));
        pane.add(label1,0,0);
        pane.add(label2,0,1);
        pane.add(field1,1,0);
        pane.add(field2,1,1);

        //columnlnder:单元格列的序号，rowlndex:单元格行的序号，colspan:控件跨越的列数，rowspan:控件跨越的行数
        pane.add(hBox,0,2,2,1);

        //显示网格线
        //pane.setGridLinesVisible(true);
        Scene scene=new Scene(pane,300,150);
        primaryStage.setScene(scene);
        primaryStage.setTitle("用户登录");
        primaryStage.show();


    }

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

（7）StackPane面板

栈面板布局，将所有节点放入一个栈中，每个节点添加到前一个节点上，常用于在图像或形状上添加文本

package com.javafx;


import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.layout.StackPane;
import javafx.scene.paint.Color;
import javafx.scene.shape.Ellipse;
import javafx.scene.shape.Rectangle;
import javafx.scene.text.Font;
import javafx.scene.text.Text;
import javafx.stage.Stage;



public class StackPane2 extends Application {
    @Override
    public void start(Stage primaryStage) throws Exception {

        StackPane pane=new StackPane();
        //创建一个矩形
        Rectangle rectangle=new Rectangle(80,100, Color.LIGHTBLUE);
        //矩形的边框为红色
        rectangle.setStroke(Color.RED);

        //创建一个椭圆对象
        Ellipse ellipse=new Ellipse(80,45,45,30);
        ellipse.setFill(Color.BLUE);
        ellipse.setStroke(Color.LIGHTGRAY);

        //创建一个文本对象
        Text text=new Text("3");
        text.setFont(Font.font(null,50));
        text.setFill(Color.WHITE);

        pane.getChildren().addAll(rectangle,ellipse,text);
        Scene scene=new Scene(pane,300,200);
        primaryStage.setScene(scene);
        primaryStage.setTitle("栈面板");
        primaryStage.show();

    }

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

二、Color类和Font类

字体粗细：

FontWeight.BOLD    //粗 
FontWeight.LIGHT   //细
FontWeight.NORMAL  //正常

字体形态：

FontPosture.ITALIC //斜体
FontPosture.REGULAR //正常

package com.javafx;

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.Label;
import javafx.scene.layout.StackPane;
import javafx.scene.paint.Color;
import javafx.scene.shape.Circle;
import javafx.scene.text.Font;
import javafx.scene.text.FontPosture;
import javafx.scene.text.FontWeight;
import javafx.stage.Stage;

public class FontDemo extends Application {
    @Override
    public void start(Stage primaryStage) throws Exception {
        StackPane pane=new StackPane();
        Circle circle=new Circle();
        circle.setRadius(50);//半径
        circle.setStroke(Color.BLUE);//圆的边缘颜色
        circle.setFill(new Color(1.0,1.0,0.0,0.5));//圆的颜色(红、绿、蓝)及其透明度
        pane.getChildren().add(circle);

        //创建一个标签
        Label label=new Label("JavaFx");
        //设置字体样式、加粗、斜体、大小
        Font font=Font.font("Times New Roman", FontWeight.BOLD, FontPosture.ITALIC,20);
        label.setFont(font);
        label.setTextFill(Color.BLUE);
        pane.getChildren().add(label);

        Scene scene=new Scene(pane,240,120);
        primaryStage.setScene(scene);
        primaryStage.setTitle("颜色字体示例");
        primaryStage.show();

    }

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

三、Line类（直线）

还有Rectangle类、Circle类、Ellipse类（椭圆）、Arc类（弧）、Polygon类（多边形）等

fill属性：填充的颜色

stroke属性：笔画的颜色（边框）

strokeWidth属性：笔画的宽度

strokeLineCap属性：直线形状端点的风格

StrokeLineCap.BUTT(默认)

StrokeLineCap.ROUND(端点为圆)

StrokeLineCap.SQUARE（端点为方形）

package com.javafx;

import javafx.application.Application;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.paint.Color;
import javafx.scene.shape.Line;
import javafx.scene.shape.StrokeLineCap;
import javafx.stage.Stage;

public class LineDemo extends Application {
    @Override
    public void start(Stage primaryStage) throws Exception {
        //添加在上面的控件需要绝对定位
        Group pane=new Group();

        //绿线
        Line greenLine=new Line(10,10,200,10);//设置线的坐标
        greenLine.setStroke(Color.GREEN);//设置线的颜色
        greenLine.setStrokeWidth(8);//设置宽度
        greenLine.setStrokeLineCap(StrokeLineCap.ROUND);//设置线的两端形状

        //设置虚线(为double类型，所以加d)
        greenLine.getStrokeDashArray().addAll(4d,20d);
        greenLine.setStrokeDashOffset(0);

        //红线
        Line redLine=new Line(10,40,200,40);
        redLine.setStroke(Color.RED);
        redLine.setStrokeWidth(10);
        redLine.setStrokeLineCap(StrokeLineCap.SQUARE);

        pane.getChildren().addAll(greenLine,redLine);

        //为场景的颜色
        Scene scene=new Scene(pane,300,150, Color.WHITE);

        primaryStage.setScene(scene);
        primaryStage.setTitle("绘制直线");
        primaryStage.show();

    }

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

四、Text类

添加三个文本TextFlow面板上

package com.javafx;

import javafx.application.Application;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.paint.Color;
import javafx.scene.text.*;
import javafx.stage.Stage;

public class Textch extends Application {
    @Override
    public void start(Stage primaryStage) throws Exception {

        Text text1=new Text("Hello");
        text1.setFill(Color.RED);
        text1.setFont(Font.font("Verdana",30));

        Text text2=new Text("Bold");
        text2.setFill(Color.LIGHTBLUE);
        text2.setFont(Font.font("Verdana", FontWeight.BOLD,30));

        Text text3=new Text("World");
        text3.setFill(Color.BLUE);
        text3.setFont(Font.font("verdana", FontPosture.ITALIC,30));
        text3.setRotate(90);   //旋转

        //创建TextFlow对象并添加3个文本对象
        TextFlow textFlow=new TextFlow();
        textFlow.setLayoutX(40);
        textFlow.setLayoutY(40);
        textFlow.getChildren().addAll(text1,text2,text3);

        Group group=new Group(textFlow);
        Scene scene=new Scene(group,330,120,Color.WHITE);
        primaryStage.setTitle("Hello world");
        primaryStage.setScene(scene);
        primaryStage.show();
    }

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