Have an amazing solution built in RAD Studio? Let us know. Looking for discounts? Visit our Special Offers page!
C++Delphi

Delphi/C++Builder向けのFireMonkeyで利用可能なChromiumベースの強力なWebViewコンポーネント

chromium-based-webview-component-to-host-web-content-in-your-delphi_c-builder-firemonkey-applications-ja

このブログでは、WINSOFT社のFireMonkeyで動作するChromiumベースのWebViewコンポーネントを紹介いたします。

はじめに

RAD Studio 10.4 Sydneyでは、「TEdgeBrowser」という新しいWebブラウザコンポーネントが追加されました。TEdgeBrowserコンポーネントは、従来のTWebBrowserに代わるWebブラウザコントロールで、Microsoft Edge ChromiumベースのWebView2コントロールをラップしています。TEdgeBrowserの使用方法について、こちらを参照ください。

しかしながら、現時点ではTEdgeBrowserコンポーネントは、VCLアプリケーションでのみ利用可能です。では、もしこれと同じ機能をFireMonkeyアプリケーションでも利用したい場合はどうすればいいのでしょうか?

WINSOFT社のWebView for FireMonkeyコンポーネントは、FireMonkeyで利用可能で、アプリケーション内でWebコンテンツをホストすることができます。

WebView for FireMonkeyの動作要件

  • Microsoft WebView2 APIを使用
  • Windows 32-bitおよびWindows 64-bitをサポート
  • Delphi/C++Builder 6 – 10.4で利用可能
  • Microsoft Edge (Chromium) バージョン 84.0.515.0 以上が必要

※WebView for FireMonkeyは、Windows専用でmacOS、iOS、Android、Linuxには未対応

インストール

WebView for FireMonkeyは、こちらのURLからダウンロードできます。詳しいインストールの手順は、以下のビデオをご覧ください。

WebView for FireMonkeyコンポーネントを実行するためには、実行ファイルと一緒にWebView2Loader.dllというダイナミックリンクライブラリが必要です。WebView2Loader.dllは、Microsoft WebView2 SDKの一部のファイルで、アプリケーションからMicrosoft Edgeを利用するために必須のモジュールです。そのため、このダイナミックリンクライブラリは、アプリケーションの実行パス内から参照できるパスに配置しておく必要があります。

WebView2Loader.dllは、WebView for FireMonkeyのインストーラーにバンドルされており、インストールが完了するとデフォルトで以下のパスに配置されます。

Win32用:

C:¥Program Files (x86)¥Winsoft¥WebView for FireMonkey¥Library¥Win32

Win64用:

C:¥Program Files (x86)¥Winsoft¥WebView for FireMonkey¥Library¥Win64

注意: WebView for FireMonkeyを利用したアプリケーションを実行し、下図のようなエラーが表示された場合は、Microsoft Edgeのインストールが必要です。

webview_for_fmx_runtime_error_ja-5098444

TFWebViewコンポーネントの概要

WebView for FireMonkeyコンポーネントのインストールが完了後、Delphi/C++BuilderのIDEからFireMonkeyプロジェクトを作成し、ツールパレットの[System]カテゴリからTFWebViewコンポーネントをフォーム上に配置してください。

wevview_for_fmx_ide_ja-8232940

TFWebViewの使い方は、TWebBrowserやTEdgeBrowserと非常に似ています。

それでは、TFWebViewコンポーネントの機能について見ていきましょう。

  • Uriプロパティを使用して、Uniform Resource Identifier(URI)を指定できます。
  • Zoomプロパティでは、ビューをコントロールできます。
  • 以下のコードでWebドキュメントのタイトルを取得できます。

CapturePreviewプロシージャは、TFWebViewコンポーネントのスクリーンショットを取得して、TMemoryStreamを使用できるスクリーンショットを保存します。 そのユースケースは、以下の通りです。

  • TFWebViewには、HTMLドキュメントへのWebメッセージの投稿などの驚くべき機能がいくつかあります。
  • または、HTML / CSS / JSコードをShowHtmlプロシージャのパラメータとして指定して、TFWebView内にドキュメントを作成するように、メモリ内にHTMLを表示します。
  • さらに、ExecuteScriptプロシージャを利用することで、Java Scriptコードを実行することができ、例えば、IDで要素を取得や、新しい値を設定など、HTMLドキュメントを操作することができます。
  • 最後に、一番の特徴は開発者ツールで遊ぶことです。例えば、getVersion関数を実行するように、ブラウザのメソッドを使用します。このオプションを使用するには、CallDevToolsプロシージャを呼び出すことができます。

今回の記事はここまでです。次回は続きとして TFWebViewコンポーネントのもう少し具体的な使用例について解説いたします。

現時点では、TEdgeBrowser、WebView for FireMonkeyどちらもWindows専用となりますが、VCLではなく、FireMonkeyでWindows向けのアプリケーションの構築も考えており、既存のTWebBrowser(IEベースのコントロール)からの置き換えを検討されている場合は、WebView for FireMonkeyはとても有用な選択肢の一つとなります。もし興味がありましたら、是非WebView for FireMonkeyをお試しください!

WebView for FireMonkeyライブラリは、WinSoft社の製品です。この記事に記載された機能を利用するには、WinSoft社のサイトからこのライブラリを購入する必要があります。このライブラリに関するサポートは、WinSoft社によって提供されます。


Reduce development time and get to market faster with RAD Studio, Delphi, or C++Builder.
Design. Code. Compile. Deploy.
Start Free Trial   Upgrade Today

   Free Delphi Community Edition   Free C++Builder Community Edition

関連記事
C++DelphiRAD Studio

Delphi 10.4.2 RTL Patchのリリース

C++DelphiRAD Studio

RAD Studio 10.4.2のPatchのリリース: General PatchおよびDelphi Compiler Patch

DelphiRAD Studio

カスタムスタイルを編集してFMXのTEditの背景色を変更するには?

DelphiRAD Studioインタビューニュース

イノベーションを推進するパートナーコラボレーション(TMS Softwareへのインタビュー)

コメント

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

IN THE ARTICLES