11
14

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

.NET WebView2を利用して、WinFormやWPFでPDFを表示する

Posted at

やりたいこと

WinFormやWPFで表示しようとなると、AcrobatSDKが必要だとか
サードパーティライブラリが必要だとか、Win10のAPIを利用して画像を生成するだとか、色んな記事があります。
正直めんどいし、なんだったら割と簡単じゃない。(難しくはないんですがめんどくさいは否めない)
AcrobatSDK利用すると余計な機能が付いてくる、サードパーティだと料金が発生するかもだし、
配布時のライセンス問題も気にしなきゃとか、Win10のAPIで画像生成は、
所詮画像を生成するに留まるし、生成処理に時間もかかる等で、個人的には不満が多かったです。

ただ表示したいだけなのに。なんでこんなめんどいの?世の中からPDF無くなったらいいのに。。。
特定の環境下じゃないと再現できないドキュメントフォーマットなんて、HTML以下でしょ。
なんでこんなに世の中で流行ってんのさ。
なんて思った事も過去にありました。

そんな事を今でも思い悩んでる貴方に!

ただ表示したい!なんだったら印刷等もしたい!という場合に
私がお勧めしたい、多分これ以上ないだろうという簡単実装を紹介します。

難しいお話は全く無くて、単純にMicrosoft Edgeベースのブラウズが出来るコントロールである
Microsoft Edge WebView2を利用し、表示するという方法です。つまりEdge任せです。

条件

Windows 11、10、8.1、7等。

Win32 C/C++
.NET framework 4.5以降
.NET Core 3.1以降
.NET 5
.NET 6
WinUI 2.0(プレビュー)
WinUI 3.0

実行環境にWebView2ランタイムがインストールされている事。

Visual Studio 2017以降

詳しくは、Microsoftの公式ドキュメントを参照してください。
Microsoft Edge WebView2 の概要
WebView2 アプリと WebView2 ランタイムの配布

実際にやってみる

環境は、下記の通りです。
Windows 10 Pro 64bit 21H1
Microsoft Visual Studio Community 2019

今回はC# WindowsForm +.NET Freamwork 4.8の例で紹介します。
(もちろんVisualBasicだろうが、C++でも問題ありません)

1 NuGet パッケージマネージャーでWebView2をインストールする

空のWinformプロジェクトを作り、NuGetからWebView2を取得し、コントロールを使えるようにします。

image.png

2 フォームにButtonとWebView2を追加する

image.png

3 WebView2にPDFを読み込ませる処理を書く

PDFのファイルパスをURIにしてWebView2のSourceプロパティに渡す処理を書きます。
お決まりのパターンです。なんにも難しくないです。

C#
    public partial class Form1 : Form
    {
        public Form1()
        {
            InitializeComponent();
        }

        private void button1_Click(object sender, EventArgs e)
        {
            using (OpenFileDialog ofd = new OpenFileDialog())
            {
                ofd.Filter = "PDFファイル(*.pdf)|*.pdf";
                if (ofd.ShowDialog() == DialogResult.OK)
                {
                    this.webView21.Source = new Uri(ofd.FileName);
                }
            }
        }
    }

4 動かしてみる

ビルドして実行してみます。
image.png

以上です。ちゃんと表示されてます。
(手書き系等の機能は除いて)EdgeでPDFを表示した結果と全く同じです。
なので文字検索や回転、印刷や保存もできます。

5 感想

いや、簡単すぎる!!SDK?API?なんだったの?ってなりました。
Webブラウザを利用するという点でチート技だとも言えますが、
単に表示したいだけというニーズはあると思います。それをお手軽に実装するという点では有りかと。

一点だけ難癖を付けると、WebView2ランタイムなるものが必須であること。
このランタイムは、再配布可能という事になってるので、ライセンスの心配は無いでしょう。
他の方法も似たような事情を抱えるので、Microsoft謹製環境のみで実装できるのはうれしい事ではないでしょうか。

URIで渡す為、もちろんインターネット上のPDFも渡せますし、
試してないですが工夫次第ではSharePoint上のPDFファイルのURLとか、
Teamsに添付したPDF等も扱えるかも・・・?

なんにせよこんなに簡単に実装出来るんだから、活用しやすいかと思います。

また、WebView2の利用できる範囲が広い事。条件を満たせば、懐かしのWin7でも利用できるってのは、
一部の環境では大歓迎な実装方法なのではないでしょうか。
随分と時が経ってしまいましたが、まさしくWin7時代にこんな感じの仕組みが欲しかったものです。

PDFを表示するアプローチとして、あまりこの方法の紹介記事が無いようだったので、紹介しました。
参考になればと思います。

11
14
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
11
14

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?