AI 助理
备案控制台
开发者社区 开发与运维 文章 正文

javaFx 教程 二

2023-05-29 157
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《 阿里云开发者社区用户服务协议》和 《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写 侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
简介： javaFx 教程

上一篇讲了 javafx的入门，使用SceneBuilder 快速创建一个gui。

这一次讲下一些组件的功能，如画板，按钮，文本框之类的。

javafx的组件很多，本人也只学习了常用的组件，会陆续写几篇教程 用来学习工具开发。

涉及到一些组件 下面的文章都是采用代码来编写，所以需要有基础的功底。

布局类型

打开SceneBuilder  Containers 会看到有很多的单词 每个单词代表一种布局样式

每个单词前面都有个图形，那个图像就是他的布局样式

BorderPane布局

这种布局呢 会分为五个区域 上下左右中 在代码里分别对应五个方法

640.png640.png

Hbox 布局

他是一直水平布局 把多个组件 水平放在一起 对应的就是垂直布局

它有两种添加组件的方法

hBox.getChildren().add();     // 添加一个组件 
hBox.getChildren().addall();  // 添加全部组件

标签

// 注意别导错包   
import javafx.scene.control.Label;
Label label = new Label();

使用所有的组件 前提条件就是要创建一个布局，布局就像是一个桌子，组件就像是桌子上的物品，现有前者，后有后者。

示例代码

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.Label;
import javafx.scene.layout.BorderPane;
import javafx.stage.Stage;
public class demo1 extends Application {
    @Override
    public void start(Stage primaryStage) throws Exception {
        BorderPane root = new BorderPane();
        // 创建一个标签
        Label label = new Label("我是标签");
        // 把标签 放到bp布局的中间位置
        root.setCenter(label);
        primaryStage.setTitle("demo");
        primaryStage.setScene(new Scene(root,400,300));
        primaryStage.show();
    }
}

640.png

按钮

import javafx.scene.control.Button;
Button button = new Button();

示例代码

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.layout.BorderPane;
import javafx.stage.Stage;
public class demo1 extends Application {
    @Override
    public void start(Stage primaryStage) throws Exception {
        BorderPane root = new BorderPane();
        // 创建一个按钮
        Button button = new Button("别碰我");
        root.setCenter(button);
        primaryStage.setTitle("demo");
        primaryStage.setScene(new Scene(root,400,300));
        primaryStage.show();
    }
}

创建了按钮，该如何使用。比如 我打开微信要发个语言，我的步骤就是 点击语音，然后录取我的声音，松开发送给对方。

此时 在java中也可以进行。只需要给按钮设置一个监听器，当你点击我，我就去执行某个动作。

所有的组件 添加监听器都是下面的那个方法。

setOnAction();
这是一个添加的功能 在方法体里，设置一个匿名内部类，对里面的方法进行重写
button.setOnAction(new EventHandler<ActionEvent>() {
            @Override
            public void handle(ActionEvent event) {
               // code
               // 这里就是写执行动作的代码
            }
        });

设置需求，当我点击按钮，给我弹出一个信息。

示例代码

import javafx.application.Application;
import javafx.event.ActionEvent;
import javafx.event.EventHandler;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.layout.BorderPane;
import javafx.stage.Stage;
public class demo1 extends Application {
    @Override
    public void start(Stage primaryStage) throws Exception {
        BorderPane root = new BorderPane();
        // 创建一个按钮
        Button button = new Button("别碰我");
        button.setOnAction(new EventHandler<ActionEvent>() {
            @Override
            public void handle(ActionEvent event) {
                button.setText("你是大傻叉");
            }
        });
        root.setCenter(button);
        primaryStage.setTitle("demo");
        primaryStage.setScene(new Scene(root,400,300));
        primaryStage.show();
    }
}

点击前

点击后

640.png

单行文本

import javafx.scene.control.TextField;
TextField textField = new TextField();

示例代码

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.TextField;
import javafx.scene.layout.BorderPane;
import javafx.stage.Stage;
public class demo1 extends Application {
    @Override
    public void start(Stage primaryStage) throws Exception {
        BorderPane root = new BorderPane();
        TextField textField = new TextField();
        root.setCenter(textField);
        primaryStage.setTitle("demo");
        primaryStage.setScene(new Scene(root,400,300));
        primaryStage.show();
    }
}

多行文本

import javafx.scene.control.TextArea;
TextArea textArea = new TextArea();

示例代码

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.TextArea;
import javafx.scene.layout.BorderPane;
import javafx.stage.Stage;
public class demo1 extends Application {
    @Override
    public void start(Stage primaryStage) throws Exception {
        BorderPane root = new BorderPane();
        TextArea textArea = new TextArea();
        root.setCenter(textArea);
        primaryStage.setTitle("demo");
        primaryStage.setScene(new Scene(root,400,300));
        primaryStage.show();
    }
}

上面两种文本都可以添加监听器，后面文章会有案例

图片

针对图片，可以加载本地的，资源文件，远程文件

图片主要有两个方法来显示

Image       加载图片
ImageView   显示图片
Image image = new Image("http://xxx.xxx.xxx.xxx/1.jpeg");
ImageView imv = new ImageView(image);

示例代码

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.layout.BorderPane;
import javafx.stage.Stage;
public class Test extends Application {
    @Override
    public void start(Stage primaryStage) throws Exception {
        // 面板
        BorderPane bp = new BorderPane();
        // 加载图片 资源/本地/网络皆可
        Image image = new Image("http://xxx.xxx.xxx.xxx/1.jpeg");
        // 本地图片
        // Image image = new Image("file:c:/1.jpg");
        // 资源图片
        // Image image = new Image("sample/1.jpg");
        // 展示图片
        ImageView imageView = new ImageView(image);
        // 图片添加到画板
        bp.setCenter(imageView);
        // 获取图片大小 自适应画板
        double h = image.getHeight();
        double w = image.getWidth();
        primaryStage.setTitle("demo");
        primaryStage.setScene(new Scene(bp,w,h));
        primaryStage.show();
    }
}

上面的演示都是以BorderPane ，下面有个案例使用hbox来展示。

案例1

package sample;
import javafx.application.Application;
import javafx.geometry.Insets;
import javafx.geometry.Pos;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.control.TextField;
import javafx.scene.layout.HBox;
import javafx.scene.layout.Priority;
import javafx.stage.Stage;
public class demo1 extends Application{
    @Override
    public void start(Stage primaryStage) throws Exception {
        HBox hb = new HBox();
        // 水平居中
        hb.setAlignment(Pos.CENTER);
        // 内边距
        hb.setPadding(new Insets(20));
        TextField tf = new TextField();
        Button select = new Button("浏览文件");
        Button upload = new Button("上传文件");
        // 自动占满 水平方向
        HBox.setHgrow(tf, Priority.ALWAYS);
        // 全部添加布局
        hb.getChildren().addAll(tf,select,upload);
        primaryStage.setTitle("Hbox布局");
        primaryStage.setScene(new Scene(hb,500,50));
        primaryStage.show();
    }
}

控件的尺寸

setPrefWidth(); 水平方向设置宽度
setMaxHeight(); 垂直方向设置高度
import javafx.application.Application;
import javafx.geometry.Insets;
import javafx.geometry.Pos;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.control.TextField;
import javafx.scene.layout.HBox;
import javafx.scene.layout.Priority;
import javafx.stage.Stage;
public class demo1 extends Application{
    @Override
    public void start(Stage primaryStage) throws Exception {
        HBox hb = new HBox();
        Button b1 = new Button("aaa");
        Button b2 = new Button("aaabbb");
        Button b3 = new Button("aaabbbccc");
        // 控件大小 
        b1.setPrefWidth(100);
        b2.setMaxHeight(50);
        hb.getChildren().addAll(b1,b2,b3);
        primaryStage.setTitle("Hbox布局");
        primaryStage.setScene(new Scene(hb,500,50));
        primaryStage.show();
    }
}

这是默认大小的按钮

640.png

这是上面代码调整的

640.png

布局嵌套

使用多个布局类型 进行嵌套

需求：

使用hbox布局和BorderPane布局

hbox布局 里存在文本行，一个按钮 添加监听 添加我写的数据到文本区

BorderPane布局 存在文本区

    package sample;
import javafx.application.Application;
import javafx.event.ActionEvent;
import javafx.event.EventHandler;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.control.TextArea;
import javafx.scene.control.TextField;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.HBox;
import javafx.scene.layout.Priority;
import javafx.stage.Stage;
public class Demo extends Application {
    @Override
    public void start(Stage primaryStage) throws Exception {
        // 创建盒子
        HBox hBox = new HBox();
        // 盒子里存放两个控件 文本行和按钮
        TextField textField = new TextField();
        Button button = new Button("添加");
        TextArea textArea = new TextArea();
        // 添加组件
        hBox.getChildren().addAll(textField,button);
        // 让文本框占满水平方向的长度
        HBox.setHgrow(textField, Priority.ALWAYS);
        // 在bp添加hbox盒子
        BorderPane bp = new BorderPane();
        bp.setTop(hBox);
        bp.setCenter(textArea);
        // 按钮添加监听
        button.setOnAction(new EventHandler<ActionEvent>() {
            @Override
            public void handle(ActionEvent event) {
                // 获取文本行的内容发送给文本区里
                String text = textField.getText();
                textArea.appendText(text+"\n");
            }
        });
        primaryStage.setScene(new Scene(bp,400,300));
        primaryStage.show();
    }
}

    640.png

    案例2：命令执行

      package sample;
import javafx.application.Application;
import javafx.event.ActionEvent;
import javafx.event.EventHandler;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.control.TextArea;
import javafx.scene.control.TextField;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.HBox;
import javafx.scene.layout.Priority;
import javafx.stage.Stage;
import java.io.BufferedReader;
import java.io.InputStreamReader;
public class DemoCmd extends Application {
    @Override
    public void start(Stage primaryStage) throws Exception {
        // 在hbox里添加上按钮 文本行 
        HBox hBox = new HBox();
        TextField textField = new TextField();
        Button b1 = new Button("执行");
        Button b2 = new Button("清空");
        // 文本区
        TextArea textArea = new TextArea();
        hBox.getChildren().addAll(textField,b1,b2);
        HBox.setHgrow(textField, Priority.ALWAYS);
        // 按钮监听
        b1.setOnAction(new EventHandler<ActionEvent>() {
            @Override
            public void handle(ActionEvent event) {
                // 获取文本行里的命令
                String text = textField.getText();
                // 创建字符缓冲流 在内存里读写数据 然后发送数据到文本区
                StringBuilder stringBuilder = new StringBuilder();
                Process process = null;
                try {
                    process = Runtime.getRuntime().exec(text);
                    BufferedReader bufferedReader = new BufferedReader(
                            new InputStreamReader(process.getInputStream(), "GBK"));
                    String line = null;
                    while((line=bufferedReader.readLine()) != null) {
                        stringBuilder.append(line+"\n");
                    }
                    textArea.setText(stringBuilder.toString());
                } catch (Exception e) {
                    e.printStackTrace();
                }
            }
        });
        b2.setOnAction(new EventHandler<ActionEvent>() {
            @Override
            public void handle(ActionEvent event) {
                // 清空数据的动作
                textField.clear();
                textArea.clear();
            }
        });
        // 添加布局
        BorderPane root =new BorderPane();
        root.setTop(hBox);
        root.setCenter(textArea);
        primaryStage.setTitle("命令执行");
        primaryStage.setScene(new Scene(root,500,400));
        primaryStage.show();
    }


      文章标签：
      Java
      轩公子谈技术
      目录
      相关文章
      陈佳烨
      |
      6月前
      |
      XML IDE Java
      JavaFX 教程
      JavaFX 教程
      陈佳烨
      219 1
      QGS
      |
      7月前
      |
      容器
      JavaFX场景入门(下)
      JavaFX场景入门
      QGS
      75 0
      QGS
      |
      7月前
      |
      Android开发
      JavaFX场景入门(上)
      JavaFX场景入门
      QGS
      106 0
      轩公子谈技术
      |
      SQL 安全 小程序
      javaFx 工具开发
      javaFx 工具开发
      轩公子谈技术
      177 0
      坚持学习永不言弃
      |
      Java Linux API
      JavaFx学习
      JavaFx学习
      坚持学习永不言弃
      119 0
      轩公子谈技术
      |
      安全 Java
      javaFx 安全开发 三
      javaFx 安全开发
      轩公子谈技术
      179 0
      轩公子谈技术
      |
      IDE Java 开发工具
      javaFx 教你五分钟写个工具
      javaFx 基础知识
      轩公子谈技术
      873 0
      QGS
      |
      Java
      JAVAFX+SceneBuilder基础入门
      环境：JDK1.8+IDEA fxml载入项目 通过SceneBuilder编写好布局，生成fxml文件。
      QGS
      192 0
      QGS
      JAVAFX+SceneBuilder基础
      记JAVAFX+SceneBuilder基础
      QGS
      126 0
      JAVAFX+SceneBuilder基础
      爱喝汤的技术少年
      |
      Java Maven 图形学
      JavaFx教程(一) 基本概念
      JavaFx教程(一) 基本概念
      爱喝汤的技术少年
      1145 0
      JavaFx教程(一) 基本概念