WebView2 を Visual Studio 2017 Expressで利用できるまで


Download

  • Evergreen


.Net Framework SDK 4.8

Visual Studio 2017 Express で利用できるように

VisualStudio2017でNuGetを使う関係上、 パッケージ管理方法をpackages.configではなくPackageReferenceを使用する必要があります。

「パッケージの管理」の「既定のパッケージ管理形式」を"PackageReference"に設定してください。

ビルド時に使用する.NET Frameworkが4.6.2以降になっている必要があります。

  • プレリリースを含めるにチェックを入れておかないとwebview2がツールボックスに表示されなかった。(2021/5/18時点)

メモ: OSと最初から入っている.NET Frameworkバージョン

.NET Framework 4.6.2 は Windows 10 ver 1607以降に含まれている。
.NET Framework 4.8 は Windows 10 ver 1903以降に含まれている。

Visual Studio 2017のC#でページにアクセス

  • webview2に名前をwebと付けて配置、
  • ボタンを一つ追加。

MainWindow.xaml.cs
  using System;
  using System.Collections.Generic;
  using System.Linq;
  using System.Text;
  using System.Threading.Tasks;
  using System.Windows;
  using System.Windows.Controls;
  using System.Windows.Data;
  using System.Windows.Documents;
  using System.Windows.Input;
  using System.Windows.Media;
  using System.Windows.Media.Imaging;
  using System.Windows.Navigation;
  using System.Windows.Shapes;

  namespace WpfApp1
  {
    /// <summary>
    /// MainWindow.xaml の相互作用ロジック
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
+           InitializeAsync();
        }
+
+       async void InitializeAsync()
+       {
+           await web.EnsureCoreWebView2Async(null);
+       }
+ 
+       private void Button_Click(object sender, RoutedEventArgs e)
+       {
+           web.CoreWebView2.Navigate("http://yahoo.co.jp");
+       }
    }
  }

await web.EnsureCoreWebView2Async

がないとエラーになることがある。