前言

Scene Builder作为一款Java拖拽式页面设计编码工具，具有强大的拖拽设计能力，对于一些入门以及需要快速响应页面编码的情况，该工具的效果绝对令人满意。同时该工具也存在着这类软件的通病，样式都不是怎么好看，自动生成的结构语言不够理想。因此大家不要过于依赖该工具，需要更加清晰理解fxml语言的魅力

一、使用方式

1.IDEA插件“Scene Builder”

首先，idea下载插件javaFx，安装完插件后fxml可以被识别为可识别文件，且支持fxml相关的语义操作。

同时，该插件还支持内嵌Scene Builder，实时查看fxml效果以及通过Scene Builder拖拽式自动生成fxml结构语言。
此时不能够调用controller控制器，因此只能看到页面布局，功能无效。

左侧“Text”展示fxml文件编辑页面，右侧“Scene Builder”预览页面。
注意：该插件与idea兼容性存在很大的问题，作者目前发现，在社区版idea中都会是乱码，目前没有找到解决方法。然而在正式版本中该插件的显示正常，无乱码。有解决方法的同学可以留言。目前只能归结于，电脑字体不全、idea字体不全两种情况。

2.Javafx Scene Builder桌面软件

第二种方式主要是通过下载avafx Scene Builder2.0安装在本地，通过软件打开fxml文件进行编辑。

下载地址：https://www.oracle.com/java/technologies/javafxscenebuilder-1x-archive-downloads.html
大家可以根据系统要求，选择要下载的版本类型。由于该软件的使用基于Java语言，因此优先检查一下本地是否有Java安装环境，然后安装该软件。

二、使用步骤

1.模块介绍

主要分为四个区域元素对象选择区（元素库）、预览展示区、控件属性区域、层次结构区。

元素库主要包含：容器、控件、菜单、混合组合、图形形状、图表。在日常使用过程中，容器、控件、菜单就能满足我们绝大部分的需求。其次是图形和图标，然而混合类别使用较少，在一些切换按钮、单选等组合控件中可能会使用到。

属性区域主要包含三部分：元素属性、元素布局、元素动作。

层次结构区域能够清晰的展示容器之间的关系，以及容器与控件之间的父子关系。能够让设计者清楚的找到某一控件的位置，以方便修改。

2.基本操作步骤

1.根据需求在容器中选择合适的面板，例如：GridPane,鼠标拖拽至预览区域，可以根据需要修改属性，是否显示网格线。

2.在其每个表格中拖拽入相应的控件

3.点击保存，自动生成fxml文件

<?xml version="1.0" encoding="UTF-8"?><?import javafx.geometry.*?>
<?import javafx.scene.control.*?>
<?import java.lang.*?>
<?import javafx.scene.layout.*?><GridPane alignment="CENTER" gridLinesVisible="true" maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="142.0" prefWidth="529.0" xmlns:fx="http://javafx.com/fxml/1" xmlns="http://javafx.com/javafx/8"><columnConstraints><ColumnConstraints hgrow="SOMETIMES" maxWidth="296.0" minWidth="10.0" prefWidth="57.0" /><ColumnConstraints hgrow="SOMETIMES" maxWidth="500.0" minWidth="10.0" prefWidth="468.0" /></columnConstraints><rowConstraints><RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" /><RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" /><RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" /></rowConstraints><children><Label text="用户名:" textAlignment="CENTER" /><Label text="密    码:" textAlignment="CENTER" GridPane.rowIndex="1" /><TextField promptText="请输入您的姓名" GridPane.columnIndex="1" /><PasswordField promptText="请输入您的密码" GridPane.columnIndex="1" GridPane.rowIndex="1" /><Button mnemonicParsing="false" text="清除" GridPane.columnIndex="1" GridPane.rowIndex="2" /><Button contentDisplay="CENTER" mnemonicParsing="false" text="登录" textOverrun="CLIP" GridPane.columnIndex="1" GridPane.rowIndex="2"><GridPane.margin><Insets left="100.0" right="50.0" /></GridPane.margin></Button></children>
</GridPane>

4.在软件中属性约束比较多，因此更多的属性可以直接在fxm文件中添加修改

总结

工具的使用比较简单，完成较为简单测试工具b比较轻松，但是如果要设计比较复杂且美观性这比较高的要求时，使用拖拽不能完美呈现效果，还得依赖css的支持。工具也只能完成基本控件层次结构的搭建。

Javafx Scene Builder使用教程相关推荐

安装JavaFX Scene Builder 到Eclipse
JavaFX Scene Builder是一种可视布局工具,允许用户快速设计JavaFX应用程序用户界面,而无需编码.用户可以将UI组件拖放到工作区,修改其属性,应用样式表,并且它们正在创建的布局的F ...
JavaFX Scene Builder 2.0 + IDEA 制作客户端界面
主要内容 JavaFX Scene Builder 2.0 的下载和 IDEA的配置界面生成步骤 JavaFX Scene Builder 2.0 的下载和 IDEA的配置见此篇文章: JavaF ...
使用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类文 ...
Javafx可视化、拖拽式界面设计之Scene Builder的安装和使用
系列文章专栏:javafx图形绘制.桌面录屏录音源码合集目录一.安装Scene Builder 二.Scene Builder功能介绍三.Scene Builder的使用相信使用java开发桌 ...

Javafx Scene Builder使用教程

文章目录

前言