构建一个Outlook风格漂亮界面框架,源码分享

在这里,我将分享一个Outlook风格界面框架的源代码,并详细介绍如何介绍一个漂亮、通用、可扩展、可换肤的界面框架。首先,我们来看一下这个框架的运行效果。你可以从以下地址下载该框架的可执行程序:Outlook风格界面框架

构建一个Outlook风格漂亮界面框架,源码分享_第1张图片

下面我们来介绍一下如何构建这样的界面框架。

1 实现原理

该界面框架基于OSGi.NET面向服务插件平台构建,我们希望其它插件可以通过定义界面扩展信息将插件实现的功能注册到这个界面框架中。在这个界面框架,导航栏菜单是由其它插件来注册到。当点击导航菜单时,将插件提供的窗体或者控件显示在右边的内容区域。

构建一个Outlook风格漂亮界面框架,源码分享_第2张图片

这个界面框架的实现原理同上一篇《发布一个简单界面框架源码,教你一步一步编写通用界面框架》相同,在这里我就不多累赘。接下来我将介绍如何实现这个界面框架。

2 界面框架实现

 

2.1 Outlook风格界面设计

该框架主界面由ToolStrip、NavigateBar、TabControl和StatusStrip四个控件组成,其布局如下所示。

构建一个Outlook风格漂亮界面框架,源码分享_第3张图片

2.2 界面扩展信息处理

在这里,一方面要先通过插件上下文IBundleContext获取扩展信息并处理,另一方面还要监控事件变更。

构建一个Outlook风格漂亮界面框架,源码分享_第4张图片

在AddApplication方法里,它将Extension对象转换成相应的界面元素。其实现步骤为:

(1)创建一个NavigateBarButton,对应于导航栏菜单下半部分的按钮;

(2)为NavigateBarButton相应的内容区域创建一个TreeView,用于显示导航栏具体的菜单,并为其注册菜单选择事件;

(3)设置NavigateBarButton其它属性,包括Image、ToolTipText等;

(4)记录Extension对应的对象模型WinShellApplication与NavigateBarButton的映射关系。

构建一个Outlook风格漂亮界面框架,源码分享_第5张图片

以上代码实现了扩展信息获取、为扩展信息注册界面元素的功能。该界面框架还需要响应扩展变更事件,即当插件被启动时,为其自动添加界面元素,反之当插件被停止或者卸载时,需要删除相应的界面元素。以下代码是变更事件响应。在这里,需要注意的是:由于扩展事件响应并不是在UI线程,而是一个普通线程,因此,在这个事件中,对UI界面的操作必须要由当前UI线程来操作,因此我们创建了一个Delegate并调用Control.Invoke方法将这段代码转交给UI线程操作。

构建一个Outlook风格漂亮界面框架,源码分享_第6张图片

在扩展变更事件中,RemoveApplication完成和AddApplication相反的操作,就不再赘述了。

2.3 界面框架事件

这个通用的界面框架默认处理了以下的事件:(1)点击导航菜单事件——在导航区域显示对应的窗体/界面控件;(2)内容区域选择事件——当在内容区域选择一个Tab时,需要同时选择导航区域;(3)内容区域关闭事件——点击关闭使,移除一个界面。这里,我重点介绍导航菜单事件响应。

 

当选择左边导航菜单时,我们需要为该菜单在内容区域创建一个TabPage实例,用于显示其定义的窗体或者控件。在这里,如果已经为其创建过TabPage,则直接选中,否则创建TabPage。

构建一个Outlook风格漂亮界面框架,源码分享_第7张图片

创建菜单对应的TabPage分为以下几个步骤:

(1)加载菜单对应的窗体/用户控件类型,即使用菜单对应的扩展信息的插件来加载类型。

(2)创建窗体/用户控件实例,并初始化一些基本信息;

(3)创建TabPage,将窗体/用户控件添加到该TabPage并将TabPage添加到内容区域;

(4)记录菜单和TabPage的对应关系。

构建一个Outlook风格漂亮界面框架,源码分享_第8张图片

3 界面框架源码

 

有关界面框架的构建已经基本描述完成,一些更细节的东西,比如导航树形菜单构建、扩展信息处理方法,可以查看源码。有关如何使用该界面框架的使用视频、介绍和源码,你可以从以下地址获取:http://www.iopenworks.com/Products/ProductDetails/Introduction?proID=8

 

有任何技术问题,可以加入QQ群: 121369588。

你可能感兴趣的:(out)