WinRT | たがわ製作所ブログ

Windows.UI.Xaml.Controls.WebView を使うと、簡単に任意の URL のページを表示させることができます。この WebView、主に使用するメソッドは Navigate と NavigateToString のふたつだけとあって、非常に簡単に使えるのですが、使い勝手が微妙な点もあります。

たとえば、あるビューモデルにプロパティ Uri があると仮定します。対応するビューには WebView が定義されており、ビューモデルの Uri に対応する Web ページを表示させたいというような場合を考えてください。

WebView にこの Uri を直接バインドできれば話は簡単なんですが、残念ながらそのような便利なプロパティはないため、Navigate メソッドをどこかで呼び出す必要がでてきます。ビューモデルのプロパティ Uri がどのタイミングで変更されるかにもよりますが、このビューモデルのプロパティ Uri とビューで表示されているページを完全に同期させようとするといろいろと面倒なことをする必要がでてきます。

もし WebView が表示するページの Uri をセットするためのプロパティをもっていれば話は簡単です。ビューモデルのプロパティをバインドするだけでよいのです。そう、WebView にそんなプロパティさえあれさえすれば。

というわけで、WebView をラップしてそのようなプロパティを提供するユーザーコントロールを書いてみました。

<UserControl
  x:Class="MyControl.MyWebView"
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
  <WebView x:Name="WebBrowser">
</UserControl>

<UserControl

x:Class="MyControl.MyWebView"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">

</UserControl>

using System; 
using Windows.UI.Xaml; 
using Windows.UI.Xaml.Controls;

namespace MyControl
{
  public sealed partial class MyWebView: UserControl 
  { 
    public static readonly DependencyProperty UriProperty = 
      DependencyProperty.Register(
        "Uri",
        typeof(Uri),
        typeof(MyWebView),
        new PropertyMetadata(null, UriPropertyChanged));

    public Uri Uri 
    { 
      get { return (Uri)GetValue(UriProperty); } 
      set { SetValue(UriProperty, value); } 
    }

    private static void UriPropertyChanged(
      DependencyObject sender, DependencyPropertyChangedEventArgs args) 
    { 
      (sender as MyWebView).WebBrowser.Navigate(args.NewValue as Uri); 
    }

    public MyWebView() 
    { 
      this.InitializeComponent(); 
    } 
  } 
}

using System;

using Windows.UI.Xaml;

using Windows.UI.Xaml.Controls;

namespace MyControl

{

public sealed partial class MyWebView: UserControl

{

public static readonly DependencyProperty UriProperty =

DependencyProperty.Register(

"Uri",

typeof(Uri),

typeof(MyWebView),

new PropertyMetadata(null, UriPropertyChanged));

public Uri Uri

{

get { return (Uri)GetValue(UriProperty); }

set { SetValue(UriProperty, value); }

}

private static void UriPropertyChanged(

DependencyObject sender, DependencyPropertyChangedEventArgs args)

{

(sender as MyWebView).WebBrowser.Navigate(args.NewValue as Uri);

}

public MyWebView()

{

this.InitializeComponent();

}

WebViewにURLをバインドする

カテゴリ