让HelpBalloons飘在你的GSP上空
原贴地址：http://www.groovyq.net/node/124
在进行网页开发的时候，常常需要显示提示或者帮助信息，实现方法有很多种。这里介绍一种简单易用的Gails插件--HelpBalloon。可以把这个可爱的气球放在GSP的任何地方。
要使用HelpBalloon，请先做好如下两项准备工作：
安装HelpBalloon插件，执行：grails install-plugin help-balloons ；
在需要使用HelpBalloon的GSP的<head>中添加<g:helpBalloons />，它会将Prototype的JS库以及HelpBalloon相关的JS库引入到GSP中，如果你的Prototype的JS库不是在缺省位置，可以使用这个标签的base属性来指定JS库的位置，比如：<g:helpBalloons base="/myApp/myDir/" />；
下面就开始HelpBalloon之旅了！
在GSP中写入：
<g:each var="c" in="${grailsApplication.controllerClasses}">
<li class="controller">
<g:link controller="${c.logicalPropertyName}">
${c.fullName}
</g:link>
<g:helpBalloon title="my Help"
content="How to display a help balloon in GSP? "/>
</li>
</g:each>
下图是上述代码的效果图：
上图中显示的图标都是HelpBalloon的缺省值，如果需要使用自定义的图标，可以设置<head>中的<g:helpBalloons />标签的icon、button、balloonPrefix属性，比如：
<g:helpBalloons
icon="${resource(dir:'images',file:'balloon-icon1.gif')}"
button="${resource(dir:'images',file:'myButton.png')}"
balloonPrefix="${resource(dir:'images')}/balloon-" />
如下是使用自定义图标的效果图:
HelpBalloon要显示的信息也可以由message文件进行统一管理，比如message.properties文件中：“codename.suffixname= help content!!”，就可以使用HelpBalloon的code、suffix属性来显示，如下：
<g:helpBalloon title="关于书籍的说明" code="codename" suffix=".suffixname"/>
读者需要注意，suffix为可选内容，缺省值为“.help”，如果代码中没有设置suffix，HelpBalloon将message文件中codename.help的内容显示出来
效果图如下：
对于HelpBalloon中的内容，可以类似上述示例中的用法，也可以从对象中获取到，请看如下代码：
<g:helpBalloon
title="Book Info"
content="${bookInstance.moreInfo()}"/>
上述代码的意思是，可以通过book的moreInfo()方法将更多的book信息显示在HelpBalloon中，如下是book的代码：
class Book {
String name
String descript
String author="Magnolia"
Date dateCreated=new Date()
int pages=100
String isbn="ISBN 2010-03-06"
String shortname
String moreInfo(){
"""$name <br/>
<img src='/GrailsUI/images/${shortname}.jpg'/><br>
by $author /pg: $pages /ISBN: $isbn <br/>
published in $dateCreated<br/>
"""
}
}
下图是如上代码的效果图：
文章中的源代码可以从这里下载。