【JavaFX】Webサイトを表示する方法（WebView）

JavaFXでリンク先をWebViewで表示する方法について記載します。

Webサイトを表示する方法

次の実行例では、Apple と Google のリンクをクリックすると、WebViewに各サイトを表示します。

実行例

import javafx.application.Application;
import javafx.event.ActionEvent;
import javafx.geometry.Pos;
import javafx.scene.Scene;
import javafx.scene.control.Hyperlink;
import javafx.scene.layout.HBox;
import javafx.scene.layout.Priority;
import javafx.scene.layout.VBox;
import javafx.scene.web.WebEngine;
import javafx.scene.web.WebView;
import javafx.stage.Stage;

public class Main extends Application {

    @Override
    public void start(Stage pStage) {

        // WebView
        WebView webview = new WebView();
        WebEngine webEngine = webview.getEngine();

        // Hyperlink(Apple)
        Hyperlink hlApple = new Hyperlink("Apple");
        hlApple.setOnAction((ActionEvent e) -> {
            webEngine.load("https://www.apple.com/jp/");
        });

        // Hyperlink(Google)
        Hyperlink hlGoogle = new Hyperlink("Google");
        hlGoogle.setOnAction((ActionEvent e) -> {
            webEngine.load("https://www.google.com/");
        });

        // Hyperlinkを横に並べる
        HBox hbox = new HBox();
        hbox.setAlignment(Pos.BASELINE_CENTER);
        hbox.setSpacing(20);
        hbox.getChildren().addAll(hlApple, hlGoogle);

        // Hyperlink と WebView を縦に並べる
        VBox vbox = new VBox();
        vbox.getChildren().addAll(hbox, webview);
        VBox.setVgrow(webview, Priority.ALWAYS);

        Scene scene = new Scene(vbox);
        pStage.setTitle("Hyperlink & WebView");
        pStage.setWidth(900);
        pStage.setHeight(600);
        pStage.setScene(scene);
        pStage.show();
    }

    public static void main(String[] args){
        launch(args);
    }
}

import javafx.application.Application;

import javafx.event.ActionEvent;

import javafx.geometry.Pos;

import javafx.scene.Scene;

import javafx.scene.control.Hyperlink;

import javafx.scene.layout.HBox;

import javafx.scene.layout.Priority;

import javafx.scene.layout.VBox;

import javafx.scene.web.WebEngine;

import javafx.scene.web.WebView;

import javafx.stage.Stage;

public class Main extends Application {

@Override

public void start(Stage pStage) {

// WebView

WebView webview = new WebView();

WebEngine webEngine = webview.getEngine();

// Hyperlink(Apple)

Hyperlink hlApple = new Hyperlink("Apple");

hlApple.setOnAction((ActionEvent e) -> {

webEngine.load("https://www.apple.com/jp/");

});

// Hyperlink(Google)

Hyperlink hlGoogle = new Hyperlink("Google");

hlGoogle.setOnAction((ActionEvent e) -> {

webEngine.load("https://www.google.com/");

});

// Hyperlinkを横に並べる

HBox hbox = new HBox();

hbox.setAlignment(Pos.BASELINE_CENTER);

hbox.setSpacing(20);

hbox.getChildren().addAll(hlApple, hlGoogle);

// Hyperlink と WebView を縦に並べる

VBox vbox = new VBox();

vbox.getChildren().addAll(hbox, webview);

VBox.setVgrow(webview, Priority.ALWAYS);

Scene scene = new Scene(vbox);

pStage.setTitle("Hyperlink & WebView");

pStage.setWidth(900);

pStage.setHeight(600);

pStage.setScene(scene);

pStage.show();

}

public static void main(String[] args){

launch(args);

}

1. WebViewの作成

WebViewを使用するには、WebViewクラスのインスタンスと、WebEngineクラスのインスタンスを生成します。

WebView webview = new WebView();
WebEngine webEngine = webview.getEngine();

2. ハイパーリンクの作成・イベントの登録

ハイパーリンクを使用するには、Hyperlinkクラスのインスタンスを生成します。

Hyperlink hlApple = new Hyperlink(“Apple”);

また、ハイパーリンクにイベントを登録するには、setOnActionメソッドを使用します。
次のようにすると、リンククリック時にWebViewでAppleのウェブサイトを表示します。

hlApple.setOnAction((ActionEvent e) -> {
webEngine.load(“https://www.apple.com/jp/”);
});

3. リンク先をまとめて管理 & 簡単にイベントを登録

最初の例では、各ハイパーリンクのインスタンスを定義して、さらに各インスタンスにイベントを登録していました。

// Hyperlink(Apple)
Hyperlink hlApple = new Hyperlink("Apple");
hlApple.setOnAction((ActionEvent e) -> {
    webEngine.load("https://www.apple.com/jp/");
});

// Hyperlink(Google)
Hyperlink hlGoogle = new Hyperlink("Google");
hlGoogle.setOnAction((ActionEvent e) -> {
    webEngine.load("https://www.google.com/");
});

// Hyperlink(Apple)

Hyperlink hlApple = new Hyperlink("Apple");

hlApple.setOnAction((ActionEvent e) -> {

webEngine.load("https://www.apple.com/jp/");

});

// Hyperlink(Google)

Hyperlink hlGoogle = new Hyperlink("Google");

hlGoogle.setOnAction((ActionEvent e) -> {

webEngine.load("https://www.google.com/");

});

これでも特に問題はありませんが、リンク先が増えると似たようなコードでソースが埋め尽くされてしまいます。

次のようにすると、リンク先を一元管理できリンククリック時のイベントも簡単に登録することが出来ます。

import javafx.application.Application;
import javafx.event.ActionEvent;
import javafx.geometry.Pos;
import javafx.scene.Scene;
import javafx.scene.control.Hyperlink;
import javafx.scene.layout.HBox;
import javafx.scene.layout.Priority;
import javafx.scene.layout.VBox;
import javafx.scene.web.WebEngine;
import javafx.scene.web.WebView;
import javafx.stage.Stage;

public class Main extends Application {

    // Hyperlinkへの設定値格納用の二次元配列。caption、url
    final static String[][] links = new String[][] {
        { "Apple","https://www.apple.com/jp/" },
        { "Google","https://www.google.com/" },
    };

    @Override
    public void start(Stage pStage) {

        // Hyperlinkの宣言
        final Hyperlink[] hyperLink = new Hyperlink[links.length];

        // WebViewの宣言
        final WebView webview = new WebView();
        final WebEngine webEngine = webview.getEngine();

        // Hyperlinkのキャプション・クリック時のイベントを登録
        for (int i = 0; i < links.length; i++) {

            // ラムダ式内で使用するのに finalなint型変数を用意
            final int curIdx = i;

            // Hyperlinkのキャプションを設定
            hyperLink[curIdx] = new Hyperlink(links[curIdx][0]);

            // Hyperlinkがクリックされた際のイベントを登録
            hyperLink[curIdx].setOnAction((ActionEvent e) -> {
                webEngine.load(links[curIdx][1]); // リンク先のURLを設定
            });
        }

        // Hyperlinkを横に並べる
        HBox hbox = new HBox();
        hbox.setAlignment(Pos.BASELINE_CENTER);
        hbox.setSpacing(20);
        hbox.getChildren().addAll(hyperLink);

        // Hyperlink と WebView を縦に並べる
        VBox vbox = new VBox();
        vbox.getChildren().addAll(hbox, webview);
        VBox.setVgrow(webview, Priority.ALWAYS);

        Scene scene = new Scene(vbox);
        pStage.setTitle("Hyperlink & WebView");
        pStage.setWidth(900);
        pStage.setHeight(600);
        pStage.setScene(scene);
        pStage.show();
    }

    public static void main(String[] args){
        launch(args);
    }
}

import javafx.application.Application;

import javafx.event.ActionEvent;

import javafx.geometry.Pos;

import javafx.scene.Scene;

import javafx.scene.control.Hyperlink;

import javafx.scene.layout.HBox;

import javafx.scene.layout.Priority;

import javafx.scene.layout.VBox;

import javafx.scene.web.WebEngine;

import javafx.scene.web.WebView;

import javafx.stage.Stage;

public class Main extends Application {

// Hyperlinkへの設定値格納用の二次元配列。caption、url

final static String[][] links = new String[][] {

{ "Apple","https://www.apple.com/jp/" },

{ "Google","https://www.google.com/" },

};

@Override

public void start(Stage pStage) {

// Hyperlinkの宣言

final Hyperlink[] hyperLink = new Hyperlink[links.length];

// WebViewの宣言

final WebView webview = new WebView();

final WebEngine webEngine = webview.getEngine();

// Hyperlinkのキャプション・クリック時のイベントを登録

for (int i = 0; i < links.length; i++) {

// ラムダ式内で使用するのに finalなint型変数を用意

final int curIdx = i;

// Hyperlinkのキャプションを設定

hyperLink[curIdx] = new Hyperlink(links[curIdx][0]);

// Hyperlinkがクリックされた際のイベントを登録

hyperLink[curIdx].setOnAction((ActionEvent e) -> {

webEngine.load(links[curIdx][1]); // リンク先のURLを設定

});

}