Java如何使用前端语言编写桌面程序

1. 前期准备

要解析前端语言及渲染DOM元素，我们需要一个浏览器内核的支持；要兼容桌面应用的UI架构，我们需要一个适配的组件来进行渲染。这里我选择了JxBrowser，它提供对Swing、JavaFx等体系的支持；先看看效果：

 

2. 引入Jar

1. 官网地址(JxBrowser | 用于Swing、JavaFX和SWT应用程序的Java网页浏览器 (teamdev.cn))
2. 也可从Github上下载我打包好的（jxbrowserDemo/BrowserUISupport.jar at master · Chrils/jxbrowserDemo · GitHub）

3. 代码编写（Swing）

使用非常简单

第一步，创建Browser实例并组装BrorwseView，BrorwseView是JCompont的子类，可以直接作为组件被容器纳入

Browser browser = new Browser();
JComponent browserView = new BrowserView(browser);
JFrame frame = new JFrame("JxBrowser");
frame.add(browserView, BorderLayout.CENTER);

第二步，选择需要渲染的前端页面即可

这里有多种加载方法

第一种直接加载HTML字符串

browser.loadHTML(htmlStr);

或者加载URL，这里要注意使用的协议（HTTP/FILE等）

String path = PathUtil.getResourceURI()
      .sourceName("index.html")
      .withFileStrategy()
      .build();
String path2 = PathUtil.builder()
      .sourceName("www.baidu.com")
      .withHttpsStrategy()
      .build();
// file:///D:/workspace/java/idea-project/JUI/jxbrowserDemo/target/classes/index.html
System.out.println(path);
// https://www.baidu.com
System.out.println(path2);
browser.loadURL(path);

第三步，内置浏览器与Java App之间的交互;需要解决的问题有两个：

• JS如何调用Java代码？

原理是在window全局对象中设置Java对象的映射，使得可以通过对window中对象方法的调用映射到Java对象的method invoke（注：此处使用反射，需要保证类可见）

browser.addLoadListener((OnFinishLoadListener) event -> {
    if (event.isMainFrame()) {
        JSValue window = browser.executeJavaScriptAndReturnValue("window");
        PropSetter.setCall(window, new PrinterCall()); 
        // 相当于window.asObject().setProperty("PrinterCall", new PrinterCall());
        // PrinterCall可以是任意对象，其中编写需要暴露的方法
    }
});



/**
* PrinterCall Class
*/
public class PrinterCall extends CallJava {

    public void printAnyWay(String msg) {
        System.out.println("msg = " + msg);
    }

}

在JavaScript中，直接调用即可

buttonClicked() {
    console.log("from console halo")
    PrinterCall.printAnyWay("from invoke halo！！！");
}

• Java如何调用JS代码？

使用 browser.executeJavaScript 或 browser.executeJavaScriptAndReturnValue方法执行指定JS代码

browser.executeJavaScript("vueInstance.formDatas.push(9999)");

Demo项目代码（含Jar包）：Chrils/jxbrowserDemo: 在Demo中，将演示如何使用JxBrowser进行桌面应用开发，以及内置浏览器与Java如何交互（基于BxBrowser 6.14） (github.com)

觉得有用的话还请点个Star吧！