VSTO之旅系列(三)：自定义Excel UI

 本专题概要

• 引言
• 自定义任务窗体(Task Pane)
• 自定义选项卡，即Ribbon
• 自定义上下文菜单
• 小结

 

引言

　　在上一个专题中为大家介绍如何创建Excel的解决方案,相信大家通过从上面一个专题之后了解了Excel的对象模型，以及Office两种解决方案的，看完上一个专题之后，肯定很多朋友想为Excel自定义属于自己的UI界面，例如，有这样的一些疑问——是否可以使用VSTO来自定义选项卡呢？ 是否可以自定义上下文菜单的呢？如果你也有这些疑问的话，相信通过本专题你将会得到答案的，下面就开始我们本专题的介绍。

二、自定义任务窗体

 　　在使用Word2010的时候我们可以通过左边的导航来看了解文档的结构，同时我们也可以在输入框的地方输入文字来进行搜索，然而这个左边的导航就是一个任务窗体，相信通过下面的图大家可以理解Word中那部分是一个任务窗体：

　　但是我们在使用Excel中却没有找到类似的任务窗体，这时候大家肯定会有这样一个疑问——如果我想在Excel也想实现一个自定义任务窗体该怎么办呢？用VSTO可以帮我们办到吗？答案是肯定的。首先先模拟一个需求的，相信大家都知道使用F1是打开一个帮助文档，但是弹出的帮助文档是与Excel在不同界面的，所以很多朋友在查阅帮助的文档的时候都需要缩小Excel文档来查阅，这样就显得有些不方便了，我在使用的时候就想，能不能把帮助文档继承在Excel的右边呢？这样我们查阅Excel帮助文档就方便多了，就不要缩小Excel文档，或在Excel和帮助文档之间左右切换了。既然有这种需求，我们就有实现它的必要性，下面就具体说说如何实现的：

首先在看具体代码之前，我向大家分析下实现一个任务窗体的思路：

• 首先，任务窗体是一个窗体，当然就需要在创建的Excel解决方案中创建一个窗体的了，这里我们创建了一个用户控件。
• 创建和设计完用户控件的界面之后，我们就需要把这个用户控件添加到Excel中去了，然而我们在以前的接触的开发中，添加控件都是把控件添加到某个几个中去的，例如WinForm中要向窗体添加一个button按钮，就需要把这个button添加进Controls集合中，同样VSTO也提供这样一个把任务面板添加进去的集合—— Microsoft.Office.Tools.CustomTaskPaneCollection，我们可以通过 Globals.ThisAddIn.CustomTaskPanes这行代码来获得这个集合，然后调用Add方法就可以把我们自定义的任务面板添加进Excel中了。
• 添加进去之后，我们还需要使任务面板显示出来，这样就涉及了Visible属性了，确实 Microsoft.Office.Tools.CustomTaskPane 也有Visible属性

　　有了上面的分析过程之后，相信大家看下面的代码会比较容易理解，另外注意的一点是，因为我们要实现的帮助文档的任务窗体，由于帮助文档是在浏览器中显示的，这样我们就需要集成一个浏览器到我们的创建的用户控件中的，大家看到浏览器这个词可千万不要觉得有所畏惧，因为微软提供了WebBrowser控件来帮助我们实现，对于浏览器的更多内容可以参看我的这篇博客：自定义Web浏览器， 自定义任务窗体的代码如下：

public partial class ThisAddIn
    {
        // 定义一个任务窗体
        internal Microsoft.Office.Tools.CustomTaskPane helpTaskPane;

        private void ThisAddIn_Startup(object sender, System.EventArgs e)
        {
            // 把自定义窗体添加到CustomTaskPanes集合中
            // ExcelHelp 是一个自定义控件类
            helpTaskPane = Globals.ThisAddIn.CustomTaskPanes.Add(new ExcelHelp(""), "Excel Help");

            // 使任务窗体可见
            helpTaskPane.Visible = true;
            // 通过DockPosition属性来控制任务窗体的停靠位置，
            // 设置为 MsoCTPDockPosition.msoCTPDockPositionRight这个代表停靠到右边，这个值也是默认值
            //helpTaskPane.DockPosition = MsoCTPDockPosition.msoCTPDockPositionRight;
        }

        private void ThisAddIn_Shutdown(object sender, System.EventArgs e)
        {
        }
    }

三、自定义选项卡，即Ribbon

 上面实现的任务窗体在Excel一打开的时候就会显示停靠在Excel的右边，如下图所示：

　　然而当我们点击任务窗体中的"X"按钮就是关闭任务窗体，关闭之后就有一个问题，如果我们又想把帮助任务窗体显示出来怎么办呢？因为在Word中的导航窗体也不是一开始就显示的(有些朋友可能打开的Word文档没有导航窗体)，此时我们通过勾选视图选项卡中 “导航窗格”或点击开始选项卡中的查找按钮来显示导航窗体：

此时，我们就想在Excel中是否可以自定义一个选项卡，通过选项卡中按钮来显示/隐藏 Excel的帮助任务窗体呢？下面就具体介绍如何创建一个自定义选项卡：

1. 右键你的Excel项目，添加—>新建项，在弹出的添加新项窗口中选择 "功能区(可视化设计器)" 
2. 输入名称之后单击添加按钮
3. 设计选项卡UI界面，本例子中添加了一个toggleButton.

通过上面的步骤就可以创建一个自定义选项卡，这种方式创建的选项卡在Excel项目(针对的是外接Excel项目类型)启动的时候就会被加载。

下面具体介绍了如何设计选项卡(即Ribbon)：

1. 设计RibbonTab，首先把ControlIdType属性设置为Custom，不然我们设计的RibbonGroup部分将会在加载项选项卡下，然后设置Name为HelpTab,这样我们创建的选项卡才会成为一个新的选项卡，如果我们想把ToggleButton放在Home选项卡下显示，此时我们只需要把ControlIdType设置为Office，然后把OfficeId设置为TabHome, 具体情况大家可以测试看看的，关于Office 中内置的Control ID 列表，大家可以从下面这个链接下载：  

   2007 Office System Document: Lists of Control IDs 

　　2. 从工具箱中拖出一个ToggleButton，把Label属性设置为Help，并把ControlSize属性设置为RibbonControlSizeLarge：

　3. 双击 Help ToggleButton按钮，实现它的单击事件：

// 帮助选项卡中toggleButton的单击事件
        private void toggleHelpBtn_Click(object sender, RibbonControlEventArgs e)
        {
            // 通过toggleHelpButton的选中状态来控制帮助任务栏的显示和隐藏
            Globals.ThisAddIn.helpTaskPane.Visible = toggleHelpBtn.Checked;
        }

　　通过上面的三步也就完成了一个Ribbon的创建了，当我们创建好一个Ribbon之后，我们可以通过我们自定义的Ribbon下的按钮来显示/隐藏我们的任务窗体，但是到这里，Ribbon的开发并没有结束，此时还有一个问题就是——当我们点击 “Excel help”右上角的X按钮关闭时，我们Ribbon下的按钮状态也要跟着更变(大家可以测试，当我们关闭Word中的导航任务窗体时，试图下的"导航窗格"复选框“也会跟着改变)，此时我们就需要实现：点击关闭按钮与Help按钮状态同步的功能的，此时我们只需要对TaskPane的VisibleChanged事件进行处理就可以（因为关闭任务窗体就会触发该事件，所以只需要把同步状态的代码放在该事件就可以了),具体代码如下：

// 定义一个任务窗体
        internal Microsoft.Office.Tools.CustomTaskPane helpTaskPane;

        private void ThisAddIn_Startup(object sender, System.EventArgs e)
        {
            // 把自定义窗体添加到CustomTaskPanes集合中
            // ExcelHelp 是一个自定义控件类
            helpTaskPane = Globals.ThisAddIn.CustomTaskPanes.Add(new ExcelHelp(""), "Excel Help");

            // 使任务窗体可见
            //helpTaskPane.Visible = true;
            // 通过DockPosition属性来控制任务窗体的停靠位置，
            // 设置为 MsoCTPDockPosition.msoCTPDockPositionRight这个代表停靠到右边，这个值也是默认值
            //helpTaskPane.DockPosition = MsoCTPDockPosition.msoCTPDockPositionRight;

            // 当用户点击 “Excel help”右上角的X按钮关闭时，我们需要同步选项卡上button的状态
            helpTaskPane.VisibleChanged += new EventHandler(helpTaskPane_VisibleChanged);

            // 添加上下文菜单
            //AddToCellMenu();
        }

        private void ThisAddIn_Shutdown(object sender, System.EventArgs e)
        {
        }

        // 用户点击  "Excel Help" 侧边栏右上角的X按钮关闭它时
        // 我们需要正确同步 “帮助”按钮的状态
        // 我们可以通过处理 “Excel Help”侧边栏的VisualChanged 事件完成
        private void helpTaskPane_VisibleChanged(object sender, EventArgs e)
        {
            // 获得Help Ribbon 对象
            Help helpRibbon = Globals.Ribbons.GetRibbon<Help>();
            // 同步Help Ribbon下的"帮助"按钮的状态
            helpRibbon.toggleHelpBtn.Checked = Globals.ThisAddIn.helpTaskPane.Visible;
        }

运行效果图为：

      

四、自定义上下文菜单

 看完上面两部分的实现之后，我在学习的过程中又想——能不能通过右键菜单来显示/隐藏任务窗体呢? 对于这点VSTO也是可以做到的，我们只需要添加CommandBarButton对象（当我们右键一个单元格(即为Cell)的时候,我们可以看到一上下文菜单，菜单内所有控件(不管是按钮还是排序这样的菜单控件)），然后设置该对象的属性和添加一个Click事件，主要代码如下：

// 添加一个自定义按钮到单元格上下文菜单中
           contextMenu =Application.CommandBars["Cell"];
           CommandBarButton commandBarbtn = (CommandBarButton)contextMenu.Controls.Add(MsoControlType.msoControlButton, Before: 1);
           commandBarbtn.Tag = "Help_Tag";
           commandBarbtn.Caption = "查看帮助";
           commandBarbtn.FaceId = 49;
           commandBarbtn.Click+=new _CommandBarButtonEvents_ClickEventHandler(commandBarbtn_Click);

运行效果为(这样我们右键Cell的时候就会多出一个我们自己定义的 ”查看帮助“按钮)：

五、小结

　　到这里本专题的内容就介绍完了，本专题主要介绍如何为Excel创建一个自定义的任务窗体、Ribbon和上下文菜单，对于Word和Outlook这部分的内容我就不重复介绍，创建方式和Excel的创建方式很类似。在下一个专题中我将给大家介绍下如何创建Word解决方案。