Jigloo的简单使用.doc

Jigloo的简单使用(转载) 有了Jigloo，原来我们可以像用VB一样在eclipse中进行图形界面设计了!1. 初识 Jigloo首先我们要如上所示新建一个名为 jiglooSwing 的 Java 工程:选择菜单 File - New - Project., 然后选择在第一个分类中选择 Java Project, 点击 Next, 然后输入 jiglooSwing, 点击Finish按钮. 然后请复制下列代码到剪贴板然后在 MyProject 的 src 目录上点击右键, 选择Paste, 这样这个转换类就出现在了工程中:public class Converter public static String doConvert(String input) return input + is converted.; 然后我们选择菜单 File - New - Other., 在所出现的 New 对话框中打开分类 GUI Forms - Swing, 选中 JFrame, 如下图所示:在接下来的向导对话框中保持默认的输入值不变, 然后删除 src 这个包名即可:接着将会自动用 Jigloo 界面设计器打开新生成的文件, 显示如下:在 Outline(大纲) 页面中显示如下内容:(1) 按钮切换是否显示栅格;(2) 按钮弹出一个窗口预览当前设计界面(不经过编译);(3) 按钮编译并运行生成的代码;(4) 按钮启动/停止分析代码改动(由代码生成设计界面);(5) 按钮切换是否显示继承的组件;(6) 按钮切换界面从 SWT 到 Swing 或者反向转换(注意会有代码错误出现, 并非 100% 准确);(7) 列出了界面中的组件层次大纲, 单击可以选中相应的组件.在编辑器页面中显示如下内容:(8) 正在设计中的界面, 点击红色控制(handle)点并拖拉可以调整组件的大小, 位置;(9) SWT/Swing 组件选择面板, 单击一个组件, 然后再单击一次(8), 即可将组件放到界面中, 同样也可以继续调节大小,位置;(12) 显示的是代码视图, 这是生成的代码, 也可以再下面修改代码, 完毕后上面将会重新解析绘制设计中的界面;在 GUI Properties 页面中显示如下内容:(10) 按钮切换属性列表显示为拖拉面板(SashForm)或者多页面板(TabbedPane);(11) 属性列表, 依次为: 属性(Properties), 布局(Layout), 事件(Event).2. 拖拉快速搭建界面 拖放, 预览. 首先我们在(7)中选择 this - JFrame, Border , 然后在(11)中选择 Layout 面板, 点击树节点 Layout(*), 在右侧下拉列表框中选择其值为 Absolute( 绝对布局).我们选择这个布局主要是为了快速开发的关系, 虽然这不是一个很好的选择. 详细信息可以自行浏览 Swing 开发相关的资料.好了, 接下来在(9)中选择面板 Components, 然后点击两次 JTextField 控件, 放到设计面板上, 拖拉使其不要重叠并放置在合适的位置上, 这两个组件按照默认值即可, 分别为 jTextField1, jTextField2.最后我们把一个 JButton 添加上去, 在添加对话框中修改 Text 值为 OK.拖放各个组件来布局到合适的大小和位置, 如下图所示: 这时候可以点击工具栏按钮 (2) 或者 (3) 预览设计成的界面. Jigloo 已经帮你写好了大部分的代码, 因此无需担心界面无法显示.3. 加入事件响应代码 首先点击一下界面上的 OK 按钮, 然后选择(11)中的 Event 面板, 然后展开ActionListener , 单击 actionPerformed 节点右侧的not handled 下拉框, 然后选择 handler method, 这样将会生成一个点击 OK 后触发的事件调用方法, 如下图所示:接着编辑器中的鼠标将会定位到刚才生成的事件方法中, 默认生成的代码如下所示:private void jButton1ActionPerformed(ActionEvent evt) System.out.println(jButton1.actionPerformed, event= + evt); /TODO add your code for jButton1.actionPerformed 我们在 TODO 后面加入下列代码即可完成我们所需要的功能了:jTextField2.setText(Converter.doConvert(jTextField1.getText();这段代码将会设置文本框2中的文本内容为先前编写的转换代码所处理过的内容, 输入的内容是 jTextField1 中显示的文本. 相当于调用如下一段代码:String input = jTextField1.getText();String output = Converter.doConvert(input);jTextField2.setText(output);setText(String) 和 getText() 方法分别对组件显示的文本内容进行读写操作.4. 测试点击 (3) 按钮,运行, 修改 jTextField1 中的值, 然后点击 OK 按钮, 可以看到运行结果正常. 如下图所示:三. 打包发布应用 1. 目录布局以及复制依赖文件 我们这个项目不依赖任何第三方包, 最后的文件目录结构如下示:jiglooSwingclassessrc2. 编写启动脚本在根目录下编写 运行.bat, 内容如下所示:java -cp classes NewJFrame双击运行此批处理文件可以看到主窗口.四. FAQ 欢迎提问, 并来 Wiki 留言交流.一些常见小问题.Q: 我编辑下面的代码后发现 GUI Properties 面板和组件层次大纲消失了?A: 点击一下界面设计器中的按钮后 GUI Properties 面板将会再次出现.Q: 我想给窗口设置一个标题, 并且给两个文本框设置默认的值为空, 怎么办?A: 修改 Properties 属性中的 text 即可, 文本框的可以先在界面设计器中选中组件, 然后在GUI属性页修改即可. 主窗口的稍微复杂一点, 如下图所示需要先选中 JFrame, 然后再修改:Q: 我想使用多行文本编辑器(TextArea), 而文中的例子是单行文本框, 怎么办?A: 将这段操作改为 接下来在(9)中选择面板 Components, 然后点击两次 JTextArea 控件, 放到设计面板上, 拖拉使其不要重叠并放置在合适的位置上, 这两个组件按照默认值即可, 分别为 jTextArea1, jTextArea2. 如果发现放 jTextArea2 的时候无法添加上去, 请把它放到 Outline 中的 (7) 的 this - JFrame, Absolute 即可.同时事件处理代码根据变量名的改动修改为如下代码:jTextArea2.setText(Converter.doConvert(jTextArea1.getText();Q: 发现关闭 Eclipse 再打开刚才设计的代码的时候没有出现 Jigloo 界面设计器, 我如何才能打开它进行编辑?A: 有时候 Eclipse 不能记住上次打开某文件的时候所用的编辑器, 因此首先确