用Java 自己写一个浏览器 —— JavaFX 入门
2020-01-10
阅读 {{counts.readCount}}
评论 {{counts.commentCount}}
## 前言
其实自从学Java以来一直对Java开发桌面端的图形界面程序很感兴趣。
早些年自学的时候还开发过一些小游戏小工具等。
最近才发现JavaFX，有一种相见恨晚的感觉。
简单体验了一下JavaFX，就相当于一个增强版的Swing 、 Awt
开发起来要更方便，效率跟高。
跟着教程学了个入门， 就打算写点什么。
因为发现其内置了一个非常方便WebView，于是用了不到200行代码写一个简易的浏览器。
<br>
**源码地址：**
Github: [https://github.com/18121259693/JavaFxBrowserDemo](https://github.com/18121259693/JavaFxBrowserDemo)
Gitee: [https://gitee.com/tczmh/JavaFxBrowserDemo](https://gitee.com/tczmh/JavaFxBrowserDemo)
## 代码
#### 目录结构
```shell
├── src
└── com
└── zzzmh
├── controller
│ └── IndexController.java
├── view
│ └── index.fxml
└── Main.java
```
#### 主要文件
`IndexController.java` 负责`流程控制`、`触发效果`
```java
package com.zzzmh.controller;
import javafx.beans.value.ChangeListener;
import javafx.beans.value.ObservableValue;
import javafx.concurrent.Worker;
import javafx.scene.control.TextField;
import javafx.scene.web.WebView;
/**
* @author zzzmh
*/
public class IndexController {
public TextField url;
public WebView webview;
public static String homePageUrl = "https://www.baidu.com";
/**
* 初始化
*/
public void init() {
// webview 加入监听器 状态改变后 自动把新的url回显到文本输入框
webview.getEngine().getLoadWorker().stateProperty().addListener(new ChangeListener<Worker.State>() {
@Override
public void changed(ObservableValue<? extends Worker.State> observable, Worker.State oldValue, Worker.State newValue) {
url.setText(webview.getEngine().getLocation());
}
});
// 跳转首页
home();
}
/**
* 后退
*/
public void prev() {
// 必须不是第一个页 才可以后退 否则会出现
if (webview.getEngine().getHistory().getCurrentIndex() > 0) {
webview.getEngine().getHistory().go(-1);
}
}
/**
* 前进
*/
public void next() {
// 前进必须前面还有页面
if(webview.getEngine().getHistory().currentIndexProperty().getValue()
< webview.getEngine().getHistory().getEntries().size() - 1){
webview.getEngine().getHistory().go(1);
}
}
/**
* 刷新
*/
public void refresh() {
// 重新加载当前引擎
webview.getEngine().reload();
}
/**
* 首页
*/
public void home() {
// 跳转默认首页
goTo(homePageUrl);
}
/**
* 跳转
*/
public void forward() {
// 跳转到输入的url （本方法关联跳转按钮）
goTo(url.getText().startsWith("http") ? url.getText() : "http://" + url.getText());
}
/**
* 跳转的通用方法
*/
public void goTo(String urlString) {
webview.getEngine().load(urlString);
}
}
```
---
`index.fxml` 负责`页面布局`
```xml
<?xml version="1.0" encoding="UTF-8"?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>
<?import javafx.scene.web.*?>
<BorderPane prefHeight="-Infinity" prefWidth="-Infinity" xmlns="http://javafx.com/javafx/10.0.2-internal"
xmlns:fx="http://javafx.com/fxml/1" fx:controller="com.zzzmh.controller.IndexController">
<top>
<!-- 工具栏 -->
<ToolBar prefHeight="40.0" prefWidth="-Infinity" BorderPane.alignment="CENTER">
<items>
<!-- 按钮-->
<Button mnemonicParsing="false" onAction="#prev" text="后退"/>
<Button mnemonicParsing="false" onAction="#next" text="前进"/>
<Button mnemonicParsing="false" onAction="#refresh" text="刷新"/>
<Button mnemonicParsing="false" onAction="#home" text="首页"/>
<!-- 标签 -->
<Label text="地址"/>
<!-- 地址栏 -->
<TextField fx:id="url" prefWidth="980"/>
<!-- 跳转按钮 -->
<Button mnemonicParsing="false" onAction="#forward" text="跳转"/>
</items>
</ToolBar>
</top>
<center>
<!-- WebView -->
<WebView fx:id="webview" prefHeight="-Infinity" prefWidth="-Infinity" BorderPane.alignment="CENTER"/>
</center>
</BorderPane>
```
---
`Main.java` 程序的主入口，执行`main`方法启动整个程序
```java
package com.zzzmh;
import com.zzzmh.controller.IndexController;
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 {
@Override
public void start(Stage primaryStage) throws Exception{
// fxml加载器
FXMLLoader fxmlLoader = new FXMLLoader();
fxmlLoader.setLocation(getClass().getResource("view/index.fxml"));
// fxml加载到 根节点
Parent root = fxmlLoader.load();
// 设置标题
primaryStage.setTitle("极简牛腩器 (Simple Browser)");
// 设置默认宽高 并加入根节点
primaryStage.setScene(new Scene(root, 1280, 720));
// 显示窗口
primaryStage.show();
// 获取IndexController
IndexController controller = (IndexController)fxmlLoader.getController();
// 执行IndexController中的初始化方法
controller.init();
}
/**
* 入口方法
* 执行本方法启动整个程序
*/
public static void main(String[] args) {
launch(args);
}
}
```
## 结果
简单实现了一些浏览器基本功能
<br>
<br>
## END
沪公网安备31010602005070号