JavaFx FXML入门(五)
JavaFx FXML入门(五)
JavaFX 从入门入门到入土系列
JavaFx的FXML类似安卓中的视图文件,可以添加样式,添加css,添加id然后在java代码中绑定点击事件。可以使用工具编辑:SceneBuilder 下载地址:https://openjfx.cn/scene-builder/
更多介绍可以看官网文档:https://openjfx.cn/javadoc/16/javafx.fxml/javafx/fxml/doc-files/introduction_to_fxml.html
环境jdk11
编写一个FXML
我这里使用SceneBuilder编写个简单FXML,需要注意,使用SceneBuilder 最新版时需要jdk11以上,否则无法打开
将上面的fxml复制到Maven项目的 resources/fxml/fxml_demo.fxml
里
<?xml version="1.0" encoding="UTF-8"?>
<?import javafx.scene.control.Button?>
<?import javafx.scene.control.Label?>
<?import javafx.scene.control.TextField?>
<?import javafx.scene.layout.AnchorPane?>
<AnchorPane maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="209.0"
prefWidth="250.0" xmlns="http://javafx.com/javafx/16" xmlns:fx="http://javafx.com/fxml/1"
fx:controller="controller.FxmlController">
<children>
<Button fx:id="btn" layoutX="46.0" layoutY="51.0" mnemonicParsing="false" text="获取当前时间"/>
<TextField fx:id="text" layoutX="46.0" layoutY="86.0"/>
<Label fx:id="lab" layoutX="46.0" layoutY="129.0" text="Label"/>
</children>
</AnchorPane>
注意上面的 fx:controller="controller.FxmlController" 我们需要创建一个FxmlController类
显示场景代码如下:
import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Scene;
import javafx.scene.layout.AnchorPane;
import javafx.stage.Stage;
import java.net.URL;
/**
* @author lingkang
* @date 2021/9/17 23:45
* @description
*/
public class FxmlDemo extends Application {
@Override
public void start(Stage stage) throws Exception {
// 获取 Maven 项目 resources/fxml/fxml_demo.fxml 注意,无法识别横向,例如 fxml-demo.fxml
URL resource = getClass().getResource("/fxml/fxml_demo.fxml");
if (resource == null) {
throw new RuntimeException("未找到fxml资源");
}
// 此时需要注意, fxml里最外层标签是 AnchorPane 故使用AnchorPane对象获取变量
AnchorPane anchorPane = FXMLLoader.load(resource);
// 将 AnchorPane 加入到场景
stage.setScene(new Scene(anchorPane));
stage.show();
}
public static void main(String[] args) {
launch(args);
}
}
再添加一个controller用于绑定视图,视图中的点击显示操作均在controller中执行
FxmlController
package controller;
import javafx.event.ActionEvent;
import javafx.event.EventHandler;
import javafx.fxml.FXML;
import javafx.fxml.Initializable;
import javafx.scene.control.Button;
import javafx.scene.control.Label;
import javafx.scene.control.TextField;
import java.net.URL;
import java.text.SimpleDateFormat;
import java.util.Date;
import java.util.ResourceBundle;
/**
* @author lingkang
* @date 2021/9/17 23:55
* @description
*/
public class FxmlController implements Initializable {
@FXML // 初始化时会自行绑定fxml里的id,注意变量命名=fxml里的id
private Button btn;
@FXML // 初始化时会自行绑定fxml里的id,注意变量命名=fxml里的id
private TextField text;
@FXML // 初始化时会自行绑定fxml里的id,注意变量命名=fxml里的id
private Label lab;
@Override
public void initialize(URL url, ResourceBundle resourceBundle) {
// 添加初始化事件
btn.setOnAction(new EventHandler<ActionEvent>() {
@Override
public void handle(ActionEvent actionEvent) {
SimpleDateFormat format = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");
String date = format.format(new Date());
// 将值赋予标签显示
text.setText(date);
lab.setText(date);
}
});
}
}
效果如下