具有操作表和服务的示例控件设计器

项目
10/22/2014

更新：2007 年 11 月

下面的主题描述使用 ASP.NET 控件设计器的示例，该控件设计器具有服务和操作表，为自定义服务器控件提供设计时用户界面 (UI)。

下面几节包含的代码示例演示如何为自定义服务器控件创建和使用 ASP.NET 控件设计器。具体来说，本主题（以及下面列出的相关代码示例主题）演示使用设计器时涉及的以下功能和任务：

创建使用设计器主机服务和操作表的设计器。
将设计器与自定义控件关联。
将控件及其关联设计器编译成程序集。
在网页上引用控件。
在 Visual Studio 2005“设计”视图中使用控件设计器。

设计器的代码示例包括两个版本，一个用 Visual Basic 编写，另一个用 C# 编写。该示例演示使用主机服务和操作表的自定义控件设计器。可以在如何：将服务和操作列表用于控件设计器主题中找到该代码示例。在该代码示例中有四个自定义控件，它们都很简单，而且只为阐释设计器的用法而创建。其中三个自定义控件从 Panel 类派生，第四个是自定义 Button 控件。源代码中的每个面板控件还有关联的自定义设计器控件。这些设计器使用服务来允许控件与宿主环境（如 Visual Studio 2005）交互。在可视设计环境（如 Visual Studio 2005 中的“设计”视图）中，这些设计器提供代码使您可以创建设计时菜单，可通过这些菜单执行用于配置控件的各项任务。

编译示例

Visual Basic 示例和 C# 示例具有相同的功能，因此可以选择您喜欢的编程语言的示例。

若要使用所需的示例，您可以将其作为库进行编译并将生成的程序集放置到 Web 应用程序的 Bin 目录中。

下面的代码示例展示了如何在命令提示中编译示例。

vbc /r:System.dll /r:System.Design.dll /r:System.Drawing.dll /debug+ /r:System.Web.dll /t:library /out:DesignerServicesAndListsVB.dll DesignerServicesAndLists.vb

csc /r:System.dll /r:System.Design.dll /r:System.Drawing.dll /debug+ /r:System.Web.dll /t:library /out: DesignerServicesAndListsCS.dll DesignerServicesAndLists.cs

在编译该示例之后，请记住将生成的 DesignerServicesAndListsVB.dll 或 DesignerServicesAndListsCS.dll 文件复制到网站的 Bin 文件夹中。

必需的 XML 文件

除了具有控件和设计器的程序集之外，该示例还需要使用三个不同的 XML 文件。这些 XML 文件包含基本样式信息，用于演示设计器如何使用宿主环境提供的服务。在这种情况下，设计器在设计时从 XML 文件动态加载样式数据，并使用该数据更改控件在设计图面上的外观。本示例演示设计器主机服务的用法，并不是实现样式定义的建议方法。

本示例的 XML 文件与承载控件的 ASP.NET 网页位于同一个文件夹中。下面提供了 RedStyle.xml、BlueStyle.xml 和 GreenStyle.xml 文件的内容。

RedStyle.xml

<?xml version="1.0" encoding="utf-8" ?>
<styles>
    <style name="BackColor" value="red"></style>
    <style name="ForeColor" value="white"></style>
</styles>

BlueStyle.xml

<?xml version="1.0" encoding="utf-8" ?>
<styles>
    <style name="BackColor" value="blue"></style>
    <style name="ForeColor" value="white"></style>
</styles>

GreenStyle.xml

<?xml version="1.0" encoding="utf-8" ?>
<styles>
    <style name="BackColor" value="green"></style>
    <style name="ForeColor" value="white"></style>
</styles>

在 ASP.NET 页上使用示例控件和设计器

若要使用示例控件和设计器，则必须将控件放入到可以在设计器（如 Visual Studio 2005）中使用的 ASP.NET 网页上。对本示例来说，必须在 Visual Studio 2005 中将 ASP.NET 网页添加到网站。首先，创建一个新的网页。然后，在“源”视图中删除默认的页面内容，并添加下面的代码示例中显示的 Page 和 Register 指令。

<%@ page language="VB" %>
<%@ register tagprefix="aspSample" 
    assembly="DesignerServicesAndListsVB" 
    namespace="Samples.AspNet.VB.Controls" %>

<%@ page language="C#" %>
<%@ register tagprefix="aspSample" 
    assembly="DesignerServicesAndListsCS" 
    namespace="Samples.AspNet.CS.Controls" %>

说明：
Visual Basic 和 C# 指令之间的唯一差别是 Page 指令中的语言属性和 Register 指令中程序集名称的扩展名。

还必须复制以下位于 Register 指令下的标记代码。（无论使用的是 Visual Basic 还是 C#，此代码都相同。）

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
    
<head id="Head1" runat="server">
    <title>Designer Samples</title>
</head>
<body>
  <form id="form1" runat="server">
      <p style="font-family:tahoma;font-size:larger;
      font-weight:bold">
        Using Action Lists and Designer Host Services</p>
      <div style="font-family:tahoma;font-size:x-small">
        <span style="font-size: 10pt">Control #1 (ControlWithStyleTasksDesigner):
        PanelContainerDesigner using a DesignerActionList, which
        obtains a list of XML files in the project and sets 
        the style using the XML element
        definitions.</span><p />
      </div>
      <aspSample:ControlWithStyleTasks id="ctl1" 
        runat="server" 
        backcolor="Red" forecolor="White">
          Hello there.</aspSample:ControlWithStyleTasks>
      <br />
      <div style="font-family:tahoma;font-size:x-small">
        <span style="font-size: 10pt">Control #2 (ControlWithConfigurationSettingDesigner):
        PanelContainerDesigner using configuration settings
        to obtain 
        the FrameCaption value.</span><p />
      </div>
      <aspSample:ControlWithConfigurationSetting 
        id="ctl2" runat="server">
        Hello There
      </aspSample:ControlWithConfigurationSetting>
      <br />
      <div style="font-family:tahoma;font-size:x-small">
        <span style="font-size: 10pt">Control #3 (ControlWithButtonTasksDesigner):
        PanelContainerDesigner using a smart-task action 
        item to insert a new button on the Web Forms page.</span><p />
      </div>
      <aspSample:ControlWithButtonTasks 
        id="ctl3" runat="server">
        Hello There
      </aspSample:ControlWithButtonTasks>
      &nbsp; &nbsp;
  </form>
</body>
</html>

示例的配置设置

本示例中的一个设计器使用配置文件项在一个自定义控件上动态显示“设计”视图的标题。必须打开或创建一个（如果不存在的话）网站的 Web.config 文件，并向 <appSettings> 元素添加一个键，如下面的代码示例所示。

<appSettings>
  <add key="ContainerControlTitle" value="Title from Config File"/>
</appSettings>

在 Visual Studio 2005 中测试控件设计器

将编译的程序集 .dll 文件添加到网站的 Bin 文件夹、添加 XML 文件以及添加引用了自定义控件的主页面并在 Web.config 文件中创建项之后，可以在设计器中使用这些控件。请确保在 Visual Studio 2005 的“设计”视图中打开该页面。请注意，该页面上有三个面板控件。如果单击控件，会用轮廓线标出可以编辑的区域。

测试设计器服务和操作表

可以测试第一个控件的设计器，方法是：将鼠标指针定位在此控件的右上角，然后单击操作表按钮。下面的屏幕快照展示显示了操作表的控件。

显示操作表的控件
PanelContainer 控件的 VS 设计器

在操作表的**“配置 Xml”**文本框中，可以从前面创建的 XML 文件中进行选择。如果选择一个现有的 XML 文件，则会用该 XML 文件中的样式信息更新控件的设计时样式。您可以使用其他 XML 文件的名称感受此技术。

单击第三个控件的操作表按钮，将显示一个与下面的屏幕快照中显示的操作表类似的操作表。

第三个控件操作表
具有添加按钮自定义任务的 VS 设计器

**“添加按钮”命令将 Button 控件添加到设计时视图。“添加自定义按钮”**命令向该页添加自定义按钮控件的一个实例。

测试设计器服务和可编辑区域

第二个控件显示标题**“Title Added From Config”**。设计器使用设计器服务从 Web.config 文件提取此设置并将其添加到设计时视图。

该控件还显示控件的可编辑区域。可以单击可编辑区域以键入新的内容。该内容保存在页的源代码中。

请参见

任务

演练：为 Web 服务器控件创建基本控件设计器

如何：将服务和操作列表用于控件设计器

概念

ASP.NET 控件设计器概述

通过