java 桌面 javafx_JavaFX桌面应用开发-HelloWorld

本文介绍了如何使用JavaFX进行桌面应用开发,包括JavaFX的基础概念、UI层级关系、创建应用的步骤,以及通过MVC模式添加控件并实现数据绑定。JavaFX提供了一种比Swing更方便的方式来设计和布局界面,支持使用FXML。文章通过一个简单的HelloWorld示例,详细讲解了从创建窗口到组织应用层级的全过程。
摘要由CSDN通过智能技术生成

JavaFX是一个强大的图形和多媒体处理工具包集合,它允许开发者来设计、创建、测试、调试和部署富客户端程序,并且和Java一样跨平台。

JavaFX比Swing好用很多,它允许开发使用FXML来设计和布局界面,跟Qt和Android的布局有点类似。

>> 更多JavaFX文章 >> JavaFX桌面应用开发系列文章

1. JavaFX UI 层级关系

JavaFX的UI分为几类:

窗口(stage)

场景(scene)

容器(container)

控件(controller)

它们之间的关系为:

stage: # 顶层

scene: # 放在窗口内

container: # 放在场景内(布局)

controller: # 放在容器中

2. 创建JavaFX应用

JavaFX应用的创建可以跟普通的Java应用创建一样,即创建一个普通的maven项目即可,不过需要JavaFX的应用主程序需要继承Application这个类。

编写最简单的应用(空白窗口):

public class App extends Application {

@Override

public void start(Stage stage) {

stage.setTitle("JavaFX Hello World");

stage.show();

}

public static void main(String[] args) {

launch(args);

}

}

效果图:

517c0e8e576cd28aef2c8332b06fcecb.png

3. 添加自己的控件

JavaFX允许使用FXML来设计和布局界面,各模块也支持按MVC进行划分,即control(控制层)、 model(模型层)和view(视图层)。

下面按MVC这种模式,分别创建控制层、视图层、和模型层。

首先是控制层:AppUI。

控制层将view(视图层)的控件text通过bindBidirectional将其text属性跟model(模型层)的text属性绑定,这样就可以通过设置model的text来达到改变view的text属性的效果。

public class AppUI implements Initializable {

public Label text;

private AppModel model = new AppModel();

@Override

public void initialize(URL location, ResourceBundle resources) {

text.textProperty().bindBidirectional(model.textProperty());

model.setText("Hello JavaFX.");

}

}

接着是模型层:AppModel

模型层主要的作用是数据载体,在控制层将视图层的控件跟模型层的属性绑定,以达到改变模型就改变视图。(这一点跟Vue有点类似)。

public class AppModel {

private StringProperty text = new SimpleStringProperty();

public String getText() {

return text.get();

}

public StringProperty textProperty() {

return text;

}

public void setText(String text) {

this.text.set(text);

}

}

然后是视图层:AppUI.fxml

视频层采用JavaFX的FXML来布局界面,这里简单的使用BorderPane作为容器,里面只放了一个Label控件。

xmlns:fx="http://javafx.com/fxml/1" fx:controller="com.itqn.gui.javafx.wx.ui.AppUI">

最后,根据层级关系组织JavaFX应用

控件(Label)放在容器(BorderPane)里面,容器放在场景里面,场景放在窗口里面即可。

public class App extends Application {

@Override

public void start(Stage stage) throws Exception {

Parent root = AppUI.load();

Scene scene = new Scene(root);

stage.setTitle("JavaFX Hello World");

stage.setScene(scene);

stage.show();

}

public static void main(String[] args) {

launch(args);

}

}

这样一个最简单的完整JavaFX就开发完了。

dbcba5359b886216234918055192ae1e.png

这里需要注意的是: ,因为fxml跟java代码放在同一个包下面,所以需要在maven的pom.xml配置resources。

src/main/resources

src/main/java

**/*.fxml

=========================================================

源码可关注公众号 “HiIT青年” 发送 “javafx-helloworld” 获取。

关注公众号,阅读更多文章。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值