Java教程

Java桌面应用-JavaFX01-Hello World

本文主要是介绍Java桌面应用-JavaFX01-Hello World,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!

Java桌面应用-JavaFX01-Hello World

JavaFX是基于Java语言强大的图形和多媒体处理工具包集合,它比Swing好用很多,它允许开发使用FXML来设计和布局界面,跟Qt和Android的布局有点类似

1.JavaFX UI层级关系

1.stage(窗口): # 顶层
  2.scene(场景): # 放在窗口内
    3.container(容器): # 放在场景内(布局)
      4.controller(控件): # 放在容器中

2.第一个JavaFX应用

继承Application类,实现start方法

package com.godfrey.javafx;

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

/**
 * @author godfrey
 * @since 2021-10-14
 */
public class App extends Application {
    @Override
    public void start(Stage stage) {
        stage.show();
    }

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

效果图:

image-20211014092050605

3.添加自己的控件

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

控制层:AppUI

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

package com.godfrey.javafx.ui;

import javafx.fxml.Initializable;
import javafx.scene.control.Label;

import java.net.URL;
import java.util.ResourceBundle;

/**
 * @author godfrey
 * @since 2021-10-14
 */
public class AppUI implements Initializable {
    public Label text;
    private AppModel model;

    @Override
    public void initialize(URL location, ResourceBundle resources) {
        text.textProperty().bindBidirectional(model.textProperty());
        model.setText("Hello JavaFX!!!");
    }
}

模型层:AppModel

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

package com.godfrey.javafx.ui;

import javafx.beans.property.SimpleStringProperty;
import javafx.beans.property.StringProperty;

/**
 * @author godfrey
 * @since 2021-10-14
 */
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控件

<?xml version="1.0" encoding="UTF-8"?>

<?import javafx.scene.control.Label?>
<?import javafx.scene.layout.BorderPane?>
<BorderPane prefHeight="400.0" prefWidth="600.0" xmlns="http://javafx.com/javafx/8.0.172-ea"
            xmlns:fx="http://javafx.com/fxml/1" fx:controller="com.godfrey.javafx.ui.AppUI">
    <center>
        <Label fx:id="text" BorderPane.alignment="CENTER"/>
    </center>
</BorderPane>

根据层级关系组织JavaFX应用

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

package com.godfrey.javafx;

import com.godfrey.javafx.ui.AppUI;
import javafx.application.Application;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.stage.Stage;

/**
 * @author godfrey
 * @since 2021-10-14
 */
public class App extends Application {
    @Override
    public void start(Stage stage) {
        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就开发完了

这篇关于Java桌面应用-JavaFX01-Hello World的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!