Sharepoint进修笔记—Ribbon系列-- 4. 在Ribbon中添加新Group（针对用户自定义Tab）

来源：互联网发布：mac word简繁体切换编辑：程序博客网时间：2024/05/29 05:14

知道如何取得正确的Location，我们就可以来进一步操纵我们的自定义Ribbon对象了。这里，我们将偿试向我们在前面创建的My Custom Tab中添加一个新的Group: Custom Img Group，这个Group位于已有的Group（Custom Group）之后。

下面直接进入操纵步调

一、创建 SharePoint 项目

要添加新选项卡，应起首创建一个空白 SharePoint 项目。如下:

把此规划设置成Farm解决规划

然后在此项目平分别参加新的Feature与新的空白Element如下图

二、应用自定义操纵中的功能区 XML 定义功能区自定义项
办法是打开 CustomRibbonGroupEelement下的Elements.xml 文件，其内容如下:

<？xml version="1.0" encoding="utf-8"？>
<Elements xmlns="http://schemas.microsoft.com/sharepoint/">
    <CustomAction
      Id="Ribbon.CustomTabExample.CutomImgGroup"
      Location="CommandUI.Ribbon"
      RegistrationId="101"
      RegistrationType="List">
        <CommandUIExtension>
            <CommandUIDefinitions>
                <CommandUIDefinition
                  Location="Ribbon.CustomTabExample.Groups._children">
                    <Group
                      Id="Ribbon.CustomTabExample.CutomImgGroup"
                      Sequence="62"
                      Description="Custom Img Group"
                      Title="Custom Img Group"
                      Command="CustomTabExample.EnableCustomGroup"
                      Template="Ribbon.Templates.CustomTemplateExampleImg">
                        <Controls Id="Ribbon.CustomTabExample.CutomImgGroup.Controls" >
                            <Button
                              Id="Ribbon.CustomTabExample.CutomImgGroup.CustomImgGroupHello"
                              Command="CustomTabExample.CustomImgGroupHelloWorld"
                              LabelText="Hello，Img Group World"
                              Description="Says Hello，Img World!"
                              TemplateAlias="cust5"
                              Sequence="25" />
                            <Button
                              Id="Ribbon.CustomTabExample.CutomImgGroup.CustomImgGroupGoodbye"
                              Command="CustomTabExample.CustomImgGroupGoodbyeWorld"
                               LabelText="Good-bye， Img Group World"
                               Description="SaysGood-bye， Img World!"
                              TemplateAlias="cust6"
                              Sequence="35" />
                        </Controls>
                    </Group>
                </CommandUIDefinition>
                <CommandUIDefinition  Location="Ribbon.CustomTabExample.Scaling._children">
                    <MaxSize
                      Id="Ribbon.CustomTabExample.Scaling.CutomImgGroup.MaxSize"
                      Sequence="15"
                      GroupId="Ribbon.CustomTabExample.CutomImgGroup"
                      Size="OneLargeTwoMediumImg" />
                </CommandUIDefinition>

                <CommandUIDefinition Location="Ribbon.Templates._children">
                    <GroupTemplate Id="Ribbon.Templates.CustomTemplateExampleImg">
                        <Layout
                          Title="OneLargeTwoMediumImg"
                          LayoutTitle="OneLargeTwoMediumImg">
                            <Section Alignment="Top" Type="OneRow">
                                <Row>
                                    <ControlRef DisplayMode="Large" TemplateAlias="cust4" />
                                </Row>
                            </Section>
                            <Section Alignment="Top" Type="TwoRow">
                                <Row>
                                    <ControlRef DisplayMode="Medium" TemplateAlias="cust5" />
                                </Row>
                                <Row>
                                    <ControlRef DisplayMode="Medium" TemplateAlias="cust6" />
                                </Row>
                            </Section>
                        </Layout>
                    </GroupTemplate>
                </CommandUIDefinition>
            </CommandUIDefinitions>
            <CommandUIHandlers>
                <CommandUIHandler  Command="CustomTabExample.EnableCustomGroup"
                                   CommandAction="javascript:return true;" />

                <CommandUIHandler
                  Command="CustomTabExample.CustomImgGroupHelloWorld"
                  CommandAction="javascript:alert（""Hello， Imag Group world!""）;" />
                <CommandUIHandler
                  Command="CustomTabExample.CustomImgGroupGoodbyeWorld"
                  CommandAction="javascript:alert（""Good-bye， Img Group world!""）;" />
            </CommandUIHandlers>
        </CommandUIExtension>
    </CustomAction>
</Elements>

下面对其内容作如下申明:
起首我们要用上一篇介绍的断定Location的办法找到我们须要添加的Group应当添加在Ribbon的哪个地位。

本例我们断定的地位就是Ribbon.CustomTabExample （格局是: [Ribbon].[Tab].[你要添加的Group的名字]），我们把它定名为CutomImgGroup，所以此新的Group的ID就成了Ribbon.CustomTabExample.CutomImgGroup。如下面代码

<CustomAction
      Id="Ribbon.CustomTabExample.CutomImgGroup"
      Location="CommandUI.Ribbon"
      RegistrationId="101"
      RegistrationType="List">
        <CommandUIExtension>
            <CommandUIDefinitions>
                <CommandUIDefinition
                  Location="Ribbon.CustomTabExample.Groups._children">
                    <Group

从面上的代码我们还应当知道，因为我们断定的地位是Ribbon.CustomTabExample这个Tab ，我们要在这个Tab下添加新的Group，而这个新增的Group是这个Tab的Groups中的一个成员，所以，对于这个新增Group的正确的Location表达格局是:[Ribbon].[目标Tab].Groups._children。如许，我们就可以把我们新增的Group添加到正确的地位。

但如许还不敷，我们还须要正确的显示它，对于Ribbon元素的显示，须要重视的一是显示机会，二是显示体式格式。

对于显示机会，可以从上方的RegistrationID与RegistrationType等等属性的设置来影响，这里的设置当然要与已经存在的用户自定义的Tab的设置对峙一致，若是不合步就不会看到你新增的Group，即使它存在的地位就在这个Tab中。

接下来我们定义了须要添加的Group，这里须要重视的是Template属性，我们知道，Sharepoint Ribbon的任何Group都必须与某个GroupTemplate进行绑定，我们这里针对新添加的Group须要创建一个新的GroupTemplate: Ribbon.Templates.CustomTemplateExampleImg并将它与我们新增的Group进行绑定。下面就是我们创建的新的GroupTemplate代码

上方的代码须要重视的是 Location: Location="Ribbon.Templates._children"，这是GroupTemplate存在的地位。我们新增的Group将会到此地位去找它引用的GroupTemplate。

创建并设置了Group引用的GroupTemplate，我们还须要把Group内的Controls与这个Template的相干设置接洽关系起来，代码如下:

从代码中可以看到，我们创建了两个Button，它们经由过程TemplateAlias与GroupTemplate中设置的Section内容相接洽关系。

若是此时你安排了你的NewGroup，你会发明你可以看到它呈如今了正确的地位，但你看不到你在此中创建的Controls。这是因为我们还没有创建针对这个Group的新的Scaling与MaxSize特点。所以你须要添加下面的代码

此代码创建了一个新的Scaling设置，并经由过程Location="Ribbon.CustomTabExample.Scaling._children"断定了此Scaling属于Ribbon.CustomTabExample这个Tab的构成。然后又经由过程 GroupId="Ribbon.CustomTabExample.CutomImgGroup"把它与我们新创建的Group接洽关系了起来。

接下来的就是创建相干的Command项并与我们的Controls接洽关系，这个就不消多说了。至此，我们就完成了新的用户自定义Group的创建与添加。

  三、安排自定义Group项
     按 F5。Visual Studio 2010 中的 SharePoint 开辟对象将主动构建和安排功能。
     转到网站或子网站中的文档库。
    单击&＃8220;My Custom Tab&＃8221;选项卡，查看&＃8220;自定义组&＃8221;，然后单击&＃8220;Hello， Img World&＃8221;、&＃8220;Good-bye， Img World&＃8221;按钮。