上一章讲了可视化工具JavaFX Scene Builder 2.0的配置和第一个JavaFX项目的新建,链接: Idea从配置到新建第一个JavaFX项目
在编写界面之前,我们来认识一下这个工具
打开JavaFX Scene Builder
- 在我们新建好的JavaFX项目下的Sample包里面默认分别有三个文件,打开扩展名为.fxml的文件(里面的代码是自动生成的)
( 注:如果要想新建一个fxml的文件,可以右击目标包——New——FXML File)
如图所示: - 在右侧界面中右击——Open In SceneBuilder
打开的工具界面如图所示:
使用JavaFX Scene Builder工具
》》在右侧窗口中选择目标容器或者控件然后拖动到中间目标区域即可
要值得注意的就是:
Java界面的布局,不论是AWT还是Swing或者是JavaFX都是一样的,一定要先放置一级容器,然后在一级容器上布放子容器或者控件!!!!
其同PS放置图层是一样的道理,一级的容器可以理解为画布,先有了一层画布,才能在画布上放置其他的层或者是控件,同理,上面的层或控件就会遮盖底层的东西~
常用操作:
1.保存操作,同步更新到项目中的FXML文件:File——Save
2.预览效果:Preview—— Show Preview in Window
认识常用的容器与控件
这是工具菜单
常用容器
Accordion
名称:列表式布局,一个列表下面有一个独立的面板
效果:
AnchorPane
名称:锚布局,可以设置子节点位置,与Pane基本相同(继承Pane)
效果:
BorderPane
名称:边界布局,整体分为上中下左右五个区域
效果:
FlowPane
名称:流式布局,控件只能依次填充,不能随意放置某个位置
效果:
GridPane
名称:网格布局,将整个面板分成多个网格
效果:
HBox
名称:水平的布局,将组件按水平方向依次排列
效果:
Pane
名称:基本布局类,是AnchorPane, BorderPane, FlowPane, GridPane, HBox, StackPane, TilePane, VBox的父类
TabPane
名称:标签面板,通过切换选项卡来切换Pane
效果:
ToolBar
名称:工具面板
效果:
VBox
名称:垂直的布局,将组件按竖直方向依次排列,其它属性与HBox约相同
效果:
—————————————分割线———————————
常用控件
Button
名称:按钮
作用:点击按钮,触发事件
效果如图:
想要点击该按钮执行某个操作就要给他设置触发事件:
选中按钮,在最右侧的Code面板中的On Action中,填写事件方法名,就能实现单击按钮执行该事件方法
CheckBox
名称:复选框
作用:提供给用户,后台获取值
补充:判断某复选框是否被选中:复选框id.isSelected();
效果如图:
ChoiceBox
名称:下拉列表框
作用:提供给用户,后台获取值
效果如图:
ColorPicker
名称:颜色选择框
作用:提供给用户,后台获取值
效果如图:
ComboBox
名称:下拉列表复选框
作用:提供给用户,后台获取值
DatePicker
名称:日期选择框
作用:提供给用户,后台获取值
效果如图:
ImageView
名称:图片展示框
作用:载入图片并显示
效果如图:
Label
名称:标签
作用:提示文字
效果如图:
MenuBar
名称:选项卡
作用:通过点击选项卡的下拉菜单来执行事件方法
下拉默认包含三个Menu:File,Edit,Help,File下面默认包含一个MenuItem,如图
Menu和MenuItem在Menu的工具菜单下,Menu只能创建在MenuBar内,MenuItem只能创建在Menu内!!!
效果如图:
ProgressBar
名称:进度条
作用:显示进度
效果如图:
ProgressIndicator
名称:进度圈
作用:显示进度
效果如图:
RadioButton
名称:单选按钮
作用:通过给用户,获取单选值
效果如图:
注意:多个单选按钮必须设置为同一组,因为同组的单选按钮只能有一个处于被选状态,因此来实现单选
PasswordField
名称:密码框
作用:用于接收密码,所输入的字符会处于密文模式
补充:获取密码:密码框id.getText();
效果如图:
TableView
名称:表格域
作用:用于显示表
效果如图:
TextArea
名称:文本域
作用:用于输入不确定字数(字数较多)的文本
补充:获取文本:文本框id.getText();
效果如图:
TextFiled
名称:文本框
作用:用于输入字数较少文本
补充:获取文本:文本框id.getText();
效果如图: