学习012-04-05-01 How to: Customize an ASP.NET Web Forms Template（如何：自定义 ASP.NET Web 窗体模板）

How to: Customize an ASP.NET Web Forms Template（如何：自定义 ASP.NET Web 窗体模板）

By default, the template content of ASP.NET Web Forms applications is provided by User Controls embedded into the DevExpress.ExpressApp.Web, and thus cannot be modified. However, you can include template content source files into your application project, modify this content and switch to it instead. This example demonstrates how to modify the DefaultVerticalTemplateContentNew template content.
默认情况下， ASP.NET Web Forms a应用程序的模板内容由嵌入到DevExpress. ExpressApp.Web中的用户控件提供，因此无法修改。但是，您可以将模板内容源文件包含到您的应用程序项目中，修改此内容并切换到它。此示例演示如何修改DefaultVerticalTemplateContentNew模板内容。

Tip
A complete sample project is available in the DevExpress Code Examples database at https://supportcenter.devexpress.com/ticket/details/e4359/xaf-how-to-add-a-navigation-history-element-to-a-custom-asp-net-template.
https://supportcenter.devexpress.com/ticket/details/e4359/xaf-how-to-add-a-navigation-history-element-to-a-custom-asp-net-template的DevExpress代码示例数据库中提供了完整的示例项目。

Add an Editable Template（添加可编辑模板）

Open the existing XAF solution or create a new one. Invoke the Template Gallery for the ASP.NET Web Forms application project, choose the XAF ASP.NET Web Forms Templates | Default Vertical Template Content project item and specify a name (e.g., “MyDefaultVerticalTemplateContent”).
打开现有XAF解决方案或创建一个新解决方案。调用ASP.NETWeb窗体应用程序项目的模板库，选择XAFASP.NETWeb窗体模板|默认垂直模板内容项目项并指定名称（例如MyDefaultVerticalTemplateContent）。
在这里插入图片描述

Note
If you use Classic Web UI, select the Deprecated Templates | Default Vertical Template Content item instead of XAF ASP.NET Web Forms Templates | Default Vertical Template Content.
如果使用经典Web UI，请选择已弃用的模板|默认垂直模板内容项而不是XAF ASP.NET Web Forms模板|默认垂直模板内容。

Important
Always add a custom template to a root folder of an ASP.NET Web Forms application project. Otherwise, image URLs may be generated incorrectly.
始终将自定义模板添加到ASP.NETWeb窗体应用程序项目的根文件夹。否则，可能会错误地生成图像URL。

The following files that implement the User Control will be added.
将添加以下实现用户控件的文件。

MyDefaultVerticalTemplateContent.ascx
MyDefaultVerticalTemplateContent.ascx.cs
MyDefaultVerticalTemplateContent.ascx.designer.cs

These files are selected in the image below, which was taken from the Solution Explorer window.
这些文件在下图中选择，该图取自解决方案资源管理器窗口。
在这里插入图片描述

Open the ASCX file. Here, you can modify the content markup. For instance, you can change the Update Panel style - replace its “4a4a4a” color with “2c86d3”.
打开ASCX文件。在这里，您可以修改内容标记。例如，您可以更改更新面板样式-将其“4a4a4a”颜色替换为“2c86d3”。
在这里插入图片描述

Use the Modified Template Instead of Default（使用修改后的模板而不是默认模板）

To use the modified content instead of default content, open the Global.asax.cs (Global.asax.vb) file and modify the Session_Start event handler. Specify a path to your custom User Control as shown below.
要使用修改后的内容而不是默认内容，请打开Global. asax.cs（Global.asax.vb）文件并修改Session_Start事件处理程序。

C#
protected void Session_Start(Object sender, EventArgs e) {
    // ...
    WebApplication.Instance.Settings.DefaultVerticalTemplateContentPath =
        "MyDefaultVerticalTemplateContent.ascx";
    WebApplication.Instance.SwitchToNewStyle();
    WebApplication.Instance.Setup();
    WebApplication.Instance.Start();
}

The image below illustrates the modified View caption style in the running application.
下图说明了正在运行的应用程序中修改后的View标题样式。
在这里插入图片描述

Note
If you want to override the default template scripts, handle the WebWindow.CustomRegisterTemplateDependentScripts event.
如果要覆盖默认模板脚本，请处理WebWindow.CustomRegisterTemplateDependentScripts事件。

Add an Action Container to the Template（将操作容器添加到模板）

The NavigationHistoryActionContainer, which displays the navigation history (breadcrumbs), is not available in the new web UI. However, you can easily add it to your custom ASP.NET Web Forms template using the following markup.
显示导航历史记录（面包屑）的NavigationHistoryActionContainer在新的Web UI中不可用。但是，您可以使用以下标记轻松地将其添加到自定义ASP.NETWeb窗体模板中。

ASPX 
<xaf:XafUpdatePanel ID="XafUpdatePanel3" runat="server">
    <xaf:NavigationHistoryActionContainer runat="server" 
        ContainerId="ViewsHistoryNavigation" 
        id ="NavigationHistoryActionContainer" 
        Delimiter=" / " />
</xaf:XafUpdatePanel>

The Action Container should be placed within the XafUpdatePanel control. The result is demonstrated below.
Action Container应该放在XafUpdatePanel控件中。结果如下所示。
在这里插入图片描述

You can use the same approach to add any other built-in or custom Action Container to a desired location within a Template. Note that your custom Action Container instance should be added to the list returned by the Template’s IFrameTemplate.GetContainers method.
您可以使用相同的方法将任何其他内置或自定义操作容器添加到模板中的所需位置。请注意，您的自定义操作容器实例应添加到模板的IFrameTemplate. GetContainers方法返回的列表中。