tabcontrol

http://www.microsoft.com/china/msdn/library/langtool/vcsharp/OvervwWebBrowExp.mspx

欢迎来到 MSDN > 开发语言和工具

Web Browser Express 概述

发布日期： 8/26/2004 | 更新日期： 8/26/2004

John Kennedy

Microsoft Corporation

摘要：建立您自己的、支持选项卡的 Web 浏览器，以及连接到搜索引擎的集成链接。

下载 WebBrowserExpress.msi 示例文件。

本页内容

	简介
	利用他人成果的好处
	设计 Web 浏览器
	工作原理
	有意思的几点
	扩展建议
	小结

简介

Web 浏览器的一个功能是在同一浏览器窗口内打开不同选项卡或子页，这个功能正在变得更加普及。当浏览多个站点时，使用选项卡来分开多个页会保持桌面的整齐。有若干种第三方 Web 浏览器在 Windows 和其他平台上提供这一功能，如果您跟我一样，您将发现这是一种让人上瘾的浏览方法。很多浏览器，无论是默认设置还是通过插件，也提供一种快速方法，无须直接使用搜索引擎就可以执行 Web 搜索。能够编写自己的浏览器，并使其能够完成所有这些工作，还能把它微调并调整到完全适合您的需要，那不是很棒吗？

图 1：用 Visual C# Express 设计并实现自己的 Web 浏览器

将这些对功能的渴望变为一种全新的产品看起来好像需要大量的工作。毕竟，开发 Internet Explorer 用了多少时间？（答：很长时间。）我如何能够只用一晚上的时间，单枪匹马，就能复制出 Internet Explorer 的强大 HTML 呈现功能并添加我自己的新功能列表？那是因为我使用 Visual C# Express。

返回页首

利用他人成果的好处

在一个晚上编写 Web 浏览器的秘密在于使用其他人的成果。在本例中，秘密是使用了 C# Express WebBrowser 控件。如果您安装了 C# Express 并且打开了帮助，您可能已经看到了一个叫做¡°如何：用 C# Express创建 Windows 应用程序¡±的主题。这一简短的项目将指导您完成创建 Windows 窗体应用程序所涉及的各个步骤。如果您还没有看完，而且您对 C# 不熟悉，我建议您阅读它。

关键之处是，通过使用与 C# Express 配套的控件，创建多个应用程序（包括完整的 Web 浏览器）都是很容易的。一旦 WebBrowser 控件确实已在 Windows 窗体上了，您只需告诉它哪些 URL 是要获取并显示的，以及是否需要返回、向前、刷新或停止。连接到 Internet、获取数据、格式化 HTML、显示图形等所有困难的工作都由该控件处理。

这个项目与帮助项目相近，除了一点，该项目创建多个 WebBrowser 控件并将其添加到 TabControl 中的网页上，而不是只添加一个 WebBrowser 控件到 Windows 窗体上。是的，我甚至无须编写代码来创建 TabControl。这是从工具箱到 Windows 窗体拖放的另一个示例。

那么，虽然我知道这看似一个巨大而复杂的应用程序，仿佛需要数月的工作来完成，但事实上我只是连结了现有控件间的点，就在一个晚上完成了所有工作。这就是我的编程方式！

返回页首

设计 Web 浏览器

图 2：从工具箱拖动控件是编写这一应用程序的关键

以下描述了我如何着手创建 Web Browser Express 项目。在从 C# Express 新项目对话框创建一个Windows 应用程序之后，我将下列控件拖到 Windows 窗体：

1.	TabControl：这个控件存储所有子页，每个子页能控制一个 WebBrowser 控件。一旦它已经创建，向其添加其他页就会很容易。为了确定它填充了整个 Windows 窗体，Dock 属性被设定为 Fill。这使得该控件保持与 Windows 窗体同样大小，即便是调整大小之后。
2.	MenuStrip：尽管这个应用程序中没有菜单，还是存在 MenuStrip 来提供一个屏幕顶端的区域，按钮和文本框可以添加到这个区域。另外，如果您决定添加一些菜单选项，您可以在这里添加。我将 MenuStrip 拖出以使其变得稍大。
3.	Buttons：需要有一些用于 Web 浏览的简单控件。按钮被拖动到 MenuStrip 中，并调整大小，有一个图像应用于这些按钮。我惟一需要做的一件事就是重新绘制图像背景，使其为浅蓝色，以便看起来像 MenuStrip。
4.	Textboxes 和 ComboBoxes ：除了按钮，我还需要一个用于 URL 和搜索字符串的文本框。实际上，URL 是一个 ComboBoxes，允许用户输入一个 Web 地址，并从一个下拉列表中选择项目。这个列表是在设计器中填充的，但如果您希望的话可以以编程方式添加新项。
5.	PictureBox：最右边的 PictureBox 控件是为了装饰用的。Web 浏览器在下载内容时会显示一些动画。
6.	timer：timer 对象用于一秒钟数次发出一个消息。这个消息被一个叫做 timer1_tick() 的方法捕获，并用于更改在 PictureBox 中显示的图像。结果是动画。这并不算是第一流的解决方案，但是它奏效。

返回页首

工作原理

当该程序启动后，它所做的第一件事是调用 Create_a_new_tab()。此方法创建一个新选项卡页，将其添加到 TabControl，然后在其上创建一个 WebBrowser 控件。WebBrowser URL 被设定为“主页”，无论它在您的系统上可能是什么。下面是创建新选项卡的代码：

// Create a new Tab Page
TabPage newpage = new TabPage("Loading...");
tabControl1.TabPages.Add(newpage);

这是创建新 WebBrowser 控件的代码：

// Create a new WebBrowser control.
WebBrowser webpage = new WebBrowser();       
webpage.Parent = newpage;
webpage.Dock = DockStyle.Fill;
webpage.DocumentCompleted += new WebBrowserDocumentCompletedEventHandler(webpage_DocumentCompleted);
webpage.GoHome();                              
            

此代码确定 WebBrowser 的父级是 Tab 页。它还用设置为 Fill 的 Dock 来确定它也保持在窗口的实际大小。我们还添加了一个事件处理程序：控件通过将消息发送到您的程序来工作。您可以选择您所聆听的消息，以及通过将事件处理程序链接到消息所调用的方法。在本例中，该消息告诉我们 WebControl 已经完成了站点的加载和显示，当完成任务时，它将调用名为 webpage_DocumentComplete() 的方法。这允许我们定义当网页加载完毕时执行的代码。例如，停止动画。

Create_a_new_tab() 方法中的最后一行启用计时器：

timer1.Enabled = true;      

计时器轻松地将小段消息发送到 timer1_tick()，它改变在 PictureBox 控件中显示的图像，如下所示：

private void timer1_Tick(object sender, EventArgs e)
        {
            // This method is called by the timer, and we use it to update the
            // image displayed by the PictureBox control to create a simple
            // animation.

            image_animation++;
            if (image_animation > 10) image_animation = 0;

            switch (image_animation)
            {
                case 0: pictureBox_busy.Image = wbe.Properties.Resources.anim0; break;
                case 1: pictureBox_busy.Image = wbe.Properties.Resources.anim1; break;
                case 2: pictureBox_busy.Image = wbe.Properties.Resources.anim2; break;
...
                case 7: pictureBox_busy.Image = wbe.Properties.Resources.anim7; break;
                case 8: pictureBox_busy.Image = wbe.Properties.Resources.anim8; break;
                case 9: pictureBox_busy.Image = wbe.Properties.Resources.anim9; break;
            }
        }

您可以看到，计时器每次激发时，在 PictureBox 中就会显示一个不同的图像。使用您将一个图像分配到按钮或 PictureBox 控件时显示的对话框，从磁盘加载图像。

程序的其余部分由事件驱动 — 当用户单击按钮或者输入一个 Web 地址或搜索字符串时调用特定方法。

例如，Web 导航按钮都调用当前 WebBrowser 控件。例如，如果您单击 Back 按钮，会调用以下方法：

private void button_back_Click(object sender, EventArgs e)
        {
            // Go Back - if the web control can go back, do it.
            WebBrowser thiswebpage = GetCurrentWebBrowser();
            if (thiswebpage.CanGoBack)
                thiswebpage.GoBack();
        }

当在 Address 组合框中输入一个 URL 时，我们使用 Web 控件的 navigate 方法来获取并显示该页。下面的代码使用了当前显示在组合框中的文本并将其传递到 navigate 方法：

WebBrowser this