跳至主要内容

webforJ 可视化编辑器

看看你的 Java 构建出的应用 运行时更改它。

craftforJ 在开发模式下运行于你的应用中。它会显示代码创建的组件树,让你实时修改属性,并将保留的更改写回创建这些组件的 Java 文件。

四个快捷键覆盖整个循环

  • 打开或关闭AltShiftD
  • 选择一个组件AltShiftC
  • 审查更改Cmd/CtrlS
  • 撤销更改Cmd/CtrlZ
在运行中的应用中打开 craftforJ,组件树中已选中 AppNav,侧边栏显示其属性。

工作原理

它会读取你的应用 通过 webforJ 本身

这就是它按照你编写应用时使用的术语来描述应用的原因。树中列出你的组件,属性是组件声明的属性,路由是路由器注册的路由,并附带你为其标注的访问规则。

  1. 01

    打开

    在应用中点击触发按钮,或在任意位置按 Alt+Shift+D。

  2. 02

    选择

    按 Alt+Shift+C,将鼠标悬停在组件上并点击。树形视图会选中该组件,侧边栏会显示其属性。

  3. 03

    更改

    编辑属性。运行中的应用会立即更新,文件不会被修改。

  4. 04

    保留

    以 diff 形式审查更改,并将其应用到生成该更改的 Java 文件中。

面板导览

这些面板, 在真实应用上

视频
1/2

由 Java 构建的组件树

检查器列出的是你的组件,而不是浏览器渲染的标记。Composite 会显示为你编写的类,并按 webforJ 中的顺序包含其子组件。

  • 按 Alt+Shift+C,然后点击页面中的任意元素,即可在树状结构中选中它。
  • 在侧边栏更改属性,运行中的应用会立即更新。
  • 追踪组件并定位创建它的 Java 代码行。

返回来源

它编辑 Java, 不是它的副本

在包含“保存”和“取消”按钮的表单中,选择“保存”,在树中右键单击它,然后选择“从源代码中移除”。其声明、主题、侦听器、add() 调用中的位置,以及其他地方未使用的 ButtonTheme 导入都会被移除。“取消”按钮则会保留。

之前

ContactFormView.java
import com.webforj.component.button.Button;
import com.webforj.component.button.ButtonTheme;
import com.webforj.component.layout.flexlayout.FlexLayout;

public class ContactFormView {
public ContactFormView(FlexLayout layout) {
layout.setSpacing("1em");
Button save = new Button("Save");
save.setTheme(ButtonTheme.PRIMARY);
save.onClick(event -> {
save.setEnabled(false);
});
Button cancel = new Button("Cancel");
layout.add(save, cancel);
}
}

从源中移除后

ContactFormView.java
import com.webforj.component.button.Button;
import com.webforj.component.layout.flexlayout.FlexLayout;

public class ContactFormView {
public ContactFormView(FlexLayout layout) {
layout.setSpacing("1em");
Button cancel = new Button("Cancel");
layout.add(cancel);
}
}
  • 两项设置均为必填

    craftforJ 需要 webforj.debug 和 webforj.devtools.craftforj.enabled。两者单独启用均无效。

  • 默认本地访问

    在 hosts-allowed 中指定其他机器之前,只有运行该应用的机器上的浏览器可以访问它。

  • 未增加 HTTP 暴露面

    它不会添加任何端点、Servlet 或过滤器,而是通过应用已有的连接工作。

  • 只写能编译通过的代码

    只有在结果仍可编译时,才会写入源代码移除记录;文件绝不会被删除。

入门

打开它 分三步

craftforJ 已随 webforJ 一同提供,无需单独下载。使用 startforJ 或 webforJ 原型创建的项目默认已启用。运行应用,直接进入第三步。

  1. 1

    添加依赖项

    如果项目中尚未添加,请将 webforj-devtools 添加到项目中。

    pom.xml
    <dependency>
    <groupId>com.webforj</groupId>
    <artifactId>webforj-devtools</artifactId>
    <version>${webforj.version}</version>
    </dependency>
  2. 2

    启用调试模式和 craftforJ

    在 webforj.conf 中设置这两个属性;Spring 项目则在 application.properties 中设置。只有同时启用这两个属性,craftforJ 才能正常工作。

    webforj.debug = true
    webforj.devtools.craftforj.enabled = true
  3. 3

    重新启动、重新加载并打开它

    在运行该应用的机器上打开应用。应用上方会出现一个触发按钮。点击它,或在应用内任意位置按下 AltShiftD。再次按下相同快捷键即可关闭 craftforJ。

    craftforJ 停靠在应用页面右侧边缘
    craftforJ 默认悬浮在应用上方。将其拖到边缘即可停靠,或将其移至独立的浏览器窗口或标签页,以便在第二台显示器上使用。