javaFx 教你五分钟写个工具

admin 2022年2月22日22:17:51评论144 views字数 2702阅读9分0秒阅读模式

本章内容为javafx gui教程的第一节,会陆续更新文章。


序言

先大致说下 java gui的历史发展吧


在jdk 1.0的时候 sun公司提供了gui类,也就是awt 到现在有十多年的历史了,也是很老的技术,随后又出了 swing 技术,awt 和 swing 的方法 都可以混合使用。

使用两个技术开发一个图形化的工具 也不是很难,主要是拼接 一些组件,如按钮,文本,下拉框等等。但如果开发一款比较美观的界面,需要设置一些数值,如大小,x,y 距离,组件都是方形,稍微圆角处理就不支持,或者自己写一个方法。难度稍微大。

前后走了坑,先学的 awt 学到了一般有了解了swing,又学到了一半,又发现了javafx技术。学了半个月 (好气啊) 技术比较老了,在学也用不到,毕竟学学gui ,开发个小工具也能提升技能,找工作也会加分。


javafx 就比较牛逼了,组件自带圆角,感觉界面瞬间提升了一个档次。

javafx 不需要写很多的代码,会有一个特定的文件 直接拖组件 就可以完成框架,自己再写点逻辑代码就可以了。

javafx 在jdk8里默认自带了,如果是高版本的 需要去官网额外下载依赖。


在开发工具之前,需要有一些环境

jdk 1.8编辑器(IDEA)SceneBuilder   https://www.oracle.com/java/technologies/javafxscenebuilder-1x-archive-downloads.html

javaFx 教你五分钟写个工具


安装后,IDE创建一个javafx项目


file  ->  new  -> project


javaFx 教你五分钟写个工具


javaFx 教你五分钟写个工具


存放位置 然后完成后 就会创建三个文件

javaFx 教你五分钟写个工具

Controller  控制器 存在代码用的 如按钮 监听事件 文本处理等等 (可删)Main        主程序 启动项目的代码sample.fxml 使用SceneBuilder配置的文件 等会会用到
控制器代码是空的
package sample;
public class Controller {}

Main方法package sample;
import javafx.application.Application;import javafx.fxml.FXMLLoader;import javafx.scene.Parent;import javafx.scene.Scene;import javafx.stage.Stage;
public class Main extends Application {    // 继承Application  需要重写方法 @Override    // 创建一个 舞台 可以理解为程序的界面 public void start(Stage primaryStage) throws Exception{ // 类加载器 加载当前的fxml文件 Parent root = FXMLLoader.load(getClass().getResource("sample.fxml"));        // 设置一个title primaryStage.setTitle("Hello World");        // 设置一个窗口大小 primaryStage.setScene(new Scene(root, 300, 275)); // 展示窗口 primaryStage.show(); }

public static void main(String[] args) {        // 运行程序 launch(args); }}



配置SceneBuilder 

打开设置 setting  搜索框输入 javafx  有个路径 选择安装后的exe 就🆗了

javaFx 教你五分钟写个工具


选择fxml文件 就会显示了  有两种方式可以打开

第一个:选择文件 右键  最下面  open in SceneBuilder

第二个:最下面 Text 旁边 有个SceneBuilder  

javaFx 教你五分钟写个工具

第一种

javaFx 教你五分钟写个工具

第二种

javaFx 教你五分钟写个工具


第二种方便,后面有些功能很牛逼。


布局

打开SceneBuilder 后 左边都是一些组件,背景布局,按钮,文本框,标签等。

javaFx 教你五分钟写个工具


先添加一个背景布局  

javaFx 教你五分钟写个工具

添加两个按钮 和两个文本域

javaFx 教你五分钟写个工具

javaFx 教你五分钟写个工具


给按给文本域添加id值


解释下 id值是啥这个id值 对应 fxml里的属性值  也是一个变量,我在fxml里设置一个id 为test 属性那么我需要对这个按钮做处理,我就要在控制器里找到这个属性 给这个属性设置代码逻辑有点绕 没事 往下看

javaFx 教你五分钟写个工具

fx:controller  这个就是一个属性 对应的变量是 sample包下的controller这个类 那接下来的操作和代码就要在这个类里进行编写如果还不懂 再往下看

给按钮设置文字

javaFx 教你五分钟写个工具

 


按钮添加监听,当我点击这个按钮的时候 我希望他能有个动作,比如打印hello,或者执行cmd命令 之类的。


选择鼠标监听事件,当我点击鼠标 就会触发这个事件

javaFx 教你五分钟写个工具

javaFx 教你五分钟写个工具


给文本添加id值  为什么要给文本添加 因为在文本里输入数据,需要获取文本里的数据进行处理 如 文本.方法();

javaFx 教你五分钟写个工具

javaFx 教你五分钟写个工具


保存后 咱们就可以测试框架了。


点击上面的 preview  show preview  in windows 就可以看到界面了

javaFx 教你五分钟写个工具


查看我的代码发现 还是空的,这个时候 打开上面的 view  最后一个 show sample controller  他自动把代码写好了  

细心发现,刚才写的两个属性 变成了 私有变量,两个监听事件变成了 两个方法

javaFx 教你五分钟写个工具


现在 图形好了,代码也好了,我想让他实现个功能,加密解密base数据,怎么办,在对应的方法里,写代码。


网上的base64 网站  左边放进密文,右边出来了明文,右边放进密文,左边出现明文。按照这个逻辑 去写代码。

javaFx 教你五分钟写个工具


先把刚才的代码复制到idea里

javaFx 教你五分钟写个工具


在encryption 写加密的代码

// 文本1 使用gettext方法 获取输入的数据String text = text1.getText();// new 一个加密类BASE64Encoder encoder = new BASE64Encoder();// 调用加密的方法String data = encoder.encode(text.getBytes());// 加密后的数据 显示在文本2里text2.setText(new String(data));


另一个写解密的代码


// 获取数据String text = text2.getText();// new 一个解密类BASE64Decoder decoder = new BASE64Decoder();// 调用解密方法byte[] bytes = decoder.decodeBuffer(text);// 把数据显示在文本1里text1.setText(new String(bytes));

javaFx 教你五分钟写个工具


打开主类 运行代码

javaFx 教你五分钟写个工具


ok 大功告成  拜  

原文始发于微信公众号(轩公子谈技术):javaFx 教你五分钟写个工具

  • 左青龙
  • 微信扫一扫
  • weinxin
  • 右白虎
  • 微信扫一扫
  • weinxin
admin
  • 本文由 发表于 2022年2月22日22:17:51
  • 转载请保留本文链接(CN-SEC中文网:感谢原作者辛苦付出):
                   javaFx 教你五分钟写个工具http://cn-sec.com/archives/798307.html

发表评论

匿名网友 填写信息