版权声明：请留下你的小脚印 https://blog.csdn.net/qq_33547169/article/details/86574467
场景:想折腾一下java gui ,发现它的布局很不好玩,就想着在gui中能不能展示html页面,然后搜了一下,发现了javaFX
- java FX 中文文档
- 在web应用的开发中,前端和后端的消息,可以简单的理解为发送和接收
- 例子: 模拟前后端互相发送消息,不走浏览器,使用Windows的窗口访问html页面(代码复制回去,点点就明白了,具体的看文档)
后端代码
import javafx.application.Application;
import javafx.application.Platform;
import javafx.beans.value.ObservableValue;
import javafx.concurrent.Worker;
import javafx.concurrent.Worker.State;
import javafx.geometry.HPos;
import javafx.geometry.VPos;
import javafx.scene.Node;
import javafx.scene.Scene;
import javafx.scene.layout.HBox;
import javafx.scene.layout.Priority;
import javafx.scene.layout.Region;
import javafx.scene.paint.Color;
import javafx.scene.web.WebEngine;
import javafx.scene.web.WebView;
import javafx.stage.Stage;
import netscape.javascript.JSObject;
public class Main extends Application {
@Override
public void start(Stage stage) {
// 创建场景
stage.setTitle("git helper");
Scene scene = new Scene(new Browser(), 900, 600, Color.web("#666970"));
stage.setScene(scene);
// 展示
stage.show();
}
public static void main(String[] args) {
launch(args);
}
}
class Browser extends Region {
private HBox toolBar = new HBox();
private WebView browser = new WebView();
private WebEngine webEngine = browser.getEngine();
Browser() {
// 添加节点
toolBar.getChildren().add(createNode());
// 加载主页
webEngine.load(Main.class.getResource("/html/help.html").toExternalForm());
// process page loading
webEngine.getLoadWorker().stateProperty().addListener(
(ObservableValue<? extends Worker.State> ov, State oldState, Worker.State newState) -> {
if (newState == State.SUCCEEDED) {
JSObject win = (JSObject) webEngine.executeScript("window");
win.setMember("app", new JavaApp());
}
});
//添加组件
getChildren().add(toolBar);
getChildren().add(browser);
}
/**
* JavaScript interface object
*/
public class JavaApp {
/**
* 退出系统
*
* @param msg
*/
public void exit() {
Platform.exit();
}
/**
* 接受消息
*
* @param msg
*/
public void getMsg(String msg) {
System.out.println(msg);
}
public void sendMsg() {
// 发送消息
webEngine.executeScript("getMsg('我是java')");
}
}
/**
* 创建节点
*
* @return
*/
private Node createNode() {
Region spacer = new Region();
HBox.setHgrow(spacer, Priority.ALWAYS);
return spacer;
}
/**
* 加载布局
*/
@Override
protected void layoutChildren() {
double w = getWidth();
double h = getHeight();
double tbHeight = toolBar.prefHeight(w);
layoutInArea(browser, 0, 0, w, h - tbHeight, 0, HPos.CENTER, VPos.CENTER);
layoutInArea(toolBar, 0, h - tbHeight, w, tbHeight, 0, HPos.CENTER, VPos.CENTER);
}
/**
* 初始化宽度
*
* @param height
* @return
*/
@Override
protected double computePrefWidth(double height) {
return 900;
}
/**
* 初始化高度
*
* @param width
* @return
*/
@Override
protected double computePrefHeight(double width) {
return 600;
}
}
前端代码
- help.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<script src="../template/plugins/js/jquery.min.js"></script>
<script type="text/javascript">
function getMsg(msg) {
$("#getMsg").html(msg)
}
</script>
</head>
<body>
我是help页面<br>
<button type="button" onclick="app.getMsg(123)">sendMsgToJava</button>
<br>
<button type="button" onclick="app.sendMsg()">getMsgForJava</button>
<br>
java 发来消息:<li id="getMsg"></li>
<p><a href="about:blank" onclick="app.exit()">退出</a></p>
<a href="index.html">页面跳转</a>
</body>
</html>
- index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>hello</title>
</head>
<body>
我是index页面
<p><a href="about:blank" onclick="app.exit()">退出</a></p>
</body>
</html>