delphi下实现ribbon界面的方法（一）

======================================================
注：本文源代码点此下载
======================================================

office 2007和2010是现在大多数人经常使用的办公软件,几乎每天都在使用。因此,在软件中如果使用类office的界面样式,客户用着非常习惯,而且学习曲线低,office界面特有的可以收起工具栏的性质,也增大了用户的界面内容,因此,非常受广大用户的喜欢。

那么我们能不能也作出这么好的界面呢?答案当然是肯定的。这种界面的样式叫ribbon,中文名称叫丝带。在vs2010中,vc++和wcf都给ribbon的开发提供了非常好的支持,vc++下更是提供了一个完整的向导,可以作出非常漂亮的界面。但是由于。net下开发的应用程序,因为发布时需要,net框架,因此发布时应用程序非常庞大,而且win xp下没有sp3的支持,还安装不上,对客户的机器环境要求比较高,所以推广面临困难。

在winform开发一直非常优秀的delphi,能否实现呢?答案当然也是肯定的,而且开发方法非常多。delphi开发的ribbon程序,不需要任何附带的环境支持,软件发布时,只把exe文件拷贝过去就可以使用,而且delphi优秀的编译器编译出来的应用程序运行速度快、占用内存小。

那么delphi下有几种开发ribbon的方式呢?我最近查阅了一些国内外的资料,主要有三种方式,这三种方式各有所长,但是都能做出非常漂亮的ribbon程序。

今天,我就跟大家分享第一种ribbon开发方式,利用delphi2010自带的tribbon控件的开发ribbon。这种方式开发出来的程序没有office那么绚丽,但是这种方式不利用第三方组件,是免费的,因此,如果项目运行比较紧张,利用这种方式也是非常不错的选择,并且界面经过美化后,也没有想象的那么难看。

下面言归正传,我们开始开发过程。首先,建立一个vcl application。在tool palette选择tribbon控件,如下图:

放在form上,如下图:

tribbon组件是一个容器,可以把应用程序的所有操作都集成到这个tribbon控件中,并且所有的设计都是可视的非常直观,在开发时,还可以参考office的样式,当然,最好是有自己的风格。容器中可以建立应用程序菜单(application menu)、快速访问工具栏(quick access toolbar)、多个tab,每个tab下,可以建立多个组(group),每个组里面可以放多个相关联的控件。

一般情况在,与文件或者系统相关的操作都会放在应用程序菜单下,例如软件的备份恢复,换名登录,打印等等。鼠标右键tribbon,可以添加application menu,ribbon左上角会增加一个圆形图标 。(在添加application时,必须先指定tribbon组件的action manager属性,也就是在窗体中增加action manager控件,这是一个神奇的控件,整个软件的调动都是通过action manager来控制的)

经常使用的功能可以放在快速访问工具栏中,无论程序切换到那个tab,都可以通过鼠标直接点击进行操作。例如保存、撤销等等。鼠标右键tribbon,可以天剑quick access toolbar。

tab的数量要根据自己的需要,鼠标右键tribbon就可以添加 。然后再在tab中建立功能组(group)。

例如我下面的例子,因为我要做一个文本编辑器,所以我要建立主页和样式两个tab,建立一个application menu,一个quick access toolbar。主页中建立剪贴板(clipboard),段落(paragraph),字体(font),编辑(edit)、查找(find)五个group,样式中建立一个ribbon style group,delphi2010默认提供了三种ribbon的样式,分别是蓝色,黑色和银色。

tribbon组件还有一个重要的属性,就是showhelp,如果设置为true,则会在ribbon的右上角显示帮助图标,可以把帮助连接到这个图标上。

增加了这内容后,form的样式是这样的:

下面,我们添加一个richedit控件(最好是wptools组件的twprichtext控件,功能会更强大,因为版权的关系,我的演示程序就用richedit控件了)。为了美观和更贴近于word,最好是把richedit控件放在gridpanel下。运行程序,现在就可以输入文字了,但是,程序还是什么都干不了。

非常可贵的是,action manager可以给ribbon增色,actionmanager中可以增加新的action,还可以选择系统提供的标准的action。大家可以只要在界面上操作一次就会了。

我们把新加的各种action直接拖放就可以放在各个分组或者application menu上面,非常方便。经过拖放后,我的界面如下:

现在运行程序,一个简单的word就实现了,但是,ribbon的样式,还不能实现,需要编写代码(注意,到现在我们还没有编写一行代码!)。我们在action manager中自定义几个action,caption分别为:黑色、蓝色和银色,对action编程,代码如下:

procedure tform11.action1execute(sender: tobject);

begin

ribbon1.style:=ribbonlunastyle;

end;

procedure tform11.action2execute(sender: tobject);

begin

ribbon1.style := ribbonobsidianstyle;

end;

procedure tform11.action3execute(sender: tobject);

begin

ribbon1.style := ribbonsilverstyle;

end;

就实现了切换不同的ribbon风格。

但是这个软件还不行,你们发现缺少什么了吗?对,还缺少图标,没有图标指示,有时客户不知道你的功能是干什么的,尤其我的语文这么烂!o(∩_∩)o哈哈~。那么,我们就在form里面加一个imagelist,把office的图标拿下来,现在有很多软件可以做到这一点。但是,光有图标还是不行的,如果鼠标在每个图标上面的时候,都有一个非常清楚的操作提示,那么,我们的软件甚至可以没有帮助,用户一样可以很清楚的知道软件是怎么使用的,那该多好呀!delphi的ribbon组件下面专门有一个组件,就是做这个的,他的名字叫screentipsmanager,他的主要功能就是给各个功能按钮提供提示!设置tribbon控件的screentips属性为新添加的screentipsmanager,每个按钮就会显示相应的提示!默认的提示就是每个按钮的hint,我们可以修改hint,也可以在screentipsmanager控件中编辑,还可以显示提示窗口的图标、页眉、页脚。但是一定要设置form的showhint属性之后才能显示。

全部编辑完以后,界面如下:

是不是感觉很漂亮?其实做这样一个程序也就是1个小时的时间,文件大小在2m多,如果是release版并且压缩的话,1m多一点,随便拷贝到任何计算机都能用,不需要乱七八糟的框架支持。

这个程序还可以做的更好,例如加入字体字号、文字变形等,也就是word能实现的功能基本都可以实现,只是richedit控件不是很给力。要是wptools控件就好了。

下一章将利用devexpress实现ribbon,比delphi2010自带的功能要强大,但是devexpress是需要付费的,有购买过的大侠可以参考。

======================================================
在最后，我邀请大家参加新浪APP，就是新浪免费送大家的一个空间，支持PHP+MySql，免费二级域名，免费域名绑定 这个是我邀请的地址，您通过这个链接注册即为我的好友，并获赠云豆500个，价值5元哦！短网址是http://t.cn/SXOiLh我创建的小站每天访客已经达到2000+了，每天挂广告赚50+元哦，呵呵，饭钱不愁了，\(^o^)/