Migaro. 技術Tips

                       

ミガロ. 製品の技術情報
IBMiの活用に役立つ情報を掲載!


【Delphi】TEdgeBrowserコンポーネントでブラウザを表示する手順

IE(Internet Explorer)が廃止されて数年が経ちます。
今回はIEの後継となるMicrosoft Edgeを使って、
Delphiの画面上にブラウザを埋め込む手順をご紹介します。

Delphi/400 11 Alexandria以降では、
Edgeブラウザを埋め込むための「TEdgeBrowser」コンポーネントが追加されました。

旧来のDelphiにおいてはVCLの画面内でWebブラウザを表示する際には
TWebBrowserコンポーネントを使用するのが一般的でしたが、
こちらはそのままだと古いIE(初期値ではIE7)としてWebブラウザが表示されます。
今回は画面内のIEをEdgeにマイグレーションする手順となります。

 

事前準備

Delphiのアプリケーションの画面内にEdgeブラウザを埋め込むためには、
Microsoft Edge WebView2のランタイムが必要になります。
具体的には「WebView2Loader.dll」を実行EXEと同階層に配置する必要があります。

このDLLの入手方法はいくつかありますが、Delphiをご利用の場合は、
GetItパッケージマネージャよりWebView2のランタイムを取得するのが最もシンプルです。

Delphi(11以上)を起動したら、
[ツール] メニューから「GetIt パッケージ マネージャ」を選択し、
下図のように右上の検索ボックスに「WebView」または「EdgeView」と入力します。

表示された「EdgeView2 SDK」をインストールすると、
導入されるファイルに「WebView2Loader.dll」も含まれています。

32bitアプリ用:
C:\Program Files (x86)\Embarcadero\Studio\23.0\Redist\win32\WebView2Loader.dll
64bitアプリ用:
C:\Program Files (x86)\Embarcadero\Studio\23.0\Redist\win64\WebView2Loader.dll
(※「23.0」部分の数字はバージョンによって異なります。23.0の場合は12 Athensです。)

この「WebView2Loader.dll」を、
実行するアプリ(EXE)と同じフォルダにコピーします。

(※注:EdgeView2 SDKをアンインストールすると上記の各「WebView2Loader.dll」は削除されます。ただし他のフォルダにコピーしたものは残ります。)

 

TEdgeBrowserコンポーネントを使用する方法

新たに追加されたTEdgeBrowserコンポーネントをフォームに配置し、
従来のTWebBrowserコンポーネントと同様にNavigateメソッドを使用すれば
そのURLにジャンプすることが可能です。

// 記述例
EdgeBrowser1.Navigate(Edit1.Text);

ブラウザ内のメソッド(GoBack・GoForwardなど)を使用する場合は、
こちらのメソッド一覧をご参照ください。
(※一部のメソッドはTWebBrowserと名前や使用方法が異なります。)
Vcl.Edge.TEdgeBrowser のメソッド – RAD Studio API Documentation

 

TWebBrowserコンポーネントを引き続き使用する方法

Delphi/400 11 Alexandria以降では、
従来のTWebBrowserにもEdge対応機能が追加されています。

従来のTWebBrowserコンポーネントを使用している画面をバージョンアップする場合、
コンポーネントを置き換えなくても追加プロパティの設定のみで引き続き使用可能です。
(※先述の事前準備にある「WebView2Loader.dll」の配置はこちらでも必要です。)

// 記述例
WebBrowser1.Navigate(Edit1.Text);

11 Alexandria以降で追加されたSelectedEngineプロパティを、
「EdgeOnly」または「EdgeIfAvailable」に設定します。

 
(SelectedEngineプロパティ)

  • IEOnly:
    旧来のIEでWebページに接続します。(初期値)
  • EdgeOnly:
    新しいEdgeでWebページに接続します。
    WebView2が無効な場合は内部で例外が発生し、何も表示されません。
  • EdgeIfAvailable:
    WebView2が有効な場合はEdgeで、そうでない場合はIEでWebページに接続します。

 
Webページがどちらのブラウザで開いているかは
「TActiveEngine」プロパティを参照することで確認できます。

  • NoneまたはNoneYet:ブラウザ未使用
  • IE:IEとして表示中。
  • Edge:Edgeとして表示中。
     

なお、本記事ではVCLのTWebBrowserコンポーネントについて紹介していますが、
FireMonkeyのTWebBrowserにおいても同様の設定が追加されています。
(FireMonkeyではTEdgeBrowserに相当するコンポーネントはまだありません。)
FireMonkeyのTWebBrowserにおいてはこちらのDocwikiをご参照ください。
FMX.WebBrowser.TWebBrowser – RAD Studio API Documentation
 ※FireMonkeyでもEdgeで動作させる場合「WebView2Loader.dll」の配置は必要です。
 ※ブラウザの切り替えは「WindowsEngine」プロパティで設定します。

 

関連リンク