欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

Java开发桌面程序学习(二)————fxml布局与控件学习

程序员文章站 2022-05-15 12:30:01
JavaFx项目 新建完项目,我们的项目有三个文件 Main.java 程序入口类,载入界面并显示 Controller.java 事件处理,与fxml绑定 Sample.fxml 界面 sample.fxml需要通过标签 定义对应的controller 专业术语 舞台(Stage),场景(Scen ......

javafx项目

新建完项目,我们的项目有三个文件
Java开发桌面程序学习(二)————fxml布局与控件学习

  • main.java 程序入口类,载入界面并显示
  • controller.java 事件处理,与fxml绑定
  • sample.fxml 界面

sample.fxml需要通过标签fx:controller定义对应的controller

<!-- 最外层的那个布局使用fx:controller属性即可 -->
<flowpane fx:controller="sample.controller" ..>
</flowpane>

专业术语

舞台(stage),场景(scene),容器(container),布局(layout )和控件(controls)之间的关系
Java开发桌面程序学习(二)————fxml布局与控件学习

常用容器(布局)container

可以把容器和布局统一成一个概念

  • vbox
    相当于垂直方向linearlayout
  • hbox
    相当于垂直方向的linearlayout
  • flowpanel
    相当于linearlayout,方向可以定义水平或者垂直,设置水平方向,第一行排满之后,会自动换行排列,设置垂直方向,第一列排满之后,会自动换下一列
  • borderpane
    上中下左右五个部分
  • anchorpane
    相当于android里面的约束布局,比如让某个控件离右边100px,离下边100px
  • scrollpane 滑动的布局

常用控件(control)

默认的为原生的,jfx前缀则是jfoenix里面的

文本

  • label
  • jfxpasswordfield 密码框
  • jfxtextfield 单行输入框
  • jfxtextarea 多行输入框

按钮

  • jfxbutton

选择框

  • jfxcheckbox
  • jfxradiobutton
  • menubutton 下拉选择

图片

  • imageview

进度条

  • jfxprocessbar
  • jfxslider 水平调节,类似按下音量键出现横线
  • jfxspinner 圆圈进度条

开关

  • jfxtogglebutton

列表

  • jfxlistview

菜单

  • menubar 自带有鼠标滑过变色,就像scenebuilder的菜单栏
  • menu
  • menuitem
  • radiomenuitem 点击之后前面会有√,一列菜单可以有多个,但是只能选择一个radiomenuitem,radiomenuitem之间是互斥的,需要使用togglegroup分为同一组
  • checkmenuitem 多选,一列菜单有多个,也可以选多个

    togglegroup togglegroup = new togglegroup();
    
    radiomenuitem radioitem1 = new radiomenuitem("option 1");
    radioitem.setonaction(new eventhandler<actionevent>() {
        @override public void handle(actionevent e) {
            system.out.println("radio toggled");
        }
    });
    radioitem1.settogglegroup(togglegroup);
    radiomenuitem radioitem2 = new radiomenuitem("option 2");
    radioitem.setonaction(new eventhandler<actionevent>() {
        @override public void handle(actionevent e) {
            system.out.println("radio toggled");
        }
    });
    radioitem2.settogglegroup(togglegroup);
  • separatormenuitem 分割线
    前面需要在添加到menubar里面才能使用
  • spiltmenubutton 左边是某个按钮,右边是一个下拉箭头,点击左边,就会实现按钮操作,点击右边,在出现的列表中选择某一项,就可以改变左边按钮

使用scenebuilder生成fxml布局

由于现有的工具不多,只有个界面化的工具,所以就不过多去研究fxml代码部分了。

我们还是弄个用户登录界面上手吧,使用scenebuilder弄成以下布局
Java开发桌面程序学习(二)————fxml布局与控件学习

这是我做的界面大体框架,当然,也可以不一样,实现的方法有很多种
Java开发桌面程序学习(二)————fxml布局与控件学习

主界面里的控件居中显示,相当于android的布局的gravity属性,设置子布局或者控件的显示
Java开发桌面程序学习(二)————fxml布局与控件学习

输入框设置提示文字,居中显示
Java开发桌面程序学习(二)————fxml布局与控件学习

输入框间距
Java开发桌面程序学习(二)————fxml布局与控件学习

下面的两个button间距设置同上,设置左边那个注册按钮的右边距即可

获取控件实例和控件事件处理

这里,我们给我们需要的控件设置id即可通过id来找到该实例,从而调用实例对象的set方法设置内容或者是get方法获取内容

事件处理的话,我们只需要定义一个方法名,之后再去controller.java文件实现相关的逻辑
Java开发桌面程序学习(二)————fxml布局与控件学习

之前我们使用了属性fx:controller已经让sample.fxml和controller进行绑定了,我们可以直接让scenebuilder生成controller的代码

Java开发桌面程序学习(二)————fxml布局与控件学习

Java开发桌面程序学习(二)————fxml布局与控件学习

点击登录,提示一个对话框

//这里,jfoenix开发团队没有考虑到对话框的创建是要点击之后生成的,demo直接是在main.java文件里面写的
//我是在issue那里找到了一位外国开发者,直接在controller里面创建对话框显示
//我稍微折腾一下,准备弄个想android那样,对话框可以由一行代码生成,这里就暂时使用外国开发者代码凑合凑合
//使用的话,如果stage的宽度不长,对话框显示会不完全,得在main.java中设置一下
final jfxalert<string> alert = new jfxalert<>((stage) tfpassword.getscene().getwindow());
alert.initmodality(modality.application_modal);
alert.setoverlayclose(false);

// create the content of the jfxalert with jfxdialoglayout
jfxdialoglayout layout = new jfxdialoglayout();
layout.setheading(new label("enter username"));
layout.setbody(new vbox(new label("please enter the username of the person you would like to add.")));

// buttons get added into the actions section of the layout.
jfxbutton addbutton = new jfxbutton("add");
addbutton.setbuttontype(jfxbutton.buttontype.flat);
addbutton.setonaction(new eventhandler<actionevent>() {
    public void handle(actionevent addevent) {
        // when the button is clicked, we set the result accordingly
        alert.setresult("hello");
        alert.hidewithanimation();
    }
});

jfxbutton cancelbutton = new jfxbutton("cancel");
cancelbutton.setcancelbutton(true);
cancelbutton.setonaction(new eventhandler<actionevent>() {
    public void handle(actionevent closeevent) {
        alert.hidewithanimation();
    }
});

layout.setactions(addbutton, cancelbutton);
alert.setcontent(layout);

alert.showandwait();

测试

Java开发桌面程序学习(二)————fxml布局与控件学习