JavaFX Scene Builder 2.0 的下载和 IDEA的配置

见此篇文章：

JavaFX SB的下载和配置

界面生成步骤

我们就以上一篇文章的遍历问题的实现效果为例来生成界面，实现效果如下图：

先创建一个JavaFX项目： File -> new ->project；

新建完之后就是这个样子：

我们可以看到，idea自动生成了三个文件：controller.java、main.java、sample.fxml，这三个文件的用处我们留到后面介绍，下面我们运行一下这个刚生成的JavaFX项目：

就会出来这样空白的效果，下面我们调整一下界面的标题和大小：
在main.java中，修改：

        primaryStage.setTitle("遍历问题");primaryStage.setScene(new Scene(root, 550, 500));

在IDEA中打开JavaFX Scene Builder：鼠标右击sample.fxml -> open in scene builder

我们将原来的grid pane删掉，换为anchor pane:
下面我们将之前找好的水壶图片导入到面板上：

导入后，再将图片大小进行调整，同时将面板大小进行调整：

再通过text组件，在图片
遍历过程的显示时通过textarea来实现的，我们在左上角的library里找到textarea，并调整大小：
再添加文字text 以及按钮 button：

到目前为止，我们的界面已经生成完成了，下面我们对后台逻辑进行编程：controller.java。

import javafx.event.ActionEvent;
import javafx.fxml.FXML;
import javafx.fxml.Initializable;
import javafx.scene.control.TextArea;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import java.io.File;
import java.net.URL;
import java.util.ResourceBundle;public class Controller implements Initializable {@FXMLprivate ImageView imView1;@FXMLprivate ImageView imView2;@FXMLprivate ImageView imView3;public TextArea TA = new TextArea();String address = "H:\\算法设计与分析\\课程设计\\code\\A4FX\\水壶.jpg";public void initialize(URL location, ResourceBundle resources){File file = new File(address);Image image = new Image(file.toURI().toString());imView1.setImage(image);imView2.setImage(image);imView3.setImage(image);}public void Button_Click(ActionEvent actionEvent){System.out.println("Button Click!");TA.setText("\t8\t\t\t\t\t0\t\t\t\t\t0\n" +"\t3\t\t\t\t\t5\t\t\t\t\t0\n" +"\t5\t\t\t\t\t0\t\t\t\t\t3\n" +"\t6\t\t\t\t\t2\t\t\t\t\t0\n" +"\t6\t\t\t\t\t0\t\t\t\t\t2\n" +"\t1\t\t\t\t\t5\t\t\t\t\t2\n" +"\t1\t\t\t\t\t4\t\t\t\t\t3\n");try{Thread.sleep(5000);}catch (InterruptedException ex){}}
}

 private ImageView imView1;

每个定义要和每个image的fxid对应起来

点击button的action 也要和controller里的方法对应起来

 public void Button_Click(ActionEvent actionEvent){System.out.println("Button Click!");TA.setText("\t8\t\t\t\t\t0\t\t\t\t\t0\n" +"\t3\t\t\t\t\t5\t\t\t\t\t0\n" +"\t5\t\t\t\t\t0\t\t\t\t\t3\n" +"\t6\t\t\t\t\t2\t\t\t\t\t0\n" +"\t6\t\t\t\t\t0\t\t\t\t\t2\n" +"\t1\t\t\t\t\t5\t\t\t\t\t2\n" +"\t1\t\t\t\t\t4\t\t\t\t\t3\n");try{Thread.sleep(5000);}catch (InterruptedException ex){}}

最后在sample.fxml后面加上：fx:controller="sample.Controller"

JavaFX Scene Builder 2.0 + IDEA 制作客户端界面相关推荐

安装JavaFX Scene Builder 到Eclipse
JavaFX Scene Builder是一种可视布局工具,允许用户快速设计JavaFX应用程序用户界面,而无需编码.用户可以将UI组件拖放到工作区,修改其属性,应用样式表,并且它们正在创建的布局的F ...
使用eclipse和JavaFX Scene Builder进行快速构建JavaFX应用程序
了解过JavaFX的都知道,JavaFX自从2.0版本开始,已经完全抛弃了之前的script语言,才用纯java来实现.这样的好处就是1.让使用Java的IDE进行JavaFX的开发成为可能,2.Ja ...
java fx scene builder_JavaFX开发工具之JavaFX Scene Builder
JavaFX Scene Builder是Oracle推出的JavaFX的可视化开发工具.下面就介绍一下今天的主角. 打开后的样子整体可以分为三个区域:左边部分.中间部分.右边部分.(这不废话吗) ...
如何实现场景切换的java_JavaFX + Scene Builder如何切换场景(JavaFX + Scene Builder how switch scene)...
问题我正在使用javafx和scenebuilder,并希望在eclipse中为自己创建一个名为"taskplanner"的本地应用程序. 我创建了一个新的舞台并设置了它场景( ...
【收藏】IntelliJ Idea中配置JavaFX Scene Builder
https://www.cnblogs.com/shiliye/p/12952545.html
JavaFx-桌面应用开发利器（三）FXML和Scene Builder
本文接上文JavaFx-桌面应用开发利器(二)基础架构篇,在熟悉了JavaFx的基础框架后,通过基础的学习示例.相信你对基础的Stage和Scene对象等都有了一定的基础认识.在学习的时候,建议各位都 ...
IDEA中使用scene builder
一.什么是JavaFX Scene Builder? JavaFX Scene Builder是一种可视布局工具,允许用户快速设计JavaFX应用程序用户界面,而无需编码.用户可以将UI组件拖放到工作 ...
JavaFX之Scene Builder的使用（开发一款GUI小工具原来这么简单）
文章目录一.前言二.JavaFX与Scene Builder下载三.Scene Builder的使用四.详细教学(示例) 4.1 环境配置 4.2 创建fxml文件以及Controller类文 ...
005.Python制作客户端截屏通过合宙ESP32-C3投屏到0.96OLED
Python制作客户端截屏通过ESP32-C3投屏到0.96'OLED 一.实现原理 Python对屏幕进行截屏,并进行数据处理 Python与ESP32-C3通过WIFI建立tcp连接 Python ...

JavaFX Scene Builder 2.0 + IDEA 制作客户端界面

主要内容

JavaFX Scene Builder 2.0 的下载和 IDEA的配置

界面生成步骤

JavaFX Scene Builder 2.0 + IDEA 制作客户端界面相关推荐

最新文章

热门文章