HTMLコントロールとHTMLブラシ
Silverlight 3までは、HTML形式のヘルプやクレジットカードの決済サイト、広告バナーなどを表示したい場合、新しいウインドウで表示したり、ページを遷移させる必要がありました。Silverlight 4ではブラウザ外実行時に限り、HTMLコントロールやHTMLブラシを使ってHTMLをSilverlight内部に表示できます。
WebBrowserコントロール
WebBrowserコントロールは、HTMLのインラインフレームのように、Silverlightのページ内部にHTML用の表示エリアを確保するコントロールです。ブラウザ外実行時に限り、利用できます。通常のWebページにホストされたSilverlightに、WebBrowserコントロールを配置すると、図5のようなメッセージが画面に表示されます。
例えば、HTMLで作成されたアプリケーションのヘルプや、外部のWebページをSilverlightのページ内に表示できます。WebBrowserコントロールは、表1のメソッドやプロパティを操作することで、HTMLを表示します。
| No | メソッドまたはプロパティ | 概要 |
| 1 | NavigateToStringメソッド | HTML文字列をWebブラウザコントロールに表示します。 |
| 2 | Sourceプロパティ | XAP内のHTMLや外部のWebページのURLが指すリソースを表示します。 |
| 3 | Navigateメソッド | XAP内のHTMLや外部のWebページのURLが指すリソースに移動します。 |
リスト2は、ページのロード時にXAPファイルに同梱されたHTMLを読み込み、Silverlightのページ内に表示している例です。
private void UserControl_Loaded(object sender, RoutedEventArgs e)
{
var helpFile = new Uri("Help.html", UriKind.Relative);
var htmlResource = Application.GetResourceStream(helpFile);
if (htmlResource == null)
return;
WebBrowser1.NavigateToString(new StreamReader(htmlResource.Stream).ReadToEnd());
}
Help.htmlは、図6のようにコンテンツとして格納していますので、GetResourceStreamメソッドでファイルへのストリームを取得し、ReadToEndメソッドで読み込み、WebBrowserコントロールに引き渡しています。
通常のインターネット上のコンテンツを表示する場合は、NavigateメソッドやSourceプロパティに、HTMLページへのURLを渡すだけです。
WebBrowserコントロールは単に表示するだけでなく、InvokeScriptメソッドを利用してホストしたHTMLの要素をSilverlightから操作したり、Javascript側からwindow.external.notifyメソッドを通じて、SilverlightのScriptNotifyイベントを発生させたりできます。詳しくは、リンク先を確認してください。
HTMLブラシ
WebBrowserコントロールは、WebBrowserBrushコントロールを利用することで、ブラシとしてSilverlightの要素に貼り付けることができます。貼り付けたWebページは、他のSilverlightのブラシと同様に、エフェクトをかけたり回転などの変換を行ったりできます。
リスト3は、四角形にリスト2で指定したHTMLをブラシとして設定している例です。
<WebBrowser Grid.Row="1" Visibility="Collapsed" Name="WB1" Source="http://www.bing.com" />
<Rectangle Grid.Row="1" x:Name="brush" Width="350" Height="350" Visibility="Visible" >
<Rectangle.Fill>
<WebBrowserBrush x:Name="htmlBrush" SourceName="WB1"/>
</Rectangle.Fill>
<Rectangle.Effect>
<BlurEffect Radius="8"></BlurEffect>
</Rectangle.Effect>
</Rectangle>
筆者が試した限りでは、WebBrowserコントロールの表示中はWebBrowserBrushコントロールには、何も表示されませんでした。WebBrowserBrushコントロールを利用する場合は、WeBrowserコントロールのVisibilityプロパティを、Collapsedに設定する必要があります。
WebBrowserBrushコントロールに表示されるコンテンツの再表示は、自動的に行われません。ユーザーのアクションをもとに書き換えたり、タイマーコントロールを使って定期的に書き換えたりする必要があります。リスト4は、ページ起動時にタイマーによってWebBrowserBrushコントロールを定期的に再描画している例です。
private DispatcherTimer dt = new DispatcherTimer();
public MainPage()
{
InitializeComponent();
dt.Interval = new TimeSpan(1 * 500);
dt.Tick += new EventHandler(
(_s, _e) => wBrush.Redraw()
);
dt.Start();
}
PDC 09では、SilverlightからFlashで動作するYouTubeの画像を画面に張り付け、16面パズルにするデモンストレーションが話題を呼びました。
