WebViewの技

iosやAndroidの標準ブラウザーを自作のアプリに導入する場合、読込完了の通知がうまく動作しないことがあります。この時タイマーを使用したり色々な方法で終了まで待機させる必要があります。

今回JavaScliptの機能を使用して完全にHtmlや画像等の読み込みが完了したのちに処理を行うための方法を記載しています。
Javascliptの機能で読み込み時の情報を確認します。

document.readyState
次の返答により振り分けます。

loading
DOMの解析中。

interactive
DOMの解析が終わり、画像やJavaScript、CSSなど、サブリソースの読み込み中。

complete
全ての読み込みが完了

C#で記載するとこのようになります。

bool webloop = false;
webview.Navigated += async (object s, WebNavigatedEventArgs e) => 
{
　　if (webloop)
　　　　return;
　　webloop = true;
  　var html = await webview.EvaluateJavaScriptAsync("document.readyState");
  　while (html != "complete")
  　　{
    　　label.Text = "読み込み中｜\n";
   　　 await System.Threading.Tasks.Task.Delay(500);
    　　html = await webview.EvaluateJavaScriptAsync("document.readyState");
    　　label.Text = "読み込み中ー\n";
   　　 await System.Threading.Tasks.Task.Delay(500);
  　　}
  //HTMLの完全読み込みが完了したので、ここから処理したい事を記載します。
　webloop = false;
};