探索 Word 2007 开发(二):扩展 Ribbon
探索 Word 2007 开发(二):扩展 Ribbon
Written by Allen Lee
Ribbon设计器
VSTO 2005 SE以RibbonX的方式对Office 2007的Ribbon提供了支持,然而,这种支持不够直观,Visual Studio 2008 Beta 2所带的VSTO则提供了可视化的设计器支持,本文将会探讨如何使用设计器扩展Ribbon。
打开MyBlogsWordAddIn项目并创建一个新的Ribbon (Visual Designer):
Figure 1
完成Ribbon (Visual Designer) 的创建后,Visual Studio 2008 Beta 2会自动为你打开Ribbon的设计器,里面为你创建了一个标签(TabAddIns)和一个功能组(group1):
Figure 2
设计Blogging标签
我希望在Ribbon里新增一个Blogging标签放置相关的按钮,而不是和现有的按钮混在一起。要做到这样,你需要对Visual Studio 2008 Beta 2为你创建的标签进行一些设置,把ControlIdType属性的值改为Custom,然后把Label属性设置为Blogging:
Figure 3
接着,从工具箱中分别拖出一个ToggleButton和一个Button,放在Visual Studio 2008 Beta 2为你创建的功能组里,为这两个按钮分别选择你喜欢的图标(使用大小为32x32的PNG图标效果最佳),分别把它们的Label属性设置为My Blogs和Manage Blogs,并把它们的ControlSize属性设置为RibbonControlSizeLarge:
Figure 4
完成了这些操作之后,你的Visual Studio 2008 Beta 2应该会是这样的:
Figure 5
现在,我们来看看运行效果:
Figure 6
打开/关闭"我的博客"侧边栏
My Blogs按钮的实现主要有如下要求:
- Word 2007启动的时候,"我的博客"侧边栏会被加载但不显示。
- 当My Blogs按钮处于按下状态时,显示"我的博客"侧边栏;当My Blogs按钮处于释放状态时,隐藏"我的博客"侧边栏。
- 显示"我的博客"侧边栏的途径只有一个,就是通过My Blogs按钮,但隐藏它则有两个途径:通过My Blogs按钮或者位于它的右上角的X按钮。无论用户通过那种途径隐藏"我的博客"侧边栏,我们都必须保证My Blogs处于正确的状态。
首先,我们修改一下ThisAddIn.cs里的代码,去掉ThisAddIn_Startup()方法里显示"我的博客"侧边栏的语句(即把其Visible属性设为true那句):
接着,回到BloggingRibbon设计器,为My Blogs的Click事件添加Event Handler:
当我们创建一个Word Add-in项目时,Visual Studio 2008 Beta 2会自动为你创建一个Globals的类,通过这个类的ThisAddIn属性,你可以访问插件的实例。在ThisAddIn类中有一个CustomTaskPanes属性,它的类型是CustomTaskPaneCollection,里面存放着我们添加进去的CustomTaskPane,其中就包括"我的博客"侧边栏。这样,我们就可以在CustomTaskPanes中选出"我的博客"侧边栏,并把My Blogs按钮的Checked属性的值同步到它的Visible属性,从而控制它的显示与隐藏了。值得提醒的是,我在这里假设了只有"我的博客"侧边栏的Title属性的值是My Blogs。
当用户点击"我的博客"侧边栏右上角的X按钮关闭它时,我们需要正确同步My Blogs按钮的状态,这可以通过处理"我的博客"侧边栏的VisibleChanged事件做到:
值得提醒的是,Visual Studio 2008 Beta 2在创建My Blogs按钮的变量tgbMyBlogs时把它的访问修饰符设定为internal,于是,我们可以在ThisAddIn类里面直接对它进行修改。另外,你也可以把Code #01的m_MyBlogsPane的访问修饰符改为internal,这样就可以在Code #02中对Globals.ThisAddIn.m_MyBlogsPane.Visible属性直接修改而不需要查找了。
现在,我们来看看运行效果:
Figure 7
添加/删除博客信息
Manage Blogs按钮的其中一组重要功能是显示、储存和更改工作目录的当前位置,而这个位置是储存在配置中的,于是,我们得先构建好这个储存设施。打开项目的属性窗口,切换到Settings页面,在里面添加WorkingDirectory项,并将其Type设置为string,Scope设置为User:
Figure 8
当用户第一次运行插件时,工作目录和WorkingDirectory项的值都没有就绪,需要在所有自定义插件代码运行之前创建工作目录,并把WorkingDirectory项的值初始化为该目录的路径。初次运行时:
- 在我的文档目录下创建一个My Blogs文件夹;
- 在My Blogs文件夹里面创建Blogs.xml数据文件;
- 把WorkingDirectory项的值设置为第一步创建的文件夹的路径。
而当用户更改工作目录的位置时:
- 里面的东西会一并移动到新的位置;
- WorkingDirectory项的值会被设为新工作目录的路径。
Manage Blogs按钮的另一组重要功能是显示现有博客、添加新博客、更改现有博客的名字和删除现有博客。现有博客的显示是通过获取Blogs.xml里的数据来实现的。新博客的添加会依次执行如下两项操作:
- 把新博客的名字和网页地址添加到Blogs.xml里;
- 在工作目录里为新博客创建一个以其名字为名的文件夹,并在该文件夹里分别创建Posts和Drafts两个文件夹。
对于一个给定的博客,它的网页地址就是它的身份标识,一旦更改,我们就认为是一个新的博客,所以更改博客的信息仅限于更改它的名字,而这又涉及到如下两项操作:
- 把Blogs.xml里对应的博客名字改为新的名字;
- 把工作目录里对应的文件夹名字改为新的名字。
现有博客的删除也包含如下两项操作:
- 在Blogs.xml里删除该博客的对应信息;
- 在工作目录里删除该博客相关的文件夹及其内容。
这些操作将会由BlogsManager类负责:
public class BlogsManager
{
private BlogsManager()
{
}
private static BlogsManager m_Instance = new BlogsManager();
public static BlogsManager Instance
{
get { return m_Instance; }
}
public void Initialize()
{
if (String.IsNullOrEmpty(WorkingDirectory))
{
Properties.Settings.Default.WorkingDirectory = Path.Combine(
Environment.GetFolderPath(Environment.SpecialFolder.MyDocuments),
"My Blogs"
);
}
if (!Directory.Exists(WorkingDirectory))
{
Directory.CreateDirectory(WorkingDirectory);
}
string metadataPath = Path.Combine(WorkingDirectory, "Blogs.xml");
if (!File.Exists(metadataPath))
{
XElement blogsMetadata = new XElement(
"blogs", new XAttribute("defaultBlog", String.Empty)
);
blogsMetadata.Save(metadataPath);
}
}
public string WorkingDirectory
{
get
{
return Properties.Settings.Default.WorkingDirectory;
}
set
{
if (Properties.Settings.Default.WorkingDirectory != value)
{
MoveWorkingDirectoryTo(value);
Properties.Settings.Default.WorkingDirectory = value;
}
}
}
public Blog[] Blogs
{
get
{
XElement blogsMetadata = XElement.Load(
Path.Combine(WorkingDirectory, "Blogs.xml")
);
var blogs = from blog in blogsMetadata.Elements()
select new Blog
{
Name = blog.Attribute("name").Value,
Url = blog.Attribute("url").Value
};
return blogs.ToArray();
}
}
public void Add(Blog blog)
{
// Add blog info to Blogs.xml
string metadataPath = Path.Combine(WorkingDirectory, "Blogs.xml");
XElement blogsMetadata = XElement.Load(metadataPath);
blogsMetadata.Add(
new XElement("blog", new XAttribute("name", blog.Name), new XAttribute("url", blog.Url))
);
blogsMetadata.Save(metadataPath);
// Create directory structure for blog
string blogPath = Path.Combine(WorkingDirectory, blog.Name);
string postsPath = Path.Combine(blogPath, "Posts");
string draftsPath = Path.Combine(blogPath, "Drafts");
Directory.CreateDirectory(blogPath);
Directory.CreateDirectory(postsPath);
Directory.CreateDirectory(draftsPath);
}
public void Rename(string oldBlogName, string newBlogName)
{
// Modify blog info in Blogs.xml
string metadataPath = Path.Combine(WorkingDirectory, "Blogs.xml");
XElement blogsMetadata = XElement.Load(metadataPath);
XElement blogMetadata = blogsMetadata.Elements().Single(
blog => blog.Attribute("name").Value == oldBlogName
);
blogMetadata.Attribute("name").Value = newBlogName;
blogsMetadata.Save(metadataPath);
// Rename blog directory
string oldBlogPath = Path.Combine(WorkingDirectory, oldBlogName);
string newBlogPath = Path.Combine(WorkingDirectory, newBlogName);
Directory.Move(oldBlogName, newBlogName);
}
public void Remove(string blogName)
{
// Remove blog info from Blogs.xml
string metadataPath = Path.Combine(WorkingDirectory, "Blogs.xml");
XElement blogsMetadata = XElement.Load(metadataPath);
XElement blogMetadata = blogsMetadata.Elements().Single(
blog => blog.Attribute("name").Value == blogName
);
blogMetadata.Remove();
blogsMetadata.Save(metadataPath);
// Remove blog directory
string blogPath = Path.Combine(WorkingDirectory, blogName);
Directory.Delete(blogPath, true);
}
private void MoveWorkingDirectoryTo(string newPath)
{
string oldPath = WorkingDirectory;
foreach (var directory in Directory.GetDirectories(oldPath))
{
Directory.Move(
directory,
Path.Combine(newPath, Path.GetFileName(directory))
);
}
File.Move(
Path.Combine(oldPath, "Blogs.xml"),
Path.Combine(newPath, "Blogs.xml")
);
}
}
对于Code #04,以下几点是需要说明的:
- BlogsManager类的Initialize() 方法将用在ThisAddIn_Startup里所有代码之前,确保运行插件的所有前提条件都得到满足,而其它方法和属性将用在点击Manage Blogs按钮所显示的Blogs Manager对话框里。
- Blogs.xml这个文件的路径在多个地方用到,你可以考虑为BlogsManager添加一个辅助方法用于返回这个路径。
- 对于Add()、Rename() 和Remove() 三个方法,我没有为它们添加任何错误检测和处理代码,这些是必须的,但我想把这项任务留给读者(其实就是自己懒惰)。
- 另外,当用户添加新博客、更改现有博客的名字或者删除现有博客时,"我的博客"侧边栏都应该进行刷新,你可以通过事件把"我的博客"侧边栏和BlogsManager类关联起来,这项任务并不难,所以我不打算在这里多费笔墨了(明显是懒惰的借口)。
- 当某个博客的某(几)篇文章打开时,对博客更名的操作会失败,因为该操作包含对文件夹的操作,而此时文件夹正被使用,所以操作系统会拒绝对文件夹更名。这个问题是由当前设计所致的,解决办法是有很多的,老实说,我也对这个设计所造成的限制感到很不爽,然而我还是希望给读者留点思考的空间。
现在是时候说说Blogs Manager对话框了:
Figure 9
它会在加载时把BlogsManager的WorkingDirectory属性的值赋给工作目录编辑框,把BlogsManager的Blogs属性的内容填充到博客列表中:
Code #05中的博客列表结合了ImageList组件一起使用,以便为每个博客项显示一个图标。需要说明的是,你需要适当设置ImageList的ColorDepth和ImageSize这两个属性,以便取得最佳效果。
当用户点击Change按钮时,FolderBrowserDialog将会显示并让用户选择新的路径:
博客列表提供右键菜单以便用户添加新博客和删除现有博客。当用户右击列表中的某个图标时,菜单显示删除菜单项;当用户右击列表的空白处时,菜单显示添加菜单项。要做到这样,先按通常的方法实现一个具有两个菜单项的右键菜单,而这两个菜单项的Click事件的Event Handler分别是:
然后处理右键菜档的Openning事件:
当然,你也可以找到其它方法实现同样的效果,例如直接在右键菜档的Openning事件的Event Handler里根据情况动态添加菜单项,你可以自行试验一下。为了使得菜单更加美观,我决定为这两个菜单项添加图标。在Solution Explorer中双击项目里的Resources.resx项,切换到Image视图,选择Add Resource\Add Existing File…菜单项,并把你想要的图片加进来,然后分别设置这两个菜单项的Image属性(使用大小为16x16的PNG图标效果最佳):
Figure 10
对于更改现有博客的名字,我选择ListView自带的"标签编辑"功能,它使得你可以像在Windows Explorer中更改文件或文件夹的名字那样更改博客的名字。要做到这点,你要先把博客列表的LabelEdit属性设为true,然后处理它的AfterLabelEdit事件:
现在轮到用户添加新博客时显示的Blog对话框了:
Figure 11
它的任务比较简单:
- 当用户点击Cancel按钮时,把DialogResult的值设为Cancel;
- 当用户点击OK按钮时,检查两个编辑框是否为空,仅当它们同时不为空才把DialogResult的值设为OK,否则显示错误信息。
对于Cancel按钮,只需简单的把它的DialogResult属性的值设为Cancel就行了。对于OK按钮,我们需要处理它的Click事件,我在这里使用了ErrorProvider组件协助提示错误信息:
当然,别忘了BlogName和BlogUrl这两个属性:
终于到了最后一步,处理好Manage Blogs按钮的Click事件:
然后看看运行效果:
Figure 12
如果你曾经使用VSTO 2005 SE进行Ribbon开发,那么我相信你会对这里介绍的新的开发方式感到满意。然而,如果你比较习惯从前的那种方式,Visual Studio 2008 Beta 2还是能够满足你的,即在添加Ribbon扩展时选择Ribbon (XML)(参见Figure 1)。
增值服务区
- Synchronizing Ribbon and Task Pane,Andrew Whitechapel
- Office 2007 Ribbon开发,蒜头Harry
至此,Blogging Ribbon的开发要告一段落了,虽然你还有很多需求希望提出来。然而,"我的博客"侧边栏还有一个致命的问题:如果你打开多个文档,那么它只会出现在第一个打开的文档里,其它的文档里却不见踪影。虽然这是Word本身的特性所致的,然而对于用户来说却是无法接受的。下一回,我们将探讨"我的博客"侧边栏的管理问题。