マイクロソフト株式会社 デベロッパー&プラットフォーム統括本部
エバンジェリスト 高橋 忍

最終更新日 2006 年 3 月 3 日

このコンテンツのポイント

  • WebBrowserControl の実装方法を理解する。

今回紹介するコード

<Form1.cs>

 

C#
public Form1()
{
    InitializeComponent();
    this.Text = "MyBrowser";
    this.comboBox1.Text = "http://www.microsoft.com/japan/msdn/thisweek/300x10/";
}

private void comboBox1_KeyDown(object sender, KeyEventArgs e)
{
    if (e.KeyCode == Keys.Enter)
    {
        try
        {
            string url = comboBox1.Text;
            if (!comboBox1.Text.StartsWith("http://")) url = "http://" + url;
            webBrowser1.Navigate(new Uri(url));
            comboBox1.Items.Add(url);
        }
        catch
        {
        }
    }
}

private void comboBox1_SelectedIndexChanged(object sender, EventArgs e)
{
    try{
        webBrowser1.Navigate(comboBox1.Text);
    }
    catch
    {
    }
}

private void webBrowser1_Navigated(object sender, WebBrowserNavigatedEventArgs e)
{
    this.Text = webBrowser1.Document.Title.ToString() + " - MyBrower";
    this.comboBox1.Text = webBrowser1.Url.ToString();
}
 

今回のシステム要件

  • Visual Studio 2005

 

目次

はじめに
作成するアプリケーションの概要
アプリケーションの作成
動作と解説
おわりに

Visual Basic の内容はこちらに掲載しています。
10 行でズバリ!! 簡単 WebBrowser の作成 (VB)

 

はじめに

Windows Forms 2.0 で新しく追加された、WebBrowser コントロールは WebBrowser としての基本的な機能を備えています。この WebBrowser コントロールを使うことで、Windows アプリケーション上で簡単に HTML コンテンツを表示し、利用することが出来ます。ここでは、この WebBrowser コントロールを使って簡単な WebBrowser を作ってみます。

作成するアプリケーションの概要

ここでは、URL 入力欄がある簡単な WebBrowser を作成します。

アプリケーションの作成

まず、新規に Windows アプリケーションを作成します。Visual Studio 2005 の [ファイル] メニューをクリックし、[新規作成] をポイントして、[プロジェクト] をクリックします。 [新しいプロジェクト] ダイアログ ボックスが表示されたら、プロジェクトの種類として 「Visual C#」 の 「Windows」 を選択し、テンプレートとして 「Windows アプリケーション」 を選択します。 プロジェクト名などを任意に指定して [OK] をクリックします。

図 1. Windows アプリケーションを新規に作成する

これで、ベースとなる Windows フォームが出来ましたのでここで、URL 入力欄として利用する ComboBox コントロールを実装します。ツールから ComboBox コントロールをフォームにドラッグ & ドロップします。フォームに配置されたら、「Dock」 プロパティを使ってフォームの上辺にドッキングするように設定します。

次に WebBrowser コントロールをフォームの下半分にドラッグ & ドロップします。WebBrowser コントロールはデフォルトでフォームにドッキングします。

図 2. コントロールの配置

ベースとなるコントロールの配置が完了したので機能を実装します。 「表示」 メニューから 「コード」 を選択してコード画面を表示します。すでに Form1 のコンストラクタである、 Form1() のメソッドが定義されていますので、まずはここに初期設定のため以下のコードを追加します。

C#
public Form1()
{
    InitializeComponent();
    this.Text = "MyBrowser";
    this.comboBox1.Text = "http://www.microsoft.com/japan/msdn/thisweek/300x10/";
}
 

これは初期設定です。もちろんコントロールのプロパティで設定することも可能です。

では、URL を入力してブラウザに表示する部分の処理を作成します。ComboBox のイベントを利用するのですが、ここでは入力完了のトリガとして、「Enter キー」 の入力を使ってみます。そのため KeyDown イベントから処理を実装します。

フォームのデザイン画面から ComboBox を選択し、プロパティ欄でイベントを表示します。その中から 「KeyDown」 イベント欄をダブルクリックして、イベント プロシージャを生成させます。

図 3. イベントの実装

コードが表示されたら以下のように入力します。キー入力をすると毎回発生するイベントなので Enter キー以外は処理をしないようにします。Enter キーが押されたら ComboBox の入力欄をチェックし、http:// ではじまっていない場合は、http:// を補完します。URL が決まったら、WebBrowser コントロールの Navigate メソッドで Web ページを指定します。正しくない URL の場合はこの時点でエラーが発生し、エラー ハンドリングに進みますが、正しい URL であった場合は、その URL がコンボボックスに登録されます。

C#
private void comboBox1_KeyDown(object sender, KeyEventArgs e)
{
    if (e.KeyCode == Keys.Enter)
    {
        try
        {
            string url = comboBox1.Text;
            if (!comboBox1.Text.StartsWith("http://")) url = "http://" + url;
            webBrowser1.Navigate(new Uri(url));
            comboBox1.Items.Add(url);
        }
        catch
        {
        }
    }
}
 

コンボボックスに登録された URL を選択した場合の処理も実装しておきましょう。デザイン画面から、コンボボックスをダブルクリックして、以下のコードを実装します。

C#
private void comboBox1_SelectedIndexChanged(object sender, EventArgs e)
{
    try{
        webBrowser1.Navigate(comboBox1.Text);
    }
    catch
    {
    }
}
 

これだけでも十分ブラウザとしては機能しますが、もう一つブラウザらしい処理を追加しておきます。

では、Web ブラウザが Web ページを表示したときの処理を実装しましょう。Web ページによっては転送して別の URL のページを表示することもあります。また、リンクをクリックして別ページに移る場合もあります。ページが移動されたら最終的なページの URL をコンボボックスに正しく表示するようにします。さらに、Web ページのタイトルもアプリケーションのタイトルに表示するように変更します。

デザイン画面から WebBrowser コントロールを選択し、プロパティ ウィンドウのイベントから 「Navigated」 イベントをダブルクリックして以下のコードを実装します。Web ページのタイトルは WebBrowser コントロールの Document プロパティの Title から取得が出来ます。

C#
private void webBrowser1_Navigated(object sender, WebBrowserNavigatedEventArgs e)
{
    this.Text = webBrowser1.Document.Title.ToString() + " - MyBrower";
    this.comboBox1.Text = webBrowser1.Url.ToString();
}
 

動作と解説

では、実行してみます。 [Ctrl + F5] キーを押すか、[デバッグ] メニューの [デバッグなしで開始] をクリックします。すでに URL の入った簡易 WebBrowser が表示されますので、URL を選択して 「Enter キー」 を押してみましょう。きちんと Web ページが表示され、タイトルも Web ページのタイトルが表示されています。

図 4. 簡易 WebBrowser の実行

続けてURLを少し削って

と順に表示させてみてください。

表示後それぞれの URL がコンボボックスに登録され、後から選べるようになっています。また、リンクをクリックして別ページを表示させると、きちんと URL が変更されタイトルも変更されていることがわかります。さらに、「microsoft.com」 と入力して Enter キーをおすと、きちんと 「http://www.microsoft.com/」 のように URL が修復されます。これは、「microsoft.com」 をコードの中で 「http://microsoft.com/」 に変更され、これがインターネット上で 「http://www.microsoft.com」 に転送されているために、このような結果になります。

おわりに

このように WebBrowser コントロールは WebBrowser の持つ HTML コンテンツの表示機能だけではなく、HTML コンテンツを Document オブジェクトとして開発者が利用できるようになっています。Browser だけではなく、HTML ドキュメントの表示機能などにも、うまく利用してみてください。


Code Recipe .NET Framework デベロッパー センター

ページのトップへ