ASP.NET Web 窗体教程：用户控件示例

⚡ 智能摘要

ASP.NET Web Forms 用户控件允许您一次构建可重用的 UI 组件，并在多个页面中使用它们。本文将演示如何创建用户控件、将其注册到页面和 web.config 文件中（全局注册），以及如何添加公共属性。

♻️ 可重复使用 Code: 用户只需控制一次软件包标记和逻辑，即可在整个应用程序中重复使用。
🛠️ 创建控件： 在 Visual Studio 中添加 Web Forms 用户控件 (.ascx) 并添加其标记。
📝 注册页面： 使用带有 Src、TagName 和 TagPrefix 的 Register 指令，可以在一个页面上使用它。
🌍 全球注册： 在 web.config 文件的 pages/controls 下添加该控件，即可在每个页面上使用它。
🔧 公共财产： 公开 MinValue 等属性，以便页面可以配置控件的行为。

在 ASP.Net 中，可以创建可重复使用的代码。可重复使用的代码可以在许多地方使用，而无需再次编写代码。

可重用代码有助于减少开发人员编写代码后所花费的时间。它只需编写一次，即可在多个地方重复使用。

在 ASP.Net 中创建用户控件

ASP.NET 能够创建 Web 控件。这些控件包含可重用的代码，可以根据需要在整个应用程序中使用。

让我们来看一个如何在 ASP.Net 中创建 Web 用户控件的示例。

在我们的例子中：

我们将创建一个网络控件。
它将用于创建标题组件。
它将包含以下文字：“Guru99 个教程”和“本教程适用于 ASP.Net”。

让我们使用前面部分中创建的当前 Web 应用程序。让我们按照以下步骤创建 Web 用户控件。

步骤1） 第一步是创建一个 Web 用户控件并将其添加到我们的 Visual Studio 解决方案中。

在 Visual Studio 中打开解决方案资源管理器，右键单击 DemoApplication 解决方案。
选择菜单项“添加->新项目”。

步骤2） 下一步，我们需要选择创建 Web 用户控件的选项。

在项目对话框中，我们可以看到创建不同类型组件的各种选项。单击左侧的“Web”选项。
点击“Web”选项后，您会看到“Web表单用户控件”选项。点击此选项。
然后我们给 Web 控件命名，“Guru99Control”。
最后，单击“添加”按钮让 Visual Studio 将 Web 用户控件添加到我们的解决方案中。

然后你会看到“Guru解决方案中添加了“99Control”。

步骤3） 现在是时候将自定义代码添加到 Web 用户控件中了。我们的代码将基于纯 HTML 语法。将以下代码添加到“Guru99Control.ascx 文件。

<table>
	<tr>
	  <td>Guru99 Tutorials</td>
	</tr>

	<tr>
	  <td> This Tutorial is for</td>
	</tr>
</table>

Code 解释：-

在我们的 Web 控件文件中，我们首先创建一个表格元素。该元素将用于容纳两行文本，显示“Guru99 个教程”和“本教程适用于 ASP.Net”。
接下来，我们定义第一行表格内容，并将其文本设置为“Guru99 个教程。”
然后，我们定义第二行表并将文本设置为“本教程适用于 ASP.Net”。

注意: 现在我们无法执行这段代码并显示输出结果。要验证它是否有效，唯一的办法是将其包含在我们的应用程序（aspx 文件）中。我们将在后续主题中详细介绍。

在 ASP.NET Web 表单上注册用户控件

在前面的章节中，我们学习了如何创建自定义 Web 控件。它可以用于在 Web 表单中显示以下两行内容：

“Guru99 个教程”
“本教程适用于 ASP.Net。”

自定义控件创建完成后，我们需要在 Web 应用程序中使用它。第一步是在应用程序 (Demo.aspx) 中注册该组件。这是在 ASP.NET 应用程序中使用任何自定义 Web 控件的先决条件。

让我们来看看如何实现这一点。以下步骤是上一节的延续，上一节中我们创建了自定义控件。在本节中，我们将使用该控件。 演示.aspx 网页表单。首先，我们将自定义“控件”注册到 Demo.aspx 文件中。

步骤1） 请确保您正在编辑 demo.aspx 文件。Web 用户控件将在此文件中注册。您可以通过在 .NET 解决方案的“解决方案资源管理器”中双击 demo.aspx 文件来完成此操作。

双击窗体后，您可能会在窗体中看到以下代码。这是 Visual Studio 在将 Web 窗体添加到 ASP.NET 项目时添加的默认代码。该默认代码包含确保窗体能够在浏览器中作为 ASP.NET Web 窗体运行所需的步骤。

步骤2） 现在我们来添加注册用户控件的代码。下面的屏幕截图显示了添加到上述基本代码中的用户控件注册信息。

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Demo.aspx.cs" Inherits="DemoApplication.Demo" %>
<%@ Register Src="~/Guru99Control.ascx" TagName="WebControl" TagPrefix="TWebControl" %>

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
	<title></title>
</head>
<body>
	<form id="form1" runat="server">
		<TWebControl:WebControl ID="Header" runat="server" />
	</form>
</body>
</html>

Code 解释：-

第一步是注册 Web 用户控件。这包括以下基本参数：
1. 'Register' 关键字用于注册 Web 用户控件。
2. Src 参数用于定义控件的名称，在本例中为： Guru99Control.ascx。
3. TagName 和 TagPrefix 是赋予控件的单独名称。这样做是为了使其能够在 HTML 页面中像普通 HTML 控件一样被引用。
接下来，我们通过之前分配的 TagPrefix:TagName 引用我们的 Web 用户控件。TagPrefix:TagName 指示我们要使用自定义 Web 控件。当 Web 服务器处理页面时，您可以看到我们使用了 TWebControl:WebControl 标签。然后它将处理“Guru99Control' 相应地。
1. “Header”控件可以设置一个可选的ID。通常来说，给HTML控件添加ID是一个不错的做法。
2. 最后，`runat="server"` 属性确保控件在 Web 服务器上运行。对于所有 ASP.NET 控件，这是默认属性。所有 ASP.NET 控件（包括自定义控件）都必须在服务器端运行。然后，它们的输出会从服务器发送到客户端，并在浏览器中相应地显示。

当设置了上述代码，并使用以下方式执行项目 Visual Studio中，你将获得以下输出。

输出：-

浏览器中显示的输出消息表明Web用户控件已成功执行。

在 web.config 配置文件中全局注册 ASP.NET 控件

有时可能需要在.NET应用程序的多个页面上使用用户控件。此时，您肯定不想在每个ASP.NET页面上都注册用户控件。

在.Net 中，您可以在‘web.config’文件中进行注册。
web.config 文件是 .Net 项目中所有网页使用的通用配置文件。
它包含 ASP.Net Web 项目的必要配置详细信息。例如，web.config 文件中的一个常见配置是 目标框架参数.
此参数用于识别应用程序使用的.Net框架版本。

下面是 web.config 文件中默认代码的快照。突出显示的部分是目标框架部分。

让我们看看如何注册我们的 Guru99 在 web.config 文件中进行控制。

步骤1） 在解决方案资源管理器中，双击打开 web.config 文件。

打开 web.config 文件时，您可能会看到以下配置。创建项目时，Visual Studio 会自动添加“web.config”。这是使 ASP.Net 项目正常运行所需的基本配置。

步骤2） 现在让我们在 web.config 文件中注册我们的组件。我们需要为此添加以下几行。

<configuration>
	<system.web>
	 <compilation debug="true" targetFramework="4.5" />
	<pages>
		<controls>
		 <add tagPrefix="TWebControl" src="~/Guru99Control.ascx" tagName="WebControl" />
		</controls>
	</pages>
	</system.web>
</configuration>

注册过程包括以下几个子步骤：

添加一个名为。这意味着所有控件的配置都将适用于解决方案中的所有 ASP.Net 页面。
这标签意味着您正在为用户控件添加配置。
然后我们使用额外的标签注册用户控件。标签前缀、标签名称和 src 等其余参数与之前保持一致。

步骤3） 请记住访问“demo.aspx”页面，并删除注册控件的相关代码行。 Guru99 组件。如果您不执行此步骤，则“Guru99Control.ascx 文件将从 'demo.aspx' 文件而不是 'web.config' 文件执行。

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Demo.aspx.cs" Inherits="DemoApplication.Demo" %>

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
	<head runat="server">
	  <title></title>
	</head>
<body>
	<form id="form1" runat="server">
	  <TWebControl:WebControl ID="Header" runat="server" />
	</form>
</body>
</html>

设置好上述代码后，使用 Visual Studio 执行项目，您将得到以下输出。

输出：-

输出消息显示Web用户控件已成功执行。

向 Web 控件添加公共属性

属性是与任何控件关联的键值对。我们来看一个简单的例子。 HTML 标签。标签的截图如下所示。

<html>
<body>
	<div style="color:#0000FF">

		Demo Form

	</div>
</body>
</html>

“div”标签用于在 HTML 文档中创建一个部分。“div”标签有一个称为样式属性的属性。这可用于为 div 标签中显示的文本赋予不同的样式。通常，您会看到如下所示的 div 标签代码。

<div style="color:#0000FF">

因此，color 属性只不过是一个键值对，它提供了有关标签本身的更多信息。在上述情况下，键名为“style”，键值为“color:#0000FF”。

类似地，对于用户控件，您可以创建自己的描述该控件的属性。

让我们举一个简单的例子，并在此基础上展开讨论。Guru前面章节中创建了“99Control”控件。在本例中，我们将添加一个名为 MinValue 的简单整数属性。该值表示用户控件中显示的文本的最小字符数。

让我们执行以下步骤来实现这一点。

步骤1） 打开 Guru在 99Control.ascx 文件中添加用于添加 MinValue 属性的代码。

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Demo.aspx.cs" Inherits="DemoApplication.Demo" %>

	<script runat="server">
	  public int MinValue = 0;
	</script>

<table>
	<tr>
	  <td>Guru99 Tutorials</td>
	</tr>

	<tr>
	  <td> This Tutorial is for</td>
	</tr>
</table>

Code 解释：-

脚本的 runat="server" 属性用于指示我们正在添加一些 .NET 特有的代码，并且这些代码需要在 Web 服务器上运行。这是处理添加到用户控件的任何属性所必需的。然后，我们添加 MinValue 属性，并将其默认值设置为 0。

步骤2） 现在让我们在 demo.aspx 文件中引用此属性。我们现在所做的只是引用 MinValue 属性并分配新值 100。

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
	<head runat="server">
	  <title></title>
	</head>
<body>
	<form id="form1" runat="server">
	  <TWebControl:WebControl ID="Header" runat="server" MinValue="100" />
	</form>
</body>
</html>

注意: 运行这段代码后，不会显示任何输出。这是因为输出内容少于 100 个字符的限制。

常见问题

是的。AI 助手可以根据可重用组件的描述生成 .ascx 标记、代码隐藏文件和 Register 指令。 Rev查看生成的 TagPrefix、TagName 和 Src 值，确保它们与您的项目匹配。

部分可以。人工智能可以帮助将 .ascx 用户控件转换为 ASP.NET Core Razor 组件或局部视图，并标记模型中的差异。但由于不同框架处理状态和事件的方式不同，迁移仍然需要手动测试。

用户控件（.ascx）基于现有控件构建，创建简便，但仅限于单个项目。自定义控件则编译成 DLL 文件，构建难度较高，但可在多个项目中重复使用，并可在工具箱中使用。

如果控件仅用于特定页面，则只需在该页面上注册即可。如果控件在多个页面上使用，则需要在 web.config 文件中注册，这样可以避免在每个页面上重复使用 Register 指令。

ASP.NET Web 窗体教程：用户控件示例

在 ASP.Net 中创建用户控件

在 ASP.NET Web 表单上注册用户控件

在 web.config 配置文件中全局注册 ASP.NET 控件

向 Web 控件添加公共属性

常见问题

总结一下这篇文章：

注册简报

在 ASP.Net 中创建用户控件

在 ASP.NET Web 表单上注册用户控件

相关文章

在 web.config 配置文件中全局注册 ASP.NET 控件

向 Web 控件添加公共属性

常见问题

总结一下这篇文章：

注册简报