晚上想尝试做一个简单的界面,于是乎就有了下面这玩意儿:
![](https://i-blog.csdnimg.cn/blog_migrate/2ee5da7336d60b93f74e97f51f56596a.jpeg)
注意下面的那个“登录”按钮,不是图片,整个界面也只有MSN图片一张图片。
有效代码行数约130lines。
结构。FX2将所有能够看见的东西全部归结为节点,其他所有在面板的组件全是节点的孩子,以后所有关于布局的操作基本上都是在操作节点。
布局。与swing一样,有很多种布局方式(swing里面有绝对布局,我这里暂时没有时间测试那玩意儿),我这里使用的是GridPane。在网格中的组件不像swing那样,默认全部填充,FX中的网格中的组件的大小是与其内容多少而自适应的大小,默认水平对齐方式:左。网格布局中是可以对网格内的对齐方式进行单独操作,用惯了HTML里面table可对每个单元格进行单独设置的方式,再使用FX的网格单元格布局,确实挺麻烦。FX中的操作为,获取单元格中的组件对象,例如Label对象,然后我要将它以水平居右的方式显示在单元格中,这时需要使用到选中对象所处的布局面板的静态布局方法,将节点进行布局。例如:GridPane.setHalignment(b_submit, HPos.CENTER),b_submit对象是上图的登录按钮,现在已经布局到网格中,后面的HPOS从字面意思上可以看出是水平位置,垂直位置是Vpos。
事件。与swing时间一样,同样支持匿名类进行事件赋值。
样式。上一篇日志提到过,FX2支持CSS,这里用大部分组件都用到了CSS,看程序的结构:
![](https://i-blog.csdnimg.cn/blog_migrate/9eaabde2172b61686825b43485aa552e.jpeg)
其中CSS文件就是标准的网页样式表,不过,如果是附在FX2程序中,那必须在所有样式属性前添加“-fx-”的前缀,如图 :
![](https://i-blog.csdnimg.cn/blog_migrate/bafb815a5abe3b3f96c328d2830fb241.jpeg)
当定义好样式文件之后就可以通过“场景——Scene”来加载样式表文件,一个窗口只能够有一个场景,当然,场景是可以切换的。样式表定义的内容也不是万能的,我本来是想在用户名的文本输入框中添加左填充20个像素,结果不管用!如果再添加一个布局面板是可以实现的,不过那样做挺麻烦。
对话框。FX2中是没有独立的对话框,所有的窗口全是使用Stage来实现,现在完全可以将Stage当作Windows来使用,而且在API中,Stage也是继承于javafx.stage.Window,对话框的模式只需要在show之前初始化窗口的模式与指明此对话框的父节点是谁就行。swing中joption在显示中可以指定root为null,FX2里面如果指定root为null则抛出异常。
玻璃窗口。这应该是FX2中最炫的一部分,以前的纯swing做窗体透明那是相当麻烦(不过有DLL做透明的),还涉及到很多的代码重写,做完之后还是伪透明。现在好了只在需要透明的节点中设置透明值就可以实现,如下图:
![](https://i-blog.csdnimg.cn/blog_migrate/2b543323bac0a612dac3decef3f1b9d1.jpeg)
仔细看是能够看出来透明,随便可以移动(下午做透明效果,应为显卡原因导致显示异常)。
看完整的界面:
![](https://i-blog.csdnimg.cn/blog_migrate/ea668f50774189f3618b77da9b8d35a9.jpeg)
页面登录首页
![](https://i-blog.csdnimg.cn/blog_migrate/9d24165c60709d0a3a860c30723a764e.jpeg)
没有正确填写数据
![](https://i-blog.csdnimg.cn/blog_migrate/4494f0d7745433ede827b76d5a667ba6.jpeg)
正确填写之后弹出模式对话框
不过既然是使用运行时环境的RIA,系统项目就不会是简单的CMS一类。
转载于:https://blog.51cto.com/zwkpc/862868