Windows Ribbon for WinForms 开发实例

Posted 2020-11-27 zh770

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了Windows Ribbon for WinForms 开发实例相关的知识，希望对你有一定的参考价值。

Windows Ribbon for WinForms 是 Windows Ribbon Framework 的一个 .NET 托管包装。
本实例将通过开发一个仿写字板的程序演示 Windows Ribbon for WinForms 的基本用法。

开发环境：Windows 10 64位 + Visual Studio 2015

下载 Windows Ribbon for WinForms

进入 http://windowsribbon.codeplex.com 页面，点击右上角的【download archive】按钮，下载 windowsribbon.zip 控件包。

创建 WinForms 程序

启动 Visual Studio 2015，新建 Windows 窗体应用程序。
技术图片

添加 Ribbon 项目

解压刚才下载的 windowsribbon.zip 文件，把压缩包里 sourceCode 子目录中的 sourceCode.zip 文件复制到 D:RibbonForWinFormsDemo 文件夹中，并解压 sourceCode.zip 到 D:RibbonForWinFormsDemosourceCode 文件夹。
在 Visual Studio 解决方案资源管理器中，在解决方案名称上点击鼠标右键，在弹出的快捷菜单上选择“添加->现有项目…”。在弹出的“添加现有项目”对话框中选择 D:RibbonForWinFormsDemosourceCodeRibbonRibbon.csproj。
技术图片

注：如果电脑上没有安装 .NETFramework 3.5，会弹出下面的更改目标框架对话框，点 [确定] 就可以了。

然后在项目 Ribbon 上点击右键，在弹出的快捷菜单上点击“属性”，在属性窗口中更改 目标框架 为 .NET Framework 4.6.1，与主项目保持一致。
技术图片

生成 Ribbon 控件

在 Visual Studio 解决方案资源管理器中，在项目名称【Ribbon】上点击鼠标右键，在弹出的快捷菜单上选择【生成】，生成 Ribbon 控件。
技术图片

将 Ribbon 控件添加到窗体

展开【工具箱】，再展开【Ribbon 组件】，把【Ribbon】控件拖拽到窗体上。
技术图片
然后再添加一个 RichTextBox 控件，并设置 Dock 属性为 Fill。

添加 Ribbon Markup 文件

在解决方案资源管理器中，在项目名称 [RibbonForWinFormsDemo] 上点击鼠标右键，在弹出的快捷菜单上选择 [添加->新建项…]。
技术图片
在弹出的 [添加新项] 对话框中选择 [XML 文件]，然后点击右下角的 [添加] 按钮，添加 RibbonMarkup.xml 文件。

修改 RibbonMarkup.xml 文件内容为：

<?xml version="1.0" encoding="utf-8" ?>
<Application xmlns=‘http://schemas.microsoft.com/windows/2009/Ribbon‘>
  <Application.Commands>
    <Command Name="TabHome" Id="20000" LabelTitle="主页" />
    <Command Name="TabView" Id="30000" LabelTitle="查看" />
  </Application.Commands>
  <Application.Views>
    <Ribbon>
      <Ribbon.Tabs>
        <Tab CommandName="TabHome"></Tab>
        <Tab CommandName="TabView"></Tab>
      </Ribbon.Tabs>
    </Ribbon>
  </Application.Views>
</Application>

配置自动编译 Ribbon Markup 文件

在解决方案资源管理器中，在项目名称 [RibbonForWinFormsDemo] 上点击鼠标右键，在弹出的快捷菜单上选择 [属性]，打开项目属性窗口。
点击左侧的【生成事件】标签，在【预先生成事件命令行】输入如下代码：

"%PROGRAMFILES(x86)%Windows Kits8.1inx86UICC.exe" "$(ProjectDir)RibbonMarkup.xml" "$(ProjectDir)RibbonMarkup.bml" /res:"$(ProjectDir)RibbonMarkup.rc"
"%PROGRAMFILES(x86)%Windows Kits8.1inx86
c.exe" /v "$(ProjectDir)RibbonMarkup.rc" 
cmd /c "("$(DevEnvDir)....VCinvcvars32.bat") && ("$(DevEnvDir)....VCinlink.exe" /VERBOSE /NOENTRY /DLL /OUT:"$(ProjectDir)RibbonMarkup.ribbon" "$(ProjectDir)RibbonMarkup.res")"

技术图片
注：

其中 RibbonMarkup.ribbon 是我们最终需要的编译之后的目标文件
由于操作系统不同，及安装的 Windows SDK 不同，UICC.exe 和 rc.exe 所在的文件夹可能不同
由于使用了 VC 的 vcvars32.bat 和 link.exe，所以必须安装 Visual C++

生成 RibbonMarkup.ribbon 文件

在 Visual Studio 解决方案资源管理器中，在项目名称【RibbonForWinFormsDemo】上点击鼠标右键，在弹出的快捷菜单上选择【生成】，生成 RibbonMarkup.ribbon 文件。
技术图片

包含 RibbonMarkup.ribbon 文件

在解决方案资源管理器中，选中项目名称【RibbonForWinFormsDemo】，然后选中 [解决方案资源管理器] 窗口工具条中的【显示所有文件】按钮，使项目节点下显示出项目文件夹的全部文件。
技术图片
在【RibbonMarkup.ribbon】文件上点击右键，在弹出的快捷菜单上选择【包括在项目中】。

然后在 RibbonMarkup.ribbon 文件的【属性】窗口里，设置【生成操作】为嵌入的资源。

关联 RibbonMarkup.ribbon 文件到控件

打开 Form1 窗体设计器，选中 Ribbon 控件，再打开 Ribbon 控件的【属性】窗口，把右侧的滚动条拽到最底部，找到【ResourceName】属性，设置其值为 RibbonForWinFormsDemo.RibbonMarkup.ribbon。其中前半部分 RibbonForWinFormsDemo 为 Form1 窗体的命名空间，后半部分 RibbonMarkup.ribbon 为嵌入的资源文件名。
技术图片

运行程序

按 Ctrl+F5 运行程序，可以看到窗口顶部有一个 Ribbon 控件，上面有主页、查看两个选项卡。
技术图片

Ribbon Markup 文件结构

Ribbon Markup 文件主要结构如下：

<?xml version="1.0" encoding="utf-8" ?>
<Application xmlns=‘http://schemas.microsoft.com/windows/2009/Ribbon‘>
  <Application.Commands>
  </Application.Commands>
  <Application.Views>
    <Ribbon>
      <Ribbon.QuickAccessToolbar>
      </Ribbon.QuickAccessToolbar>
      <Ribbon.ApplicationMenu>
      </Ribbon.ApplicationMenu>
      <Ribbon.Tabs>
      </Ribbon.Tabs>
      <Ribbon.ContextualTabs>
      </Ribbon.ContextualTabs>
      <Ribbon.HelpButton>
      </Ribbon.HelpButton>
    </Ribbon>
    <ContextPopup>
      <ContextPopup.MiniToolbars>
      </ContextPopup.MiniToolbars>
      <ContextPopup.ContextMenus>
      </ContextPopup.ContextMenus>
      <ContextPopup.ContextMaps>
      </ContextPopup.ContextMaps>
    </ContextPopup>
  </Application.Views>
</Application>

Application.Commands 命令节点，所有命令都放在这个节点下
Ribbon.QuickAccessToolbar 快速访问工具栏
Ribbon.ApplicationMenu 应用菜单
Ribbon.Tabs 选项卡
Ribbon.ContextualTabs 上下文相关的选项卡
Ribbon.HelpButton 帮助按钮
ContextPopup 上下文菜单和工具条

剪贴板

打开 RibbonMarkup.xml 文件，在 <Application.Commands> 节点下面添加如下命令：

<Command Name="GroupClipboard" Id="21000" LabelTitle="剪贴板"/>
<Command Name="PasteButton" Id="21010" LabelTitle="粘贴" >
  <Command.TooltipTitle>粘贴(Ctrl+V)</Command.TooltipTitle>
  <Command.TooltipDescription>粘贴剪贴板的内容。</Command.TooltipDescription>
  <Command.LargeImages>
    <Image Source="Images/Paste.LargeImage.png"/>
  </Command.LargeImages>
  <Command.SmallImages>
    <Image Source="Images/Paste.SmallImage.png"/>
  </Command.SmallImages>
</Command>
<Command Name="PasteSpecialButton" Id="21011" LabelTitle="选择性粘贴" >
  <Command.TooltipDescription>选择性粘贴(Alt+Ctrl+V)</Command.TooltipDescription>
  <Command.LargeImages>
    <Image Source="Images/PasteSpecial.LargeImage.png"/>
  </Command.LargeImages>
  <Command.SmallImages>
    <Image Source="Images/PasteSpecial.SmallImage.png"/>
  </Command.SmallImages>
</Command>
<Command Name="CutButton" Id="21020" LabelTitle="剪切">
  <Command.TooltipTitle>剪切(Ctrl+X)</Command.TooltipTitle>
  <Command.TooltipDescription>从文档中剪切选定内容并将其放置到剪贴板上。</Command.TooltipDescription>
  <Command.LargeImages>
    <Image Source="Images/Cut.LargeImage.png"/>
  </Command.LargeImages>
  <Command.SmallImages>
    <Image Source="Images/Cut.SmallImage.png"/>
  </Command.SmallImages>
</Command>
<Command Name="CopyButton" Id="21030" LabelTitle="复制">
  <Command.TooltipTitle>复制(Ctrl+C)</Command.TooltipTitle>
  <Command.TooltipDescription>复制选定内容并将其放置到剪贴板上。</Command.TooltipDescription>
  <Command.LargeImages>
    <Image Source="Images/CopyCommand.LargeImage.png"/>
  </Command.LargeImages>
  <Command.SmallImages>
    <Image Source="Images/CopyCommand.SmallImage.png"/>
  </Command.SmallImages>
</Command>

然后在 <Tab CommandName="TabHome"> 节点下面添加剪贴板 <Group> 及按钮布局：

<Tab CommandName="TabHome">
  <Group CommandName="GroupClipboard" SizeDefinition="BigButtonsAndSmallButtonsOrInputs">
    <ControlGroup>
      <SplitButton>
        <SplitButton.ButtonItem>
          <Button CommandName="PasteButton"/>
        </SplitButton.ButtonItem>
        <SplitButton.MenuGroups>
          <MenuGroup Class="StandardItems">
            <Button CommandName="PasteButton"/>
            <Button CommandName="PasteSpecialButton"/>
          </MenuGroup>
        </SplitButton.MenuGroups>
      </SplitButton>
    </ControlGroup>
    <ControlGroup>
      <Button CommandName="CutButton"/>
      <Button CommandName="CopyButton"/>
    </ControlGroup>
  </Group>
</Tab>

按 Ctrl+F5 运行程序，界面如下：
技术图片

SplitButton 带有下拉菜单的按钮，注意与 DropDownButton 区分
BigButtonsAndSmallButtonsOrInputs 组内按钮排列方式
ControlGroup 用于对按钮分组，对于 BigButtonsAndSmallButtonsOrInputs 布局，必须要分组

对于 SizeDefinition 的详细说明，可参考如下链接：

剪切、复制、粘贴按钮的事件处理

Ribbon Markup 文件定义了 Ribbon 有哪些按钮，以及按钮的布局方式，对于按钮的事件处理，需要通过后台代码实现。

添加命名空间

using RibbonLib.Controls;
1

添加按钮定义

public enum RibbonCommands : uint
{
    PasteButton = 21010,
    CutButton = 21020,
    CopyButton = 21030
}

这里定义了三个按钮，对应于 Ribbon 上的粘贴、剪切、复制按钮，等号后边的数值是 RibbonMarkup.xml 文件里对应 <Command> 的 Id 值。

然后再在 Form1 类里声明三个私有变量：

private RibbonButton _cutButton;
private RibbonButton _copyButton;
private RibbonButton _pasteButton;

添加按钮事件

在 Form1 类的构造函数里实例化按钮，并关联事件处理函数：

public Form1()
{
    InitializeComponent();

    _cutButton = new RibbonButton(ribbon1, (uint)RibbonCommands.CutButton);
    _cutButton.ExecuteEvent += _cutButton_ExecuteEvent;

    _copyButton = new RibbonButton(ribbon1, (uint)RibbonCommands.CopyButton);
    _copyButton.ExecuteEvent += _copyButton_ExecuteEvent;

    _pasteButton = new RibbonButton(ribbon1, (uint)RibbonCommands.PasteButton);
    _pasteButton.ExecuteEvent += _pasteButton_ExecuteEvent;
}

再添加这三个按钮的事件处理函数：

private void _cutButton_ExecuteEvent(object sender, RibbonLib.Controls.Events.ExecuteEventArgs e)
{
    richTextBox1.Cut();
}

private void _copyButton_ExecuteEvent(object sender, RibbonLib.Controls.Events.ExecuteEventArgs e)
{
    richTextBox1.Copy();
}

private void _pasteButton_ExecuteEvent(object sender, RibbonLib.Controls.Events.ExecuteEventArgs e)
{
    richTextBox1.Paste();
}

字体

在 <Application.Commands> 节点下面添加如下命令：

<Command Name="GroupFont" Id="22000" LabelTitle="字体"/>
<Command Name="FontControl" Id="22010"/>

在 <Tab CommandName="TabHome"> 节点下面添加字体 <Group> 及字体控件：

<Group CommandName="GroupFont" >
  <FontControl CommandName="FontControl" FontType="RichFont" />
</Group>

按 Ctrl+F5 运行程序，界面如下：
技术图片

Ribbon 控件分为三大类：基本控件、容器控件、专用控件。字体控件属于专用控件。详情参考 Windows Ribbon Framework Control Library
FontType - 字体控件有三种类型：FontOnly、FontWithColor、RichFont。详情参考 FontControl element
字体控件的使用方法可参考 Windows Ribbon for WinForms, Part 14 – FontControl

段落

在 RibbonMarkup.xml 文件，在 <Application.Commands> 节点下面添加如下命令：

<Command Name="GroupParagraph" Id="23000" LabelTitle="段落"/>
<Command Name="OutdentButton" Id="23010">
  <Command.TooltipTitle>减少缩进</Command.TooltipTitle>
  <Command.TooltipDescription>减少段落的缩进级别。</Command.TooltipDescription>
  <Command.SmallImages>
    <Image Source="Images/Outdent.SmallImage.png"/>
  </Command.SmallImages>
</Command>
<Command Name="IndentButton" Id="23020">
  <Command.TooltipTitle>增加缩进</Command.TooltipTitle>
  <Command.TooltipDescription>增加段落的缩进级别。</Command.TooltipDescription>
  <Command.SmallImages>
    <Image Source="Images/Indent.SmallImage.png"/>
  </Command.SmallImages>
</Command>
<Command Name="ListButton" Id="23030">
  <Command.TooltipTitle>启动一个列表</Command.TooltipTitle>
  <Command.TooltipDescription>单击箭头可选择不同的列表样式。</Command.TooltipDescription>
  <Command.SmallImages>
    <Image Source="Images/Bullets.SmallImage.png"/>
  </Command.SmallImages>
</Command>
<Command Name="LineSpacingButton" Id="23040">
  <Command.TooltipTitle>行距</Command.TooltipTitle>
  <Command.TooltipDescription>更改文本的行间距。在段落之后添加或删除空格。</Command.TooltipDescription>
  <Command.LargeImages>
    <Image Source="Images/LineSpacingGallery.LargeImage.png"/>
  </Command.LargeImages>
  <Command.SmallImages>
    <Image Source="Images/LineSpacingGallery.SmallImage.png"/>
  </Command.SmallImages>
</Command>
<Command Name="LineSpacing10Button" LabelTitle="1.0"/>
<Command Name="LineSpacing115Button" LabelTitle="1.15"/>
<Command Name="LineSpacing15Button" LabelTitle="1.5"/>
<Command Name="LineSpacing2Button" LabelTitle="2"/>
<Command Name="LineSpacingEmptyButton" LabelTitle="在段落之后添加 10pt 的空格"/>
<Command Name="AlignLeftButton" Id="23050">
  <Command.TooltipTitle>向左对齐文本(Ctrl+L)</Command.TooltipTitle>
  <Command.TooltipDescription>将文本向左对齐。</Command.TooltipDescription>
  <Command.SmallImages>
    <Image Source="Images/AlignLeft.SmallImage.png"/>
  </Command.SmallImages>
</Command>
<Command Name="AlignCenterButton" Id="23060">
  <Command.TooltipTitle>居中(Ctrl+E)</Command.TooltipTitle>
  <Command.TooltipDescription>居中对齐文本。</Command.TooltipDescription>
  <Command.SmallImages>
    <Image Source="Images/AlignCenter.SmallImage.png"/>
  </Command.SmallImages>
</Command>
<Command Name="AlignRightButton" Id="23070">
  <Command.TooltipTitle>向右对齐文本(Ctrl+R)</Command.TooltipTitle>
  <Command.TooltipDescription>将文本向右对齐。</Command.TooltipDescription>
  <Command.SmallImages>
    <Image Source="Images/AlignRight.SmallImage.png"/>
  </Command.SmallImages>
</Command>
<Command Name="JustifyButton" Id="23080">
  <Command.TooltipTitle>对齐(Ctrl+J)</Command.TooltipTitle>
  <Command.TooltipDescription>
    同时以左右边距对齐文本，必要时在字之间添加额外的空格。
这样将使页面左右两边的外观比较整洁。
  </Command.TooltipDescription>
  <Command.SmallImages>
    <Image Source="Images/Justify.SmallImage.png"/>
  </Command.SmallImages>
</Command>
<Command Name="ParagraphGroupButton" Id="23090">
  <Command.TooltipTitle>段落</Command.TooltipTitle>
  <Command.TooltipDescription>显示“段落”对话框。</Command.TooltipDescription>
  <Command.SmallImages>
    <Image Source="Images/ParagraphGroup.SmallImage.png"/>
  </Command.SmallImages>
</Command>

然后在 <Tab CommandName="TabHome"> 节点下面添加段落 <Group> 及按钮布局：

<Group CommandName="GroupParagraph" SizeDefinition="ButtonGroups">
  <ControlGroup>
    <ControlGroup>
      <Button CommandName="OutdentButton" />
      <Button CommandName="IndentButton" />
      <SplitButtonGallery CommandName="ListButton" TextPosition="Hide" ItemHeight="76" ItemWidth="76" Type="Commands" HasLargeItems="true">
        <SplitButtonGallery.MenuLayout>
          <FlowMenuLayout Rows="3" Columns="3" Gripper="None"/>
        </SplitButtonGallery.MenuLayout>
      </SplitButtonGallery>
      <DropDownButton CommandName="LineSpacingButton">
        <MenuGroup>
          <CheckBox CommandName="LineSpacing10Button"/>
          <CheckBox CommandName="LineSpacing115Button" />
          <CheckBox CommandName="LineSpacing15Button"/>
          <CheckBox CommandName="LineSpacing2Button"/>
        </MenuGroup>
        <MenuGroup>
          <CheckBox CommandName="LineSpacingEmptyButton" />
        </MenuGroup>
      </DropDownButton>
    </ControlGroup>
  </ControlGroup>
  <ControlGroup>
    <ControlGroup>
      <ToggleButton CommandName="AlignLeftButton" />
      <ToggleButton CommandName="AlignCenterButton" />
      <ToggleButton CommandName="AlignRightButton" />
      <ToggleButton CommandName="JustifyButton" />
      <Button CommandName="ParagraphGroupButton" />
    </ControlGroup>
  </ControlGroup>
</Group>

按 Ctrl+F5 运行程序，界面如下：
技术图片

DropDownButton 另一种带有下拉菜单的按钮，注意与 SplitButton 区分
ButtonGroups 组内按钮布局方式，对于这种布局方式必须嵌套两层 ControlGroup 才行
SplitButtonGallery 一种类似于 SplitButton 的容器控件。容器控件分为 静态容器 和 动态容器 两种，SplitButtonGallery 属于动态容器，动态容器里的项目必须在 C# 代码里添加，不能直接写在 RibbonMarkup.xml 文件里。详情参考 Dynamic Containers。

添加列表 Gallery 项

添加 ImageList

打开 Form1 窗体设计器，拖拽一个 ImageList 控件到窗口上。设置 ImageList 属性如下图：
技术图片

添加命名空间

using RibbonLib;

添加按钮定义

public enum RibbonCommands : uint
{
    PasteButton = 21010,
    CutButton = 21020,
    CopyButton = 21030,
    ListButton = 23030
}

private RibbonSplitButtonGallery _listButtonGallery;

添加按钮事件

在 Form1 类的构造函数里实例化按钮，并关联事件处理函数：

_listButtonGallery = new RibbonSplitButtonGallery(ribbon1, (uint)RibbonCommands.ListButton);
_listButtonGallery.ItemsSourceReady += _listButtonGallery_ItemsSourceReady;

private void _listButtonGallery_ItemsSourceReady(object sender, EventArgs e)
{
    IUICollection itemsSource = _listButtonGallery.ItemsSource;
    itemsSource.Clear();

    for (int i = 0; i < imageList1.Images.Count; i++)
    {
        uint buttonId = (uint)RibbonCommands.ListButton + (uint)i + 1u;
        var button = new RibbonButton(ribbon1, buttonId)
        {
            LargeImage = ribbon1.ConvertToUIImage((Bitmap)imageList1.Images[i])
        };

        itemsSource.Add(new GalleryCommandPropertySet()
        {
            CommandID = buttonId,
            CommandType = RibbonLib.Interop.CommandType.Action,
        });
    }
}

按 Ctrl+F5 运行程序，界面如下：
技术图片
问题：在 RibbonMarkup.xml 文件里和 ImageList 属性里，都设置了 Gallery 项的大小为 76x76，而且图片的实际尺寸也是 76x76，但是显示出来的大小却是 32x32，不知道为什么，没有找到原因。

有关 Gallery 控件的用法，可参考 Windows Ribbon for WinForms, Part 11 – DropDownGallery, SplitButtonGallery and InRibbonGallery。

插入

<Command Name="GroupInsert" LabelTitle="插入" Id="24000"/>
<Command Name="InsertPictureFromFileButton" Id="24010" LabelTitle="图片">
  <Command.TooltipTitle>插入图片</Command.TooltipTitle>
  <Command.TooltipDescription>插入一个来自文件的图片。</Command.TooltipDescription>
  <Command.LargeImages>
    <Image Source="Images/InsertPictureFromFile.LargeImage.png"/>
  </Command.LargeImages>
  <Command.SmallImages>
    <Image Source="Images/InsertPictureFromFile.SmallImage.png"/>
  </Command.SmallImages>
</Command>
<Command Name="ReplacePictureFromFileButton" Id="24011" LabelTitle="更改图片">
  <Command.TooltipDescription>更改为另一个图片，但保留当前图片的格式和大小。</Command.TooltipDescription>
  <Command.LargeImages>
    <Image Source="Images/FormatAlbumShuffleCoverPictures.LargeImage.png"/>
  </Command.LargeImages>
  <Command.SmallImages>
    <Image Source="Images/FormatAlbumShuffleCoverPictures.SmallImage.png"/>
  </Command.SmallImages>
</Command>
<Command Name="FormatImageSizeGroupButton" Id="24012" LabelTitle="调整图片大小">
  <Command.TooltipDescription>在纵横比锁定的情况下缩放当前图片的高度和宽度或者单独缩放。</Command.TooltipDescription>
  <Command.LargeImages>
    <Image Source="Images/FormatImageSizeGroup.LargeImage.png"/>
  </Command.LargeImages>
  <Command.SmallImages>
    <Image Source="Images/FormatImageSizeGroup.SmallImage.png"/>
  </Command.SmallImages>
</Command>
<Command Name="PaintButton" Id="24020" LabelTitle="绘图">
  <Command.TooltipTitle>插入绘图(Ctrl+D)</Command.TooltipTitle>
  <Command.TooltipDescription>插入在 Microsoft 画图中创建的绘图。</Command.TooltipDescription>
  <Command.LargeImages>
    <Image Source="Images/Paint60335.png"/>
  </Command.LargeImages>
</Command>
<Command Name="DateAndTimeInsertButton" Id="24030" LabelTitle="日期和时间">
  <Command.TooltipTitle>插入日期和时间</Command.TooltipTitle>
  <Command.TooltipDescription>单击此处可获得日期和时间格式选项。</Command.TooltipDescription>
  <Command.LargeImages>
    <Image Source="Images/DateAndTimeInsert.LargeImage.png"/>
  </Command.LargeImages>
  <Command.SmallImages>
    <Image Source="Images/DateAndTimeInsert.SmallImage.png"/>
  </Command.SmallImages>
</Command>
<Command Name="ObjectButton" Id="24040" LabelTitle="插入对象">
  <Command.TooltipTitle>插入对象</Command.TooltipTitle>
  <Command.TooltipDescription>显示“插入对象”对话框。</Command.TooltipDescription>
  <Command.LargeImages>
    <Image Source="Images/Object60351.png"/>
  </Command.LargeImages>
</Command>

<Group CommandName="GroupInsert" SizeDefinition="FourButtons">
  <SplitButton>
    <SplitButton.ButtonItem>
      <Button CommandName="InsertPictureFromFileButton"/>
    </SplitButton.ButtonItem>
    <SplitButton.MenuGroups>
      <MenuGroup>
        <Button CommandName="InsertPictureFromFileButton"/>
        <Button CommandName="ReplacePictureFromFileButton"/>
        <Button CommandName="FormatImageSizeGroupButton"/>
      </MenuGroup>
    </SplitButton.MenuGroups>
  </SplitButton>
  <Button CommandName="PaintButton"/>
  <Button CommandName="DateAndTimeInsertButton"/>
  <Button CommandName="ObjectButton"/>
</Group>

技术图片

编辑

<Command Name="GroupEdit" Id="25000" LabelTitle="编辑"/>
<Command Name="FindButton" Id="25010" LabelTitle="查找">
  <Command.TooltipTitle>查找(Ctrl+F)</Command.TooltipTitle>
  <Command.TooltipDescription>在文档中查找文本。</Command.TooltipDescription>
  <Command.LargeImages>
    <Image Source="Images/FindButton.LargeImage.png"/>
  </Command.LargeImages>
  <Command.SmallImages>
    <Image Source="Images/FindButton.SmallImage.png"/>
  </Command.SmallImages>
</Command>
<Command Name="ReplaceDialogButton" Id="25020" LabelTitle="替换">
  <Command.TooltipTitle>替换(Ctrl+H)</Command.TooltipTitle>
  <Command.TooltipDescription>替换文档中的文本。</Command.TooltipDescription>
  <Command.LargeImages>
    <Image Source="Images/ReplaceDialog.LargeImage.png"/>
  </Command.LargeImages>
  <Command.SmallImages>
    <Image Source="Images/ReplaceDialog.SmallImage.png"/>
  </Command.SmallImages>
</Command>
<Command Name="SelectAllButton" Id="25030" LabelTitle="全选">
  <Command.TooltipTitle>全选(Ctrl+A)</Command.TooltipTitle>
  <Command.LargeImages>
    <Image Source="Images/SelectAll.LargeImage.png"/>
  </Command.LargeImages>
  <Command.SmallImages>
    <Image Source="Images/SelectAll.SmallImage.png"/>
  </Command.SmallImages>
</Command>

<Group CommandName="GroupEdit">
  <Button CommandName="FindButton"/>
  <Button CommandName="ReplaceDialogButton"/>
  <Button CommandName="SelectAllButton"/>
</Group>

技术图片

编辑的 <Group> 节点没有设置 SizeDefinition 属性，呈现的是默认布局。

应用菜单

<Command Name="ApplicationMenu" Id="10000"/>
<Command Name="NewButton" Id="10010"
         LabelTitle="新建"
         TooltipTitle="新建(Ctrl+N)"
         TooltipDescription="创建新文档。">
  <Command.LargeImages>
    <Image>Images/NewPage.LargeImage.png</Image>
  </Command.LargeImages>
  <Command.SmallImages>
    <Image>Images/NewPage.SmallImage.png</Image>
  </Command.SmallImages>
</Command>
<Command Name="OpenButton" Id="10020"
         LabelTitle="打开"
         TooltipTitle="打开(Ctrl+O)"
         TooltipDescription="打开现有文档。">
  <Command.LargeImages>
    <Image>Images/OpenPost.LargeImage.png</Image>
  </Command.LargeImages>
  <Command.SmallImages>
    <Image>Images/OpenPost.SmallImage.png</Image>
  </Command.SmallImages>
</Command>
<Command Name="SaveButton" Id="10030"
         LabelTitle="保存"
         TooltipTitle="保存(Ctrl+S)"
         TooltipDescription="保存活动文档。">
  <Command.LargeImages>
    <Image>Images/Save.LargeImage.png</Image>
  </Command.LargeImages>
  <Command.SmallImages>
    <Image>Images/Save.SmallImage.png</Image>
  </Command.SmallImages>
</Command>
<Command Name="SaveAsButton" Id="10040"
         LabelTitle="另存为"
         TooltipDescription="用新名称或格式保存文档。">
  <Command.LargeImages>
    <Image>Images/SaveAs.LargeImage.png</Image>
  </Command.LargeImages>
  <Command.SmallImages>
    <Image>Images/SaveAs.SmallImage.png</Image>
  </Command.SmallImages>
</Command>
<Command Name="SaveAsItemsButton" LabelTitle="保存文档的副本"/>
<Command Name="SaveAsRtfButton"
         LabelTitle="RTF 文本文档"
         LabelDescription="以 RTF 格式保存文档。">
  <Command.LargeImages>
    <Image>Images/RTF60076.png</Image>
  </Command.LargeImages>
</Command>
<Command Name="SaveAsDocxButton"
         LabelTitle="Office Open XML 文档"
         LabelDescription="以 Office Open XML 格式保存文档。">
  <Command.LargeImages>
    <Image>Images/Docx60189.png</Image>
  </Command.LargeImages>
</Command>
<Command Name="SaveAsOdtButton"
         LabelTitle="OpenDocument 文档"
         LabelDescription="以 OpenDocument 格式保存文档。">
  <Command.LargeImages>
    <Image>Images/Odt60196.png</Image>
  </Command.LargeImages>
</Command>
<Command Name="SaveAsTextButton"
         LabelTitle="纯文本文档"
         LabelDescription="将文档另存为没有换行符或格式的纯文本。">
  <Command.LargeImages>
    <Image>Images/Text60085.png</Image>
  </Command.LargeImages>
</Command>
<Command Name="SaveAsOtherButton"
         LabelTitle="其他格式"
         LabelDescription="打开“另存为”对话框从所有可能的文件类型中进行选择。">
  <Command.LargeImages>
    <Image>Images/SaveAs.LargeImage.png</Image>
  </Command.LargeImages>
</Command>

<Command Name="PrintButton" Id="10050"
         LabelTitle="打印"
         LabelDescription="在打印之前，选择打印机、份数以及其他打印选项。"
         TooltipTitle="打印(Ctrl+P)"
         TooltipDescription="打印当前文档。">
  <Command.LargeImages>
    <Image>Images/Print.LargeImage.png</Image>
  </Command.LargeImages>
  <Command.SmallImages>
    <Image>Images/Print.SmallImage.png</Image>
  </Command.SmallImages>
</Command>
<Command Name="PrintItemsButton" LabelTitle="预览并打印文档"/>
<Command Name="PrintFastButton"
         LabelTitle="快速打印"
         LabelDescription="将文档直接发送到默认打印机，而不进行任何更改。">
  <Command.LargeImages>
    <Image>Images/Print60109.png</Image>
  </Command.LargeImages>
</Command>
<Command Name="PrintPreviewButton"
         LabelTitle="打印预览"
         LabelDescription="打印之前进行预览并对页面进行更改。">
  <Command.LargeImages>
    <Image>Images/PrintPreview.LargeImage.png</Image>
  </Command.LargeImages>
</Command>
<Command Name="PageSetupButton" Id="10060"
         LabelTitle="页面设置(&amp;G)"
         TooltipTitle="页面设置"
         TooltipDescription="更改页面布局设置。">
  <Command.LargeImages>
    <Image>Images/Print60125.png</Image>
  </Command.LargeImages>
</Command>
<Command Name="MailButton" Id="10070"
         LabelTitle="在电子邮件中发送(&amp;D)"
         TooltipDescription="在电子邮件中以附件形式发送文档副本。">
  <Command.LargeImages>
    <Image>Images/EnvelopesAndLabels.LargeImage.png</Image>
  </Command.LargeImages>
</Command>

<Command Name="AboutButton" Id="10080" LabelTitle="关于写字板">
  <Command.LargeImages>
    <Image>Images/About.LargeImage.png</Image>
  </Command.LargeImages>
  <Command.SmallImages>
    <Image>Images/About.SmallImage.png</Image>
  </Command.SmallImages>
</Command>
<Command Name="ExitButton" Id="10090" LabelTitle="退出" TooltipDescription="退出写字板。">
  <Command.LargeImages>
    <Image>Images/Close.LargeImage.png</Image>
  </Command.LargeImages>
  <Command.SmallImages>
    <Image>Images/Close.SmallImage.png</Image>
  </Command.SmallImages>
</Command>

<Command Name="RecentItems" LabelTitle="最近使用的文档" />

<Ribbon.ApplicationMenu>
  <ApplicationMenu CommandName="ApplicationMenu">
    <ApplicationMenu.RecentItems>
      <RecentItems CommandName="RecentItems" EnablePinning="false" MaxCount="10" />
    </ApplicationMenu.RecentItems>
    <MenuGroup>
      <Button CommandName=‘NewButton‘ />
      <Button CommandName=‘OpenButton‘ />
      <Button CommandName=‘SaveButton‘ />
      <SplitButton>
        <SplitButton.ButtonItem>
          <Button CommandName=‘SaveAsButton‘ />
        </SplitButton.ButtonItem>
        <SplitButton.MenuGroups>
          <MenuGroup CommandName=‘SaveAsItemsButton‘ Class=‘MajorItems‘>
            <Button CommandName=‘SaveAsRtfButton‘ />
            <Button CommandName=‘SaveAsDocxButton‘ />
            <Button CommandName=‘SaveAsOdtButton‘ />
            <Button CommandName=‘SaveAsTextButton‘ />
            <Button CommandName=‘SaveAsOtherButton‘ />
          </MenuGroup>
        </SplitButton.MenuGroups>
      </SplitButton>
    </MenuGroup>
    <MenuGroup>
      <SplitButton>
        <SplitButton.ButtonItem>
          <Button CommandName=‘PrintButton‘ />
        </SplitButton.ButtonItem>
        <SplitButton.MenuGroups>
          <MenuGroup CommandName=‘PrintItemsButton‘ Class=‘MajorItems‘>
            <Button CommandName=‘PrintButton‘ />
            <Button CommandName=‘PrintFastButton‘ />
            <Button CommandName=‘PrintPreviewButton‘ />
          </MenuGroup>
        </SplitButton.MenuGroups>
      </SplitButton>
      <Button CommandName=‘PageSetupButton‘ />
      <Button CommandName=‘MailButton‘ />
    </MenuGroup>
    <MenuGroup>
      <Button CommandName=‘AboutButton‘ />
      <Button CommandName=‘ExitButton‘ />
    </MenuGroup>
  </ApplicationMenu>
</Ribbon.ApplicationMenu>

技术图片

有关应用菜单的用法，可参考 Windows Ribbon for WinForms, Part 4 – Application Menu with Buttons

快速访问工具栏

<Command Name="UndoButton"
         LabelTitle="撤销"
         TooltipTitle="撤销(Ctrl+Z)"
         TooltipDescription="撤销上一个操作。">
  <Command.LargeImages>
    <Image>Images/Undo.LargeImage.png</Image>
  </Command.LargeImages>
  <Command.SmallImages>
    <Image>Images/Undo.SmallImage.png</Image>
  </Command.SmallImages>
</Command>
<Command Name="RedoButton"
         LabelTitle="重做"
         TooltipTitle="重做(Ctrl+Y)"
         TooltipDescription="重复上一个操作。">
  <Command.LargeImages>
    <Image>Images/Redo.LargeImage.png</Image>
  </Command.LargeImages>
  <Command.SmallImages>
    <Image>Images/Redo.SmallImage.png</Image>
  </Command.SmallImages>
</Command>

<Ribbon.QuickAccessToolbar>
  <QuickAccessToolbar>
    <QuickAccessToolbar.ApplicationDefaults>
      <Button CommandName="NewButton" ApplicationDefaults.IsChecked="true" />
      <Button CommandName="OpenButton" ApplicationDefaults.IsChecked="true" />
      <Button CommandName="SaveButton" ApplicationDefaults.IsChecked="true" />
      <Button CommandName=‘MailButton‘ ApplicationDefaults.IsChecked="false" />
      <Button CommandName=‘PrintFastButton‘ ApplicationDefaults.IsChecked="false" />
      <Button CommandName=‘PrintPreviewButton‘ ApplicationDefaults.IsChecked="false" />
      <Button CommandName="UndoButton" ApplicationDefaults.IsChecked="true" />
      <Button CommandName="RedoButton" ApplicationDefaults.IsChecked="true" />
    </QuickAccessToolbar.ApplicationDefaults>
  </QuickAccessToolbar>
</Ribbon.QuickAccessToolbar>

技术图片

有关快速访问工具栏的用法，可参考 Windows Ribbon for WinForms, Part 20 – QuickAccessToolbar

源码下载

https://download.csdn.net/download/blackwoodcliff/11645212

参考

转载：https://blog.csdn.net/blackwoodcliff/article/details/99660387

以上是关于Windows Ribbon for WinForms 开发实例的主要内容，如果未能解决你的问题，请参考以下文章

7.WinFor练习--用户登录

5.WinFor练习--小闹钟程序

6.WinFor练习--简单记事本程序

JavaFx:添加顶部菜单 Microsoft Ribbon For JavaFX

Ribbon整合Consul，出现No instances available for XXX 异常

Visual Studio 2013中使用Ribbon For WPF