自定义Template，向其中添加新的panel

参考网站：https://www.devexpress.com/Support/Center/Example/Details/E2690

思路：

新建一个DefaultTemplate:

     

在新建的Template中进行自定义，在需要自定义的位置，加入PlaceHolder控件，这里加入的是XafUpdatePanel。这里以在右边加入一个XafUpdatePanel为例。

  <td id="Right" width="250px" style="vertical-align: top">
        <cc3:XafUpdatePanel ID="UPRight" runat="server"/>
  </td>

界面如下：

为了实现能隐藏/显示Panel的功能，可以在Panel的左边加入一个分隔符。代码加入分隔符。

  <td id="RS" style="width: 6px; border-bottom-style: none; border-top-style: none"  class="dxsplVSeparator_<%= BaseXafPage.CurrentTheme %> dxsplPane_<%=BaseXafPage.CurrentTheme %>">
      <div id="RSB" class="dxsplVSeparatorButton_<%=BaseXafPage.CurrentTheme%>" onmouseover="OnMouseEnter('RSB')" onmouseout="OnMouseLeave('RSB')" onclick="OnClick('Right','RSI')">
               <div id="RSI" style="width: 8px;" class="dxWeb_splVCollapseForwardButton_<%=BaseXafPage.CurrentTheme %>">
                </div>
       </div>
 </td>

这里介绍下该段语句的简单用法，onMouseEnter()和OnMouseLeave()传入的是id号为“RSB"的div元素的id，OnClick()第一个参数记录的是要隐藏的td元素的id号，在本例中，XafUpdatePanel位于id号为"Right"的元素中，通过隐藏该元素，即可隐藏Panel。ID为”RSI"的div元素放置的时隐藏/显示符号。“〉"为dxWeb_splVCollapseForwardButton。"<"为dxWeb_spVCollapseBackwardButton。请根据分隔符的位置设置。

同理，设置左边的PlaceHolder的代码如下：

 <td id="leftPanel" width="250px" style="vertical-align: top">
      <cc3:XafUpdatePanel ID="UPLeft" runat="server"/>
 </td>
 4 <td id="RL" style="width: 6px; border-bottom-style: none; border-top-style: none"
     class="dxsplVSeparator_<%= BaseXafPage.CurrentTheme %> dxsplPane_<%= BaseXafPage.CurrentTheme %>">
    <div id="RLT" class="dxsplVSeparatorButton_<%= BaseXafPage.CurrentTheme %>" onmouseover="OnMouseEnter('RLT')"
         onmouseout="OnMouseLeave('RLT')" onclick="OnClick('leftPanel', 'RLI',true)">
            <div id="RLI" style="width: 8px;" class="dxWeb_splVCollapseBackwardButton_<%= BaseXafPage.CurrentTheme %>">
            </div>
    </div>
 </td>

完成Template的自定义工作后，要通过属性将新添加的XafUpdatePanel暴露出来。在CustomMainGISTemplate.ascx.cs中的类中添加代码如下：

         #region Expose DefineControls
         public System.Web.UI.Control RightPlaceHolder
         {
             get { return UPRight; }
         }
         public System.Web.UI.Control LeftPlaceHodler
         {
             get { return UPLeft; }
         }
         #endregion

注意，ASP.NET与WinForm在引用自定义模板的时候，有些许区别。在应用程序初始化时，默认页面就是Default.aspx。模板页（.ascx）是通过嵌入到Default.aspx中来实现的。因此，外部方法一般得通过Default.aspx文件的访问来获取customTemplate.ascx中的控件。这一点得注意。

接下来就是要定义一个外部访问接口，供XAF自动调用。

     public interface InterfaceCustomGISTemplate:IFrameTemplate
     {
         Control RightPlaceHolder { get; }
         Control LeftPlaceHodler { get; }
     }

因为上一段讨论的原因，需要在Default.aspx.cs文件中，实现该接口，才可以让其它方法访问自定义的XafUpdatePanel。从而实现初始化等工作。

 public partial class Default : BaseXafPage,InterfaceCustomGISTemplate
 {
 //......
     #region Expose CustomControl
     public Control RightPlaceHolder
     {
         get { return TemplateContent is customMainGISTemplate ? ((customMainGISTemplate)TemplateContent).RightPlaceHolder : null; }
     }
     public Control LeftPlaceHodler
     {
         get { return TemplateContent is customMainGISTemplate ? ((customMainGISTemplate)TemplateContent).LeftPlaceHodler : null; }
     }
     #endregion
 }

接下来，就可以通过实现一个controller来完成在对应的XafUpdatePanel上添加控件并初始化等操作。XAF提供了一个CustomizeTemplateViewControllerBase<T>类，以帮助用户完成对自定义模板的初始化工作。用户只需继承该基类，并实现对应的接口即可。

具体代码如下：

 public partial class GISInfoController : CustomizeTemplateViewControllerBase<InterfaceCustomGISTemplate>
 {
 //......
 protected override void AddControlsToTemplateCore(InterfaceCustomGISTemplate template)
         {
             Control rightPlaceHolder = template.RightPlaceHolder;
             if (rightPlaceHolder == null) return;
             this.rightPanel = CreatePanel("rightPanel","InformationPanel");
             licMsg = new LiteralControl("Used to show information or other related operation");
             this.rightPanel.Controls.Add(licMsg);
             rightPlaceHolder.Controls.Add(rightPanel);

             Control leftPlaceHolder = template.LeftPlaceHodler;
             if (leftPlaceHolder == null) return;
             this.leftPanel = CreatePanel("leftPanel", "DeviceSelectPanel");
             mainTV = new DevExpress.Web.ASPxTreeView.ASPxTreeView();
             mainTV.Nodes.Add("Add node");
             leftPanel.Controls.Add(mainTV);
             leftPlaceHolder.Controls.Add(leftPanel);

         }

         protected override void RemoveControlsFromTemplateCore(InterfaceCustomGISTemplate template)
         {
             Control rightPlaceHolder = template.RightPlaceHolder;
             if (rightPlaceHolder == null) return;
             rightPlaceHolder.Controls.Remove(rightPanel);
             rightPanel = null;
             licMsg = null;

             Control leftPlaceHolder = template.LeftPlaceHodler;
             if (leftPlaceHolder == null) return;
             leftPlaceHolder.Controls.Remove(leftPanel);
             leftPanel = null;
             mainTV = null;
         }

         protected override void UpdateControls(View view)
         {
             licMsg.Text = licMsg.Text+string.Format("\nCurrent View Caption is:{0}", view.Caption);
         }

         protected override void UpdateControls(object currentObject)
         {

         }

 }

最后，就是要把当前使用的默认模板替换成当前模板，具体在Global.asax中完成。

 public class Global : System.Web.HttpApplication
 {
 //......
  protected void Session_Start(Object sender, EventArgs e)
         {
             WebApplication.SetInstance(Session, new RMFSystemAspNetApplication());
             WebApplication.Instance.Settings.DefaultVerticalTemplateContentPath = "Template/customMainGISTemplate.ascx";
 //......

             WebApplication.Instance.Setup();
             WebApplication.Instance.Start();
         }
 }

生成界面如下：