PR

WebBrowserコントロールにWebサイトを表示する

2010年6月9日(水)
PROJECT KySS

WebBrowserコントロールでHTMLコンテンツを表示する

Silverlight 4で追加されたWebBrowserコントロールでは、Silverlightプラグインの中にHTMLコンテンツをホストすることができます。今回は、Trustedモード(高い信頼性に基づいたモード)のブラウザ外実行で、WebBrowserコントロール内にHTMLコンテンツを表示してみましょう。

筆者の開発環境は、Microsoft Windows7 Professional(32bit)、Visual Studio 2010 Ultimate、Silverlight 4 Tools RC2 for Visual Studio 2010、Expression Blend 4 RC、Silverlight_4_Toolkit_April_2010です(いずれも英語版)。ダウンロード用サンプルは、Silverlight 4 Tools for Visual Studio 2010でも動作確認済みです。開発環境の構築については、第1回目を参照してください。これ以降、Visual Studio 2010 はVS 2010、Expression Blend 4 RCはBlendと略します。

サンプル・ファイルはこちらからダウンロードできます。

今回実装する機能の動作は次の通りです。

まず、ListBoxコントロールに表示されているメニューを選択すると、リンク先のページがWebBrowserコントロール内に表示されます(図1)。また、TextBoxコントロール内にHTMLもしくはXHTMLでマークアップした内容を記述して[OK]ボタンをクリックすると、WebBrowser内にHTMLコンテンツが表示されます。あるいは、HTMLファイルのソースコードをコピーしておき、キーボードの[Ctrl]+[V]キーを使ってTextBoxコントロール内にペーストしてもかまいません。図2は、リスト1のXHTMLコードを入力して表示した例です。

図1: ListBoxコントロールのメニューを選択し、該当するページが表示されている(クリックで拡大)

図2: TextBox内に記述したXHTMLでマークアップされたコンテンツが、WebBrowser内に表示されている(クリックで拡大)

リスト1: TextBoxに入力したXHTMLコード

<?xml version="1.0" encoding="utf-8"??>
br /> "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">





サンプルXHTML



Information(2010/04/27)



先般よりアナウンスしております新サーバへの移設作業中です。

いましばらくお待ちください。



XML文書ファイルを追加して、参照を追加する

では、さっそくサンプルを作っていきましょう。

ツールの操作手順については第1回目で述べましたので、ここでは簡単に説明します。

VS 2010のメニューから[File/New/Project]を選択します。本稿では開発言語としてVisual Basicを使いますので、開発言語がVisual Basicになっていることを確認のうえ「Silverlight Application」を選択して、「Name」に任意のプロジェクト名(サンプルでは「SL4_WebBrowser」)を入力します。

.NET Frameworkのバージョンはデフォルトの「4」、「New Silverlight Application」の[Options]の「Silverlight Version」もデフォルトの「Silvelright 4 」のままで[OK]ボタンをクリックします。

Solution Explorerペインのプロジェクト名を選択して、マウスの右クリックで表示されるショートカット・メニューから、「Project Dependencies(プロジェクト依存関係)」を選択します。「Project Dependencies」ダイアログボックスの「Depends on(依存先)」内のチェックボックスにチェックを付けておきます。

次に、Solution Explorer(ソリューションエクスプローラ)内の「SL4_WebBrowser」を右クリックして、「Add/Existing Item…」から、ListBoxコントロールに表示するデータを記録したXML文書を参照して追加します(リスト2)。このXML文書ファイルは、ダウンロード用サンプルには追加済みです。なお、データは1冊の本の情報以外はサンプル用のダミーです。

リスト2 使用するXML文書の例(bookInfo.xml)

<?xml version="1.0" ??>

 
    XML設計の心得書籍名>
    ~書籍名>繰り返し~
  書籍>
書籍情報>

このXMLデータの処理にはLINQ to XMLを用いますので、VS 2010のメニューから「Project/Add Reference」(参照の追加)を選択して、System.Xml.Linqを追加しておきます(図3)。

図3: System.Xml.Linqを追加する(クリックで拡大)

四国のSOHO。薬師寺国安(VBプログラマ)と、薬師寺聖(デザイナ、エンジニア)によるコラボレーション・ユニット。1997年6月、Dynamic HTMLとDirectAnimationの普及を目的として結成。共同開発やユニット名義での執筆活動を行う。XMLおよび.NETに関する著書や連載多数。最新刊は「Silverlight実践プログラミング」両名とも、Microsoft MVP for Development Platforms - Client App Dev (Oct 2003-Sep 2012)。http://www.PROJECTKySS.NET/

連載記事一覧

Think IT会員サービスのご案内

Think ITでは、より付加価値の高いコンテンツを会員サービスとして提供しています。会員登録を済ませてThink ITのWebサイトにログインすることでさまざまな限定特典を入手できるようになります。

Think IT会員サービスのご案内

関連記事