SharePoint 2010 Ribbon的实现

转：http://blog.csdn.net/wang4237/article/details/5306335

SharePoint2010的页面风格发生了很大的改变，其页面风格类似于Office的视图，这种视图被称为Ribbon视图。

 

其中SharePoint里面对应得控件为SPRibbon控件。在Master page里面是这么添加这个控件的：

<SharePoint:SPRibbon runat="server" PlaceholderElementId="RibbonContainer" CssFile="">.......</SharePoint:SPRibbon>

 

在使用之前必须将Ribbon的XML结构定义好，XML路径为/TEMPLATE/GLOBAL/XML/CMDUI.XML。这个XML的具体结构，如何定义还在研究当中，会在之后发布。

 

然而这些并不够，在SharePoint2010里面，不同的页面有不同ribbon，如何去为页面设置它的ribbon，并设置Ribbon中的Button的页面弹出框的URL。

 

经过查看SharePoint源代码，在页面的后台代码中发现这么一段代码：

        SPRibbon current = SPRibbon.GetCurrent(this); if (current != null)
        {
            current.CommandUIVisible = true;
            current.MakeTabAvailable("Ribbon.Read");
            current.MakeTabAvailable("Ribbon.WebApp");
            current.InitialTabId = "Ribbon.WebApp";
            current.Minimized = false;
            SPRibbonScriptManager manager = new SPRibbonScriptManager();
            List<IRibbonCommand> commands = new List<IRibbonCommand>();
            bool admin = base.GlobalAdmin.IsCurrentUserMachineAdmin();
            commands.Add(new SPRibbonCommand("WebAppTab"));
      ......

        }

在之前给大家介绍了Ribbon的主体结构。在这次主要为大家介绍如何实现页面的定制，即在页面中如何控制ribbon中这些Button是如何Enable和Disable的和弹出页面，以及一些SharePoint的比较适用的JS方法。

 

首先现在TEMPLATE/GLOBAL/XML/CMDUI.XML中定义Tab结构。在这个XML中定义好在页面上Ribbon的Button，以及这些Button的Text,ToolTil, Image，以及排列方式。

 

之后要实现页面的Ribbon，需为这个页面定义一个JS对象，在这个对象中要声明一些方法：

仿照SharePoint，定义方式如下：

Type.registerNamespace("SP.UI.Admin");

SP.UI.Admin.TestPageComponent = function() {
    ULSITv: ;
    //SP.UI.Admin.ServiceApplicationPageComponent.initializeBase(this);
};

SP.UI.Admin.TestPageComponent.TestIsEnabled = function(a) {
    return true;
};
SP.UI.Admin.TestPageComponent.TestNavigate = function(a, b, c) {
        var b = SP.UI.$create_DialogOptions();
        b.url = a; b.dialogReturnValueCallback = SP.UI.Admin.TestPageComponent.$5_1;
        SP.UI.ModalDialog.showModalDialog(b)
};

SP.UI.Admin.TestPageComponent.prototype = {
    getFocusedCommands: function() {
        ULSITv: ; return []
    },
    getGlobalCommands: function() {
        ULSITv: ;
        return getGlobalCommands()
    },
    isFocusable: function() {
        ULSITv: ;
        return true
    },
    receiveFocus: function() {
        ULSITv: ;
        return true
    },
    yieldFocus: function() {
        ULSITv: ;
        return true
    },
    canHandleCommand: function(a) {
        ULSITv: ;
        return commandEnabled(a)
    },
    handleCommand: function(b, a, c) {
        ULSITv: ;
        return handleCommand(b, a, c)
    },
    getId: function() {
        ULSITv: ;
        return "TestPageComponent"
    },
    init: function() {
        ULSITv: ;
    },
};

prototype的getId和init方法，在SharePoint的其他JS并没有定义，但是在DEBUG代码时却发现SharePoint的JS类有这个两个方法，目前没找到他们是在哪定义，我在这直接定义，不定义就会异常。

 

SP.UI.Admin.TestPageComponent.registerClass("SP.UI.Admin.TestPageComponent", CUI.Page.PageComponent);

1.点击Ribbon的Button是触发的方法：TestNavigate

2.决定Ribbon的Button是否Enable的方法：TestIsEnabled

写完JS之后，需要在代码声明一个继承 SPRibbonCommand的类TestCommand ,

在这个类实现如下

internal sealed class TestCommand : SPRibbonCommand
    {
        public TestCommand(string commandId, string target, TestNavigateOptions options, bool admin)
            : base(commandId, null, null)
        {            
            base.HandlerStatement = string.Format(CultureInfo.InvariantCulture, "SP.UI.Admin.TestPageComponent.TestNavigate('{0}', {1}, {2})", new object[] { SPHttpUtility.EcmaScriptStringLiteralEncode(target), "true", "true");
            base.EnabledStatement = "SP.UI.Admin.TestPageComponent.TestIsEnabled(0)";
        }
}

 

 

然后在页面的后台类中写入如下代码：

protected override void OnPreRender(EventArgs e)
        {
            base.OnPreRender(e);

              SPRibbon current = SPRibbon.GetCurrent(this);
              if (current != null)
              {
                  current.CommandUIVisible = true;
                  current.MakeTabAvailable("Ribbon.Read");
                  current.MakeTabAvailable("Ribbon.Test");
                  current.InitialTabId = "Ribbon.Test";
                  current.Minimized = false;
                  SPRibbonScriptManager manager = new SPRibbonScriptManager();
                  List<IRibbonCommand> commands = new List<IRibbonCommand>();
                  bool admin = base.GlobalAdmin.IsCurrentUserMachineAdmin();

                  commands.Add(new SPRibbonCommand("TestTab"));
                  commands.Add(new SPRibbonCommand("TestG1Group"));
                  commands.Add(new TestCommand("Test_New", "test.aspx", TestNavigateOptions.AppendSelectionIdParameter, admin));
                  commands.Add(new TestCommand("Test_Extend", "extendwebfarm.aspx?WebApplicationId=", TestNavigateOptions.AppendSelectionIdParameter | TestNavigateOptions.ModalDialog, admin));
                  commands.Add(new TestCommand("Test_DeleteTop", "DeleteWebApplication.aspx?WebApplicationId=", TestNavigateOptions.DisableForCentralAdmin | TestNavigateOptions.AppendSelectionIdParameter | TestNavigateOptions.ModalDialog, admin));
                  commands.Add(new TestCommand("Test_Delete", "DeleteWebApplication.aspx?WebApplicationId=", TestNavigateOptions.DisableForCentralAdmin | TestNavigateOptions.AppendSelectionIdParameter | TestNavigateOptions.ModalDialog | TestNavigateOptions.Privileged, admin));
                  commands.Add(new TestCommand("Test_DeleteIIS", "unextendvs.aspx?WebApplicationId=", TestNavigateOptions.DisableForCentralAdmin | TestNavigateOptions.AppendSelectionIdParameter | TestNavigateOptions.ModalDialog | TestNavigateOptions.Privileged, admin));
                  commands.Add(new SPRibbonCommand("TestG2Group"));
                  commands.Add(new TestCommand("Test_SettingsTop", "vsgeneralsettings.aspx?type=gen&WebApplicationId=", TestNavigateOptions.AppendSelectionIdParameter | TestNavigateOptions.ModalDialog, admin));
                  commands.Add(new TestCommand("Test_Settings", "vsgeneralsettings.aspx?type=gen&WebApplicationId=", TestNavigateOptions.AppendSelectionIdParameter | TestNavigateOptions.ModalDialog, admin));
                  commands.Add(new TestCommand("Test_ResourceThrottling", "vsgeneralsettings.aspx?type=res&WebApplicationId=", TestNavigateOptions.AppendSelectionIdParameter | TestNavigateOptions.ModalDialog, admin));
                  commands.Add(new TestCommand("Test_Workflow", "workflowAdmin.aspx?WebApplicationId=", TestNavigateOptions.AppendSelectionIdParameter | TestNavigateOptions.ModalDialog, admin));
                  commands.Add(new TestCommand("Test_Outgoing", "VSEmail.aspx?WebApplicationId=", TestNavigateOptions.AppendSelectionIdParameter | TestNavigateOptions.ModalDialog, admin));
                  commands.Add(new TestCommand("Test_OutgoingXms", "VSXms.aspx?WebApplicationId=", TestNavigateOptions.AppendSelectionIdParameter | TestNavigateOptions.ModalDialog, admin));
                  commands.Add(new TestCommand("Test_Features", "ManageWebAppFeatures.aspx?WebApplicationId=", TestNavigateOptions.AppendSelectionIdParameter | TestNavigateOptions.ModalDialog, admin));
                  commands.Add(new TestCommand("Test_Paths", "scprefix.aspx?WebApplicationId=", TestNavigateOptions.AppendSelectionIdParameter | TestNavigateOptions.ModalDialog, admin));
                  commands.Add(new TestCommand("Test_Connections", "ApplicationAssociationsDialog.aspx?Editable=false&ApplicationId=", TestNavigateOptions.AppendSelectionIdParameter | TestNavigateOptions.ModalDialog, admin));
                  commands.Add(new TestCommand("Test_SharePointDesigner", "SharePointDesignerAdmin.aspx?WebApplicationId=", TestNavigateOptions.AppendSelectionIdParameter | TestNavigateOptions.ModalDialog, admin));

                  manager.RegisterGetCommandsFunction(this, "getGlobalCommands", commands);
                  manager.RegisterCommandEnabledFunction(this, "commandEnabled", commands);
                  manager.RegisterHandleCommandFunction(this, "handleCommand", commands);

 

                  Type type = manager.GetType();
                  MethodInfo mi = type.GetMethod("RegisterPageComponent", BindingFlags.Instance | BindingFlags.NonPublic);
                  mi.Invoke(manager, new object[] { this, "SP.UI.Admin.js", "/_layouts/SP.UI.Admin.js", "SP.UI.Admin.TestPageComponent" });

              }
        }

 

由于上面的JS代码我是直接写在SP.UI.Admin.js中的，如果是自己单独写的JS文件，将这个文件名换掉即可。

 

之前并不清楚Ribbon的Tab可以在Feature中添加，不需要修改SharePoint的TEMPLATE/GLOBAL/XML/CMDUI.XML文件

 

在Feature中定义：

 <?xml version="1.0" encoding="utf-8" ?>

- <Elements xmlns="http://schemas.microsoft.com/sharepoint/">

- <CustomAction Id="TestRibbon" Location="CommandUI.Ribbon" Sequence="100" Title="Test">

- <CommandUIExtension>

- <CommandUIDefinitions>

- <CommandUIDefinition Location="Ribbon.Tabs._children">

- <Tab Id="Ribbon.Test" Sequence="1300" Command="TestTab" Title="Test" Description="First Ribbon Test">

- ......

)  </Tab>

  </CommandUIDefinition>

  </CommandUIDefinitions>

  </CommandUIExtension>

  </CustomAction>

  </Elements>

安装Feature后即可像之前一样使用。

 

另外Ribbon对应的JS方法可以直接写在页面上，然后将代码改成：

mi.Invoke(manager, new object[] { this, "SP.UI.Admin.js", "/_layouts/SP.UI.Admin.js", "SP.UI.Admin.WebApplicationPageComponent" });

 

也就不用重新写那些JS方法，只需将下面两个方法加入ASPX页面中。

function TestIsEnabled(a) {
        return true;
    }
    function TestNavigate(a, b, c) {
        var b = SP.UI.$create_DialogOptions();
        b.url = a;
        SP.UI.ModalDialog.showModalDialog(b)
    }

熟悉SharePoint2010的人都知道，SharePoint会弹出一个窗体来单独显示一个页面， SP.UI.ModalDialog.showModalDialog就是这个功能的实现的JS代码。想更详细了解，可以访问：http://blogs.msdn.com/jfrost/default.aspx

这样的好处是可以少写一些JS代码。而核心部分PageComponent还是直接使用SharePoint的JS类。