JavaFX学习笔记(最全,最详细)

文章目录

    • Java: JavaFX桌面GUI开发
    • 1、基本概念
    • 2、最小框架代码
    • 3、控件布局
    • 4,初步认识stage窗口
    • 5,stage窗口模式(StageStyle)
    • 6,screen类的使用
    • 7,Group容器的使用
    • 8,Button按钮以及简单介绍设置背景颜色和外边框等问题
    • 9,JavaFX布局(pane)
    • (1). Pane
    • (2). BorderPane
    • (3). HBox
    • (4). VBox
    • (5) FlowPane面板
    • (6), GridPane面板
    • 用户界面设计例子

Java: JavaFX桌面GUI开发

1、基本概念

  • 窗口 Stage

  • 场景 Scene

  • 布局 stackPane

  • 控件 Button

2、最小框架代码

创建命令行应用

package com.company;

import javafx.application.Application;
import javafx.stage.Stage;


public class HelloWorld extends Application {
     
    @Override
    public void start(Stage primaryStage) throws Exception {
     
        primaryStage.show();       //显示窗口
    }

    public static void main(String[] args) {
     
        launch(args);           //启动这个程序  APPlication的方法
    }
}

对就是啥都没有,空白的窗体
JavaFX学习笔记(最全,最详细)_第1张图片

3、控件布局

package com.company;

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


public class Main extends Application {
     

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

    @Override
    public void start(Stage primaryStage) throws Exception {
     
        // 实例化按钮
        Button button = new Button("这是按钮上的文字");

        // 创建布局控件    //其他各种布局StackPane,FlowPane,HBox,VBox,GridPane,BorderPane
        StackPane stackPane = new StackPane();

        // 将button添加到布局
        stackPane.getChildren().add(button);

        // 创建场景 宽=400 高=400
        Scene scene = new Scene(stackPane, 400, 400);

        // 将场景添加到窗口
        primaryStage.setScene(scene);

        // 显示窗口
        primaryStage.show();
    }
}


JavaFX学习笔记(最全,最详细)_第2张图片

4,初步认识stage窗口

primaryStage.setTitle("JavaFX");    //添加标题	

primaryStage.getIcons().add(new Image("ico/tim.png"));    //设置图标	

primaryStage.setIconified(true);       //设置最小化

primaryStage.setMaximized(true);     //设置最大化

primaryStage.close();      //关闭窗口

rimaryStage.setResizable(false);        //设置窗口大小是否可调整

primaryStage.setWidth(500); primaryStage.setHeight(500);    //设置窗口宽度和高度

primaryStage.setWidth(500); primaryStage.setHeight(500);      //设置窗口最大宽高

primaryStage.getWidth();<br />primaryStage.getHeight()     //获取窗口宽高

primaryStage.show();     //显示窗口

primaryStage.setOpacity(0.5);   //设置窗口不透明度

primaryStage.setAlwaysOnTop(true);       //设置在窗口永远在最上层

rimaryStage.setX(100); <br />primaryStage.setY(100);      //设置窗口的位置(左上角像素坐标)

Platform.exit();          //终止JavaFX应用程序
primaryStage.setFullScreen(true);
primaryStage.setScene(new Scene(new Group()));        //设置全屏,必需设置Scene

//设置高度变化监听
primaryStage.heightProperty().addListener(new ChangeListener<Number>() {
     
@Override
public void changed(ObservableValue<? extends Number> observable, Number oldValue, Number newValue) {
     
System.out.println("当前高度 ==>" + newValue.intValue());
}
});

//设置宽度变化监听
primaryStage.widthProperty().addListener(new ChangeListener<Number>() {
     
@Override
public void changed(ObservableValue<? extends Number> observable, Number oldValue, Number newValue) {
     
System.out.println("当前宽度 ==>" +newValue.intValue() );
}
});

//设置窗口位置X轴坐标监听
primaryStage.xProperty().addListener(new ChangeListener<Number>() {
      <br />@Override <br />public void changed(ObservableValue<? extends Number> observable, Number oldValue, Number newValue) {
     <br /> System.out.println("窗口X轴坐标= " + newValue.intValue());<br /> } <br />});

//设置窗口位置Y轴坐标监听
primaryStage.yProperty().addListener(new ChangeListener<Number>() {
      <br /> @Override<br /> public void changed(ObservableValue<? extends Number> observable, Number oldValue, Number newValue) {
     <br /> System.out.println("窗口Y轴坐标= " + newValue.intValue());<br /> }<br /> });


实例代码

public class Main extends Application {
     
    
    @Override
    public void start(Stage primaryStage) throws Exception{
     
        // 添加标题
        primaryStage.setTitle("JavaFX");

        // 设置图标
        primaryStage.getIcons().add(new Image("ico/tim.png"));

        // 设置最小化
        //primaryStage.setIconified(true);

        //设置最大化
       // primaryStage.setMaximized(true);

        // 关闭窗口
        // primaryStage.close();

        //设置窗口宽度和高度
        primaryStage.setWidth(500);
        primaryStage.setHeight(500);

        // 设置窗口大小是否可调整
       // primaryStage.setResizable(false);

        // 设置窗口最大宽高
        primaryStage.setMaxWidth(1000);
        primaryStage.setMaxHeight(1000);

        // 获取窗口宽高
        System.out.println("宽度= " + primaryStage.getWidth());
        System.out.println("高度= " + primaryStage.getHeight());

        // 设置高度变化监听
        primaryStage.heightProperty().addListener(new ChangeListener<Number>() {
     
            @Override
            public void changed(ObservableValue<? extends Number> observable, Number oldValue, Number newValue) {
     
                System.out.println("当前高度 ==>" + newValue.intValue());
            }
        });
        //设置宽度变化监听
        primaryStage.widthProperty().addListener(new ChangeListener<Number>() {
     
            @Override
            public void changed(ObservableValue<? extends Number> observable, Number oldValue, Number newValue) {
     
                System.out.println("当前宽度 ==>" +newValue.intValue() );
            }
        });

        // 设置全屏,必需设置Scene
        primaryStage.setFullScreen(true);
        primaryStage.setScene(new Scene(new Group()));

        // 显示窗口
        primaryStage.show();
    }
    
    public static void main(String[] args) {
     
        launch(args);
    }
}
@Override
public void start(Stage primaryStage) throws Exception {
     

    // 设置窗口不透明度
    //primaryStage.setOpacity(0.5);

    // 设置在窗口永远在最前面(置顶)
    //primaryStage.setAlwaysOnTop(true);

    //设置窗口宽度和高度
    primaryStage.setWidth(500);
    primaryStage.setHeight(500);
    // 设置窗口的位置(左上角像素坐标)
    primaryStage.setX(100);
    primaryStage.setY(100);

    // 设置窗口位置X轴坐标监听
    primaryStage.xProperty().addListener(new ChangeListener<Number>() {
     
        @Override
        public void changed(ObservableValue<? extends Number> observable, Number oldValue, Number newValue) {
     
            System.out.println("窗口X轴坐标= " + newValue.intValue());
        }
    });

    // 设置窗口位置Y轴坐标监听
    primaryStage.yProperty().addListener(new ChangeListener<Number>() {
     
        @Override
        public void changed(ObservableValue<? extends Number> observable, Number oldValue, Number newValue) {
     
            System.out.println("窗口Y轴坐标= " + newValue.intValue());
        }
    });

    primaryStage.show();
}

5,stage窗口模式(StageStyle)

JavaFX学习笔记(最全,最详细)_第3张图片

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

        Stage s1 = new Stage();
        s1.setTitle("s1");
        //纯白背景和平台装饰
        s1.initStyle(StageStyle.DECORATED);
        s1.show();

        Stage s2 = new Stage();
        s2.setTitle("s2");
        //透明背景且没有装饰
        s2.initStyle(StageStyle.TRANSPARENT);
        s2.show();

        Stage s3 = new Stage();
        s3.setTitle("s3");

        //纯白背景,无装饰。
        s3.initStyle(StageStyle.UNDECORATED);
        s3.show();

        Stage s4 = new Stage();
        s4.setTitle("s4");

        //纯白背景和最少平台装饰
        s4.initStyle(StageStyle.UNIFIED);
        s4.show();

        Stage s5 = new Stage();
        s5.setTitle("s5");
        //一个统一标准的舞台
        s5.initStyle(StageStyle.UTILITY);
        s5.show();

        // 终止JavaFX应用程序
        Platform.exit();

    }

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

JavaFX学习笔记(最全,最详细)_第4张图片

public class Main3 extends Application {
     


    @Override
    public void start(Stage primaryStage) throws Exception {
     
        Stage s1 = new Stage();
        //s1.setTitle("s1");
        s1.show();

        Stage s2 = new Stage();
        //s2.initOwner(s1);
        s2.setTitle("s2");
        s2.show();

        Stage s3 = new Stage();
        //阻止事件传递到任何其他应用程序窗口
        s3.initModality(Modality.APPLICATION_MODAL);
        s3.initOwner(s2);

        // 阻止事件传递到所有者的窗口
        //s3.initModality(Modality.WINDOW_MODAL);

        s3.setTitle("s3");
        s3.show();

    }

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

6,screen类的使用

JavaFX学习笔记(最全,最详细)_第5张图片

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

        // 获取屏幕对象
        Screen screen = Screen.getPrimary();
        // 获取屏幕dpi
        double dpi = screen.getDpi();
        System.out.println("当前屏幕dpi ==>" + dpi);


        //获取屏幕宽高 Rectangle2D [minX = 0.0, minY=0.0, maxX=2560.0, maxY=1440.0, width=2560.0, height=1440.0]
        Rectangle2D rec1 = screen.getBounds();

        // 获取屏幕可视宽高 Rectangle2D [minX = 0.0, minY=0.0, maxX=2560.0, maxY=1400.0, width=2560.0, height=1400.0]
        Rectangle2D rec2 = screen.getVisualBounds();
        System.out.println("屏幕宽高 ==>" + rec1);
        System.out.println("屏幕可视宽高 ==>" + rec2);

        Platform.exit();
    }

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

窗口结构 Stage包含 scene ,scene 包含Node

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

        // 打开网页
        HostServices host = getHostServices();
        host.showDocument("www.baidu.com");


        // 获取资源地址
        URL url = getClass().getClassLoader().getResource("ico/tim.png");
        String path = url.toExternalForm();

        // 结构 Stage包含 scene 包含 Node
        Button button = new Button("按钮");
        button.setPrefWidth(200);
        button.setPrefHeight(100);

        Group group = new Group();
        boolean add = group.getChildren().add(button);

        // 场景对象
        Scene scene = new Scene(group);

        // 设置场景图上光标样式
        //scene.setCursor(Cursor.CLOSED_HAND);
        // 自定义光标
        scene.setCursor(Cursor.cursor(path));

        primaryStage.setScene(scene);

        primaryStage.setTitle("Javafx");
        primaryStage.setHeight(800);
        primaryStage.setWidth(800);

        primaryStage.show();
    }

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

7,Group容器的使用

JavaFX学习笔记(最全,最详细)_第6张图片

public class Main8 extends Application {
     
    // bt1按钮增加事件 自增参数
    int i = 0;
    @Override
    public void start(Stage primaryStage) throws Exception {
     

        // 定义按钮
        Button bt1 = new Button("bt1");
        Button bt2 = new Button("bt2");
        Button bt3 = new Button("bt3");

        // 设置按钮布局位置
        bt1.setLayoutX(0);
        bt1.setLayoutY(0);
        // 设置按钮大小
        bt1.setPrefHeight(50);
        bt1.setPrefWidth(100);

        bt2.setLayoutX(200);
        bt2.setLayoutY(0);
        bt2.setPrefHeight(50);
        bt2.setPrefWidth(100);

        bt3.setLayoutX(400);
        bt3.setLayoutY(0);
        bt3.setPrefHeight(50);
        bt3.setPrefWidth(100);

        Group group = new Group();

        // 设置Group的不透明度
        //group.setOpacity(0.5);

        // 自动调整子节点尺寸,默认是true,设置为false是子节点宽高为0
        group.setAutoSizeChildren(true);

        // 在Grounp容器中添加按钮
        group.getChildren().add(bt1);
        group.getChildren().addAll(bt1,bt2,bt3);
        // 在Grounp容器中中移除按钮
        //group.getChildren().remove(bt1);
        // 清除容器中全部元素
        //group.getChildren().clear();

        // 判断坐标点是否有子组件
        System.out.println(group.contains(1,1));

        // 获取所有子组件
        Object[] objects = group.getChildren().toArray();

        for(Object o: objects){
     
            Button btn = (Button) o;
            btn.setPrefWidth(100);
            btn.setPrefHeight(100);
        }

        // 增加子节点列表监听
        group.getChildren().addListener(new ListChangeListener<Node>() {
     
            @Override
            public void onChanged(Change<? extends Node> c) {
     
                System.out.println("当前子组件数量==> " +  c.getList().size());
            }
        });

        // bt1按钮增加事件
        bt1.setOnAction(new EventHandler<ActionEvent>() {
     
            @Override
            public void handle(ActionEvent event) {
     
                Button but4 = new Button("but4");
                but4.setLayoutY(100);
                but4.setLayoutX(i);
                but4.setPrefHeight(100);
                but4.setPrefWidth(100);
                group.getChildren().add(but4);
                i = i + 100;
            }
        });


        Scene scene = new Scene(group);

        primaryStage.setScene(scene);

        primaryStage.setTitle("javafx");
        primaryStage.setHeight(800);
        primaryStage.setWidth(800);
        primaryStage.show();
    }

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

8,Button按钮以及简单介绍设置背景颜色和外边框等问题

JavaFX学习笔记(最全,最详细)_第7张图片
设置背景颜色

// 设置背景颜色
// Paint 颜色
// CornerRadii 圆角
//Insets 内边距
//b1.setBackground(new Background(new BackgroundFill(Color.LIGHTBLUE,new CornerRadii(10),new Insets(5,0,0,0)) ));

// 背景填充
// Paint 颜色 可以直接用Color.LIGHTBLUE 获取颜色
// Paint.valueOf("#87CEEB55")  前六位颜色代码,后两位不透明度
// CornerRadii 圆角半径
//Insets 内边距
BackgroundFill bgf = new BackgroundFill(Paint.valueOf("#87CEEB55"),new CornerRadii(20),new Insets(50));
//背景对象
Background background = new Background(bgf);
// 设置背景颜色
b1.setBackground(background);

设置边框

// 设置边框Paint.valueOf("#87CEEB")
// Paint 颜色
// BorderStrokeStyle 边框描边样式
// CornerRadii 圆角半径
// 边框宽度 BorderWidths
BorderStroke bos = new BorderStroke(Color.RED,BorderStrokeStyle.SOLID,new CornerRadii(10),new BorderWidths(5));
Border border = new Border(bos);
b1.setBorder(border);

使用JavaCSS设置样式

/*常用的FXStyle*/
b2.setStyle(
        "-fx-background-color: #1169EE20;"+ //背景颜色
        "-fx-background-radius: 5;"+ //背景圆角
        "-fx-background-insets: 0;"+ //边框到背景的距离
        "-fx-text-fill: #50ff23;"+ //文本颜色
        "-fx-font-size: 15;"+ //字体大小
        "-fx-font-family: 'Segoe Print';"+ //字体
        "-fx-border-color: #EE1169;"+ //边框颜色
        "-fx-border-style: SOLID;"+ //边框样式
        /**
         *BorderStrokeStyle.DOTTED; // 虚线
         *BorderStrokeStyle.DOTTED;  // 点状
         *BorderStrokeStyle.NONE; // 无样式
         *BorderStrokeStyle.SOLID;  //实线
         */
        "-fx-border-radius: 5;"+ //边框圆角
        "-fx-border-width: 2;" //边框宽度
);

设置按钮单击事件

// 设置按钮单击事件
b1.setOnAction(new EventHandler<ActionEvent>() {
     
    @Override
    public void handle(ActionEvent event) {
     

        // 获取事件最初发生的对象
        Button button = (Button)event.getSource();
        System.out.println(button.getText());

        System.out.println("按钮b1被点击了.....");
    }
});

实例代码


```java
public class Main9 extends Application {
     
    @Override
    public void start(Stage primaryStage) throws Exception {
     
        // 创建按钮对象
        Button b1 = new Button();
        // 设置按钮显示文本
        b1.setText("这是按钮");
        // 设置文本字体
        b1.setFont(Font.font("sans-serif",40));
        // 设置文字颜色
        b1.setTextFill(Color.RED);

        // 设置布局位置
        b1.setLayoutX(100);
        b1.setLayoutY(100);

        // 设置宽高
        b1.setPrefWidth(400);
        b1.setPrefHeight(200);



        // 设置背景图片
//        b1.setBackground(new Background(new BackgroundImage(
//                new Image("ico\\tim.png") , null, null,
//                null, null)));

        // 设置背景颜色
        // Paint 颜色
        // CornerRadii 圆角
        //Insets 内边距
        //b1.setBackground(new Background(new BackgroundFill(Color.LIGHTBLUE,new CornerRadii(10),new Insets(5,0,0,0)) ));

        // 背景填充
        // Paint 颜色 可以直接用Color.LIGHTBLUE 获取颜色
        // Paint.valueOf("#87CEEB55")  前六位颜色代码,后两位不透明度
        // CornerRadii 圆角半径
        //Insets 内边距
        BackgroundFill bgf = new BackgroundFill(Paint.valueOf("#87CEEB55"),new CornerRadii(20),new Insets(50));
        //背景对象
        Background background = new Background(bgf);
        // 设置背景颜色
        b1.setBackground(background);

        // 设置边框Paint.valueOf("#87CEEB")
        // Paint 颜色
        // BorderStrokeStyle 边框描边样式
        // CornerRadii 圆角半径
        // 边框宽度 BorderWidths
        BorderStroke bos = new BorderStroke(Color.RED,BorderStrokeStyle.SOLID,new CornerRadii(10),new BorderWidths(5));
        Border border = new Border(bos);

        b1.setBorder(border);
        //javafx css 设置样式

        Button b2 = new Button("b2");

        // 设置布局位置
        b2.setLayoutX(100);
        b2.setLayoutY(300);
        b2.setPrefWidth(400);
        b2.setPrefHeight(200);

        /*常用的FXStyle*/
        b2.setStyle(
                "-fx-background-color: #1169EE20;"+ //背景颜色
                "-fx-background-radius: 5;"+ //背景圆角
                "-fx-background-insets: 0;"+ //边框到背景的距离
                "-fx-text-fill: #50ff23;"+ //文本颜色
                "-fx-font-size: 15;"+ //字体大小
                "-fx-font-family: 'Segoe Print';"+ //字体
                "-fx-border-color: #EE1169;"+ //边框颜色
                "-fx-border-style: SOLID;"+ //边框样式
                /**
                 *BorderStrokeStyle.DOTTED; // 虚线
                 *BorderStrokeStyle.DOTTED;  // 点状
                 *BorderStrokeStyle.NONE; // 无样式
                 *BorderStrokeStyle.SOLID;  //实线
                 */
                "-fx-border-radius: 5;"+ //边框圆角
                "-fx-border-width: 2;" //边框宽度
        );

        // 设置按钮单击事件
        b1.setOnAction(new EventHandler<ActionEvent>() {
     
            @Override
            public void handle(ActionEvent event) {
     

                // 获取事件最初发生的对象
                Button button = (Button)event.getSource();
                System.out.println(button.getText());

                System.out.println("按钮b1被点击了.....");
            }
        });

        Group root = new Group();
        root.getChildren().add(b1);
        root.getChildren().add(b2);
        Scene scene = new Scene(root);
        primaryStage.setTitle("javaFX");
        primaryStage.setHeight(800);
        primaryStage.setWidth(800);
        primaryStage.setScene(scene);
        primaryStage.show();
    }

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

9,JavaFX布局(pane)

(1). Pane

Pane是其它布局控件类的父类,我们可以将Pane看成一个绝对布局控件,当我们将某个控件放置在Pane当中的时候,我们需要指定它的位置坐标(layoutX和layoutY)。当我们将一个控件拖拽到Pane中的时候,会自动生成layoutX和layoutY坐标。如图是使用Pane为父容器设计的一个简单界面:

JavaFX学习笔记(最全,最详细)_第8张图片

<?xml version="1.0" encoding="UTF-8"?>
 
<?import javafx.scene.control.*?>
<?import java.lang.*?>
<?import javafx.scene.layout.*?>
 
 
<Pane maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="350.0" prefWidth="500.0" xmlns="http://javafx.com/javafx/8.0.40" xmlns:fx="http://javafx.com/fxml/1">
   <children>
      <Button layoutX="318.0" layoutY="210.0" mnemonicParsing="false" text="登录" />
      <Label layoutX="136.0" layoutY="104.0" text="用户名:" />
      <Label layoutX="136.0" layoutY="162.0" text="密 码:" />
      <TextField layoutX="212.0" layoutY="100.0" />
      <PasswordField layoutX="212.0" layoutY="158.0" />
   </children>
</Pane>

(2). BorderPane

BorderPane将界面分割上上下左右中5部分

JavaFX学习笔记(最全,最详细)_第9张图片

BorderPane pane = new BorderPane();        //首先创建一个BorderPane对象

//然后在BorderPane对象的五个区域分别放置五个CustomPane对象,
//CustomPane是自定义面板,是为了方便放置标签。
pane.setTop(new CustomPane("Top")); //放置在上面

    pane.setRight(new CustomPane("Right"));//放置在右边

    pane.setBottom(new CustomPane("Bottom"));//放置在上面

    pane.setLeft(new CustomPane("Left"));//放置在左边

    pane.setCenter(new CustomPane("Center"));//放置在中间

(3). HBox

HBox是将所有的控件放在同一行,无论有多少个控件都是放在同一行。
HBox可以水平排列控件,不换行。如图:
JavaFX学习笔记(最全,最详细)_第10张图片

HBox hBox = new HBox(15);     //首先创建一个HBox对象

    hBox.setPadding(new Insets(15, 15, 15, 15));

    hBox.setStyle("-fx-background-color: gold");
    
//然后,在面板上添加六个按钮,代码如下:
hBox.getChildren().add(new Button("one"));

    hBox.getChildren().add(new Button("two"));

    hBox.getChildren().add(new Button("three"));

    hBox.getChildren().add(new Button("four"));

    hBox.getChildren().add(new Button("five"));

    hBox.getChildren().add(new Button("six"));

效果
JavaFX学习笔记(最全,最详细)_第11张图片

(4). VBox

VBox类似的,垂直排列控件,不换列。如图:

JavaFX学习笔记(最全,最详细)_第12张图片

//VBox的布局策略与HBox类似,不过VBox是将所有的控件放在同一列。

//首先创建一个VBox对象,代码如下:

VBox vBox = new VBox(15);

    vBox.setPadding(new Insets(15, 5, 5, 5));

//然后,在VBox对象中添加六个按钮,代码如下:

vBox.getChildren().add(new Button("one"));

    vBox.getChildren().add(new Button("two"));

    vBox.getChildren().add(new Button("three"));

    vBox.getChildren().add(new Button("four"));

    vBox.getChildren().add(new Button("five"));

    vBox.getChildren().add(new Button("six"));

JavaFX学习笔记(最全,最详细)_第13张图片

(5) FlowPane面板

FlowPane感觉像HBox和VBox的综合体,FlowPane可以设置一个方向水平或者垂直。默认方向为水平,那么放入FlowPane中的控件会先水平排列,如果第一行满了以后进入下一行继续水平排列。垂直方向类似的,先垂直排列,如果第一列满了以后进入第二列继续垂直排列。如图:
JavaFX学习笔记(最全,最详细)_第14张图片

//首先创建一个FlowPane对象,代码如下:

FlowPane pane = new FlowPane();

    pane.setPadding(new Insets(11, 12, 13, 14));

    pane.setHgap(5);//设置控件之间的垂直间隔距离

    pane.setVgap(5);//设置控件之间的水平间隔距离

//创建两个标签对象、两个文本输入框和一个按钮对象,代码如下:

Label lbName = new Label("Please input a name:");

    TextField tfName = new TextField();

    Label lbPassword = new Label("Please input a password:");

    TextField tfPassword = new TextField();   

    Button okbtn = new Button("OK");

//将这几个控件添加到面板中,代码如下:

pane.getChildren().addAll(lbName,tfName,lbPassword,tfPassword,okbtn);

JavaFX学习笔记(最全,最详细)_第15张图片

(6), GridPane面板

它采用的布局策略是:将整个面板划分为若干个格子,每个格子的大小是一样的,每个格子中可以放置一个控件,类似于表格的方式。

GridPane pane = new GridPane();

    pane.setAlignment(Pos.CENTER);

    pane.setPadding(new Insets(11.5, 12.5, 13.5, 14.5));

    pane.setHgap(5.5);

    pane.setVgap(5.5);

向面板中添加六个按钮,代码如下:

pane.add(new Button("1"), 0, 0);

    pane.add(new Button("2"), 1, 0);

    pane.add(new Button("3"), 0, 1);

    pane.add(new Button("4"), 1, 1);

    pane.add(new Button("5"), 0, 2);

    pane.add(new Button("6"), 1, 2);

add方法的第二个和第三个参数是指定控件摆放的位置,分别表示所在的列和行,0是第一行和第一列。布局效果如下图所示:

JavaFX学习笔记(最全,最详细)_第16张图片

用户界面设计例子

package ch14;

import javafx.application.Application;
import javafx.geometry.Pos;
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.HBox;
import javafx.scene.layout.StackPane;
import javafx.scene.layout.VBox;
import javafx.scene.text.Font;
import javafx.scene.text.FontPosture;
import javafx.scene.text.FontWeight;
import javafx.scene.text.Text;
import javafx.stage.Stage;

public class Login extends Application{
     
	
	public void start(Stage primaryStage) throws Exception {
     
		
		VBox pane = new VBox(20);
		pane.setAlignment(Pos.CENTER);   //设置对齐
		
		HBox pane2 = new HBox(20);
		pane.setAlignment(Pos.CENTER);   //设置对齐
		
		HBox pane3 = new HBox(20);
		pane.setAlignment(Pos.CENTER);   //设置对齐

		Text text1 = new Text(50,50,"学生信息管理界面");
		text1.setFont(Font.font("宋体",FontWeight.BOLD,FontPosture.ITALIC,24));   //设置样式
		
		Button Login = new Button("登录");
		Text text2 = new Text(300,300,"学号");
		Text text3 = new Text(50,50,"密码");
		Text text4 = new Text(100,50,"");
		TextField user = new TextField();
		PasswordField pwd = new PasswordField();
		pwd.setAlignment(Pos.CENTER);
		
		pane.getChildren().add(text1);
		pane2.getChildren().add(text2);
		pane2.getChildren().add(user);
		pane3.getChildren().add(text3);
		pane3.getChildren().add(pwd);
		pane.getChildren().add(pane2);
		pane.getChildren().add(pane3);
		pane.getChildren().add(Login);
		pane.getChildren().add(text4);
		
		Scene scene = new Scene(pane,400,400);
		

		
		
		
		
		
		
		
		primaryStage.setTitle("学生信息管理");
		primaryStage.setScene(scene);    //指定要在此阶段上使用的场景。
        primaryStage.show();   // 显示窗口
	};

	public static void main(String[] args){
     
		launch(args);   //启动这个程序  APPlication的方法
	}

}

JavaFX学习笔记(最全,最详细)_第17张图片

持续更新中…

你可能感兴趣的:(Java,javafx)