3
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

記事投稿キャンペーン 「2024年!初アウトプットをしよう」

【配布有】しらたまちゃんと学ぶWPFのWebView2実装#1【環境&翻訳編】

Last updated at Posted at 2024-01-05

しらたまちゃんと学ぶWPFのWebView2実装#1【環境&翻訳編】

Powered by ABATBeliever, with しらたまちゃん

目次

  • 免責
  • 知っておきたいこと
    • WPFってなあに
    • Webview2ってなあに
    • しらたまちゃんってだれ
  • 開発につかった環境
  • 開発準備
    • MicrosoftVisualStudioおっすおっす
    • Githubからサンプルを落とそう
  • 開発!
    • 1.プロジェクト読み込み
    • 2.Nugetパッケージのアップデート...はするな危険
    • 3.初めてのビルド
    • 4.ファイル説明
    • 5.メインウィンドウUI弄り・日本語化
  • まとめ
  • 次回へ続く
  • 参考文献

免責

・ABATBelieverは初心者です。この記事が正しいとは限りません。

 (HSP3という言語でWebView2を使用したブラウザ「InternetStroller Memoria」を開発しているのでCやVStudioよりWebView2の知識のほうがある変な人)。

・使用するサンプルコードはMicrosoftがBSDライセンスをかけています

BSDライセンス最新版(MSのにはBSDとしか書いてなかったから多分三条項BSDライセンスだと思うので)

三条項BSDライセンス
「無保証」であることの明記と著作権およびライセンス条文自身の表示を再頒布の条件とする
ライセンス規定である。この条件さえ満たせば、BSDライセンスのソースコードを
複製・改変して作成したオブジェクトコードを、ソースコードを公開せずに頒布できる。
(Wikiより、https://ja.wikipedia.org/wiki/BSD%E3%83%A9%E3%82%A4%E3%82%BB%E3%83%B3%E3%82%B9)

例文
Copyright (c) <年が入る>, <オーナーが入る。ここではMS社>
All rights reserved.

Redistribution and use in source and binary forms, with or without
modification, are permitted provided that the following conditions are met:
* Redistributions of source code must retain the above copyright notice, 
  this list of conditions and the following disclaimer.
* Redistributions in binary form must reproduce the above copyright notice, 
  this list of conditions and the following disclaimer in the documentation 
  and/or other materials provided with the distribution.
* Neither the name of the <organization> nor the names of its contributors 
  may be used to endorse or promote products derived from this software 
  without specific prior written permission.

THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND
ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED
WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
DISCLAIMED. IN NO EVENT SHALL <COPYRIGHT HOLDER> BE LIABLE FOR ANY
DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES
(INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND
ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
(INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS
SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.

配布しているサンプルコード(しらたまWPFブラウザ)もBSDです。私は何されてもいいですがMicrosoftを敵に回すなよ?

知っておきたいこと

1.WPFってなあに

WPF の中核を成すのは、解像度に依存しない、ベクター ベースのレンダリング エンジンであり、
これは最新のグラフィックス ハードウェアを活用できるように構築されています。 
この中核を拡張するため、WPF では、Extensible Application Markup Language (XAML)、
コントロール、データ バインディング、レイアウト、2D および 3D グラフィックス、アニメーション、
スタイル、テンプレート、ドキュメント、メディア、テキスト、タイポグラフィなどの、
アプリケーション開発機能の包括的なセットを使用します。
WPF は .NET の一部です。そのため、.NET API の他の要素を組み込むアプリケーションを構築できます。

WPF は、ほとんどの部分が System.Windows 名前空間に格納されている .NET 型のサブセットとして
存在します。 ASP.NET や Windows フォームのようなマネージド テクノロジを使用して .NET で
以前にアプリケーションを構築したことがあるユーザーは、基本的な WPF のプログラミングの経験には
慣れているはずです。クラスのインスタンス化、プロパティの設定、メソッドの呼び出し、イベントの
処理は C# または Visual Basic などの使い慣れた .NET プログラミング言語を使用して
行うことができます。
...(Learn.Microsoft.comより、https://learn.microsoft.com/ja-jp/dotnet/desktop/wpf/introduction-to-wpf?view=netframeworkdesktop-4.8)

さて、要約すると「.NETを利用して、GUIと内部を切り離したC#とかのプログラミングができるよ!」ってやつ。
Microsoftが作った仕組みだよ。

2.WebView2ってなあに

Microsoft Edge WebView2 を使用すると、Web テクノロジ (HTML、CSS、JavaScript) を
ユーザーのネイティブ アプリに埋め込みできます。 WebView2 コントロールは、
Microsoft Edge をレンダリング エンジンとして使用して、ネイティブ アプリに 
Web コンテンツを表示します。

WebView2 を使用すると、ネイティブ アプリのさまざまな部分に Web コードを埋め込んだり、
1 つの WebView2 インスタンス内にすべてのネイティブ アプリをビルドしたりできます。
(Learn.Microsoft.comより、https://learn.microsoft.com/ja-jp/microsoft-edge/webview2/)

米マイクロソフト(Microsoft)社が提供しているソフトウェアで、開発者は自作の
.NETアプリケーションにWebView2を組み込むことで、Windowsに同梱されている
標準Webブラウザ「Microsoft Edge」を呼び出し、アプリケーション内で
Webブラウザの機能を実現することができる。
(e-wordsより、https://e-words.jp/w/WebView2.html)

さて、要約すると「Microsoft EdgeやChromiumの技術を使ってブラウジングできるようにしたよ!」ってやつ。
今回はこれを活用して自作ブラウザを作っていくが、WPFアプリにも使えると思う。(更新画面とか?)

なお実行にはWebView環境が必要なので、Wineやエミュレーター、古いWindowsでは動かないからね。
(Windows10の比較的新しい奴や11ではもとから入っている。7~10の古い奴の場合は自力で入れて。)

3.しらたまちゃんってだれ

私>
以下の特徴を持つ少女を生成してください
・銀髪
・白いパーカー
・黒で、#模様のスカート

Copilot>
わかりました、それを生成してみます。

という感じで生成された擬人化。QiitaでAI画像うpするのはよくなさそうなので公開しない。

WPFでWebView2を実装するために生まれてきた少女。
サンプルコードで登場するかも。

開発(に使った)環境

Microsoft Visual Studio 無料版2022

詳細やインストール方法は割愛。

もちろん有料版でもいいと思うけど古いVisualStudioは知らん。

Windows11 Pro 23H2

一部の確認にWindows Sandboxを使うかも。

まあVirtualboxや実機でもいいのでWindows10以降ならうまくいくはず。

TOSHIBA Dynabook V72/JLE

CPU i5
メモリ 8GB
ハードオフで2.7万ぐらいで売ってた。
これぐらいの性能あれば開発できるという目安。

開発準備

MicrosoftVisualStudioおっすおっす

詳細やインストール方法は割愛っ!

ただしWPFの奴はインストールすること。(確か9GBぐらい持ってかれる、)

Githubからサンプルを落とそう

公式のサンプルコード

https://github.com/MicrosoftEdge/WebView2Samples の/SampleAppsWebView2WpfBrowser/の中身

curlでもgitでもwgetでもバイナリ手打ちでもいい。普通にリンクをブラウザで踏んで
"<>Code" -> "Download ZIP"
ってしてもいい。

このQiita記事で出来上がったサンプルコード(オプション)

https://github.com/ABATBeliever/Siratama_WPF_WebView2_Browser/releases/tag/%231

こいつDLすればこの記事読んでできるやつが手に入ります。
BSDなので私はどう使われてもいいですがベースはMSだからね!

開発!

1.プロジェクト読み込み

「WebView2WpfBrowser.sln」をVisualStudioで起動する (名前は変えていい。これがプロジェクトファイル)

初めて開くときになんか聞かれたらOKしとく。

すると

「このプロジェクトは入手されていない.NET 3.0~」

と怒られるか、あるいはビルド時に

ターゲット プロセスは、CoreCLR 開始イベントを発生させずに終了しました。
ターゲット プロセスが .NET Core を使用するよう構成されていることをご確認ください。
これは、ターゲット プロセスが .NET Core 上で実行されていない場合に発生する可能性があります。
プログラム '[xxxxx] xxxxx.exe' はコード xxxxxxxxxx (0x80NNNNNN) で終了しました。

と言われると思う。
もし言われなくてもどっかでつまずくと思う。

これは.NET3.0Coreとかいう恐ろしく古いバージョンを参照しているため。

修正策として、「〇〇.csproj」(多分WebView2WpfBrowser.csproj)を開いて修正する。
メモ帳で開いたほうが早いと思う。

<Project Sdk="Microsoft.NET.Sdk.WindowsDesktop">
  <PropertyGroup>
    <OutputType>WinExe</OutputType> ←多分変えないほうがいい
    <TargetFrameworks>netcoreapp3.0;net462</TargetFrameworks> ←ここを「netcoreapp6.0-windows」に変える
    <UseWPF>true</UseWPF> ←多分変えないほうがいい
    <Authors>Hybrid Application Team</Authors> ←好きな名前にしよう!
    <Company>Microsoft</Company> ←ここも変えよう!(この辺はビルドしたexeのプロパティに乗る)
    <Product>WebView2 WPF Sample Browser App</Product> ←これも変えてよし
    <Copyright>Copyright ©2020</Copyright> ←変えてよし(MicrosoftのBSDライセンスがあることは書いたほうがいいかも)
(以降はいじらないほうがいい)

という感じで。

(それで開きなおしても警告が出た場合は、.NET6.0が対象であることを確認して入手すること。161MB。)

2.Nugetパッケージのアップデート...はするな危険

さて、右に「ソリューションエクスプローラー」というところがあって「WebView2WpfBrowser」というのがあると思うので、それを右クリックして好きな名前にリネームしよう!

次に右クリックしたメニューにある「Nugetパッケージの...」というのを押してほしい。
Nugetパッケージをインストールしたり更新できる。

WebView2の記録を見ると「pre-nnnn」とバージョンがなっているのだが、

絶対に更新するなぁ!!!!!

...なぜかというと、どうやらこの後で仕様が変わったらしく、更新してしまうと動かなくなってしまう。
私はまだ解決策を見つけられていないので更新は自己責任で。

3.初めてのビルド

適当に上の▶〇〇の緑の奴を押してビルドしてみよう。
〇〇.jsonの資産ファイルには~

と言われてエラーになった場合はobj\〇〇.jsonを消すといい

Microsoft Edge WebView2
SDK build
2194.0
Runtime version
120.0.2210.91
App path

と表示された謎のウィンドウが表示されれば大成功!ひとまずビルドできたということだ。
(タイムラグがあるので、VStudioの帯が赤く「準備完了」になったら勝ち確定演出ktkr)
qiita01.png

好ましいログ例

'[実行ファイル名].exe' (CoreCLR: DefaultDomain): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.Private.CoreLib.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Users\[ユーザ名]\OneDrive\ドキュメント\VSProjects\WebView2Samples-main\SampleApps\WebView2WpfBrowser\bin\Debug Experimental APIs\netcoreapp6.0-windows\WebView2WpfBrowser.dll' が読み込まれました。シンボルが読み込まれました。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.WindowsDesktop.App\6.0.25\PresentationFramework.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.WindowsDesktop.App\6.0.25\WindowsBase.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.Runtime.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.WindowsDesktop.App\6.0.25\System.Xaml.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\Microsoft Visual Studio\2022\Community\Common7\IDE\PrivateAssemblies\Runtime\Microsoft.VisualStudio.Debugger.Runtime.NetCoreApp.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\netstandard.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.Runtime.InteropServices.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.Threading.ThreadPool.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.ComponentModel.Primitives.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.Collections.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.Diagnostics.TraceSource.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.Private.Uri.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.Text.RegularExpressions.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.WindowsDesktop.App\6.0.25\System.IO.Packaging.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.WindowsDesktop.App\6.0.25\PresentationCore.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.WindowsDesktop.App\6.0.25\DirectWriteForwarder.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.Runtime.Extensions.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.Runtime.CompilerServices.VisualC.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.Diagnostics.Debug.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.Threading.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.Memory.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\Microsoft.Win32.Primitives.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.Collections.NonGeneric.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\Microsoft.Win32.Registry.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.Collections.Specialized.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.Threading.Thread.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.WindowsDesktop.App\6.0.25\System.Configuration.ConfigurationManager.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.Runtime.InteropServices.RuntimeInformation.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.Xml.ReaderWriter.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.Private.Xml.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.Net.WebClient.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.ComponentModel.EventBasedAsync.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.Text.Encoding.Extensions.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.Linq.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.ComponentModel.TypeConverter.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.WindowsDesktop.App\6.0.25\System.Windows.Extensions.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.ComponentModel.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.Collections.Concurrent.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.ObjectModel.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Users\[ユーザ名]\OneDrive\ドキュメント\VSProjects\WebView2Samples-main\SampleApps\WebView2WpfBrowser\bin\Debug Experimental APIs\netcoreapp6.0-windows\Microsoft.Web.WebView2.Wpf.dll' が読み込まれました。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Users\[ユーザ名]\OneDrive\ドキュメント\VSProjects\WebView2Samples-main\SampleApps\WebView2WpfBrowser\bin\Debug Experimental APIs\netcoreapp6.0-windows\Microsoft.Web.WebView2.Core.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\mscorlib.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.WindowsDesktop.App\6.0.25\UIAutomationTypes.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.WindowsDesktop.App\6.0.25\System.Windows.Controls.Ribbon.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.Runtime.Loader.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.Diagnostics.Process.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.WindowsDesktop.App\6.0.25\PresentationFramework.Aero2.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.WindowsDesktop.App\6.0.25\ja\PresentationCore.resources.dll' が読み込まれました。モジュールがシンボルなしでビルドされました。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.WindowsDesktop.App\6.0.25\ja\PresentationFramework.resources.dll' が読み込まれました。モジュールがシンボルなしでビルドされました。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.WindowsDesktop.App\6.0.25\UIAutomationProvider.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.Net.Requests.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.Net.Primitives.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.Net.WebHeaderCollection.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.Threading.Tasks.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.Drawing.Primitives.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.WindowsDesktop.App\6.0.25\System.Drawing.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.Diagnostics.Tracing.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.Diagnostics.StackTrace.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.WindowsDesktop.App\6.0.25\PresentationFramework-SystemXml.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'c:\program files\microsoft visual studio\2022\community\common7\ide\commonextensions\microsoft\xamldiagnostics\Core\x64\Microsoft.VisualStudio.DesignTools.WpfTap.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.IO.Pipes.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.Runtime.Serialization.Json.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.Private.DataContractSerialization.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.Runtime.Serialization.Xml.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.Runtime.Serialization.Primitives.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.Resources.ResourceManager.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.Reflection.Emit.ILGeneration.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.Reflection.Emit.Lightweight.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
'[実行ファイル名].exe' (CoreCLR: clrhost): 'C:\Program Files\dotnet\shared\Microsoft.NETCore.App\6.0.25\System.Reflection.Primitives.dll' が読み込まれました。シンボルの読み込みをスキップしました。モジュールは最適化されていて、デバッグ オプションの [マイ コードのみ] 設定が有効になっています。
スレッド 0xa5c はコード 0 (0x0) で終了しました。
スレッド 0x3ed8 はコード 0 (0x0) で終了しました。
プログラム '[19896] [実行ファイル名].exe' はコード 0 (0x0) で終了しました。

4.ファイル説明

ここではファイルの説明と今回弄るやつの選別。

MainWindow.xaml

アプリのUIを形作っている [編集しよう]

Copyright (C) Microsoft Corporation. All rights reserved.
Use of this source code is governed by a BSD-style license that can be
found in the LICENSE file.

<Window x:Class="WebView2WpfBrowser.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:wv2="clr-namespace:Microsoft.Web.WebView2.Wpf;assembly=Microsoft.Web.WebView2.Wpf"
        xmlns:local="clr-namespace:WebView2WpfBrowser"
        x:Name="MyWindow"
        Title="MainWindow"
        Height="450"
        Width="800"
    >
    <Window.Resources>
    </Window.Resources>
    <Window.CommandBindings>
        <CommandBinding Command="ApplicationCommands.New" Executed="NewCmdExecuted"/>
        <CommandBinding Command="ApplicationCommands.Close" Executed="CloseCmdExecuted"/>
        <CommandBinding Command="NavigationCommands.BrowseBack" Executed="BackCmdExecuted" CanExecute="BackCmdCanExecute"/>
    ...

ってやつ。上にアプリのプレビューが出てくるのでWinForms感覚で編集できる。
「アセンブリ参照の...」って出た場合再起動とかビルドとかすればいつの間にか治ってる。

MainWindow.xaml.cs

C言語で作られた中枢。 動作を設定できる。 なんか押したときの処理はここに飛んでくる。 クッソ長いので開くには時間がかかる [編集しよう]

BridgeAddRemoteObject.cs

よくわからんが大切そう。 [いつか]
BridgeAddRemoteObject is a .NET object that implements IDispatch and works with AddRemoteObject.
(BridgeAddRemoteObjectは、IDispatchを実装し、AddRemoteObjectで動作する.NETオブジェクトです。)

とのこと。

assetsフォルダの一味

画像ファイルは起動時などに映り込むやつっぽい。 それぐらいしかわかっていないが消すと怒られるのでまだ弄らない。 Part2では弄ろうと思う。 [次回]

screenshotsフォルダ

Githubでのreadme.mdの画像っぽい。消していい。 [消そう]

上で紹介したやつ以外のコードファイル

qiita02.png

MainWindow.xaml、MainWindow.xaml.cs、readme.md以外のやつね
ダイアログウィンドウなどの見た目を定義している。今はいじらない。
[いつか]

5.メインウィンドウUI弄り・日本語化

MainWindow.xamlでUIを

image.png
こんな具合でタイトル(ページが読み込まれるまでの間だけ)や上のUIの文字列を弄ることができる。
DeepL翻訳を参考に。
(Microsoftのページはここ以降何にも書いてない...)。

MainWindow.xaml.csでポップアップを

image.png

こんな感じ。

まとめ

・WPFは見た目と中身を別々に設計できる。

・WebView2は便利。

・.Netのバージョンは更新してね、WebView2は更新しないでね。

・日本語化は根気。

・今回の内容はGithubで配布してるよ

Microsoft公式のコード(BSD)
しらたまWPFブラウザ Qiita #1相当 (BSDだが私は別になんでもいい)

image.png

次回へ続く

参考文献

引用個所に書いたからそっから飛んでください。

編集履歴

2024/01/06 02:00 公開

2024/01/06 02:07 ハッシュタグを修正

2024/01/06 12:35 続編記事出版に伴うリンク設置

3
0
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
3
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?