自己之前做的笔记,分析了一下spring roo生成的页面部分,直接copy过来,不做布局了也不难看,呵呵。。
页面部分采用的是tiles,是由几个页面拼装成的一个页面,布局由webapp\WEB-INF\layouts\layouts.xml 控制,
自动生成的layouts.xml中,设计了两个布局,一个是default,一个是public,同default的区别就是没有包含menu
这是总的控制,具体到每个页面,就由对应的views.xml来控制,roo生成的views.xml位于 views目录下,首先会有
一个基本页面的views,
<definition extends="default" name= "index">
<
put-attribute
name
=
"body"
value
=
"/WEB-INF/views/index.jspx"
/>
</
definition
>
记录的是 index 链接指向的页面继承自default,body部分由 index.jspx 来填充。除此以外还有几个其他的异常处理页面
然后会看到几个文件夹,名字是以roo生成时候的对象名来命名,意味着是对应model的操作页面,其下边包含了基本的grub页面和一个对应views.xml配置,与根目录下的配置文件不同的是,这里的页面布局一般继承自default,也就是默认的页面布局。Controller中返回的页面链接在这里可以找到。
<
definition
extends
=
"default"
name
=
"toppings/list"
>
<
put-attribute
name
=
"body"
value
=
"/WEB-INF/views/toppings/list.jspx"
/>
</
definition
>
接下来分析一下最简单的 index.jspx。
最上边的div 引入了页面中采用的 tag包,引用的写法比较简单方便,同时声明了命名空间和指向的tags包。
<
div
xmlns:spring
=
"http://www.springframework.org/tags"
xmlns:util
=
"urn:jsptagdir:/WEB-INF/tags/util"
xmlns:jsp
=
"http://java.sun.com/JSP/Page"
version
=
"2.0"
>
其中 jsp 标签用来处理页面的一些配置项,比如UTF-8的页面编码等
spring标签是spring 的标签库,在本页面中主要用来国际化:spring:message。
<
spring:message
var
=
"title"
code
=
"welcome_titlepane"
arguments
=
"
${app_name}
"
htmlEscape
=
"false"
/>
这个国际化是相当于定义变量一样,他将根据
welcome_titlepane
去message.properties国际化文件中找到对应code,并将
${app_name}
作为参数传递到code中拼成一句话,然后存到遍历 title中,下文中就可以使用 ${title} 来使用国际化了的信息。
重点util标签来了,这个标签不是标准库,是roo为了方便开发人员保留出来的库,我们可以根据
/WEB-INF/tags/util
来找到这个包的位置。页面中使用了
<
util:panel
id
=
"title"
title
=
"
${title}
"
>
,这个标签指的就是 util包下的panel.tagx。将其打开后可以看到这也是类似jspx页面的一个文件,其中也引入了一系列tags包,在文件上端整整齐齐的有一排
<jsp:directive.attribute name= "id" type ="java.lang.String" required= "true" rtexprvalue="true" description= "The identifier for this tag (do not change!)" />
<
jsp:directive.attribute
name
=
"title"
type
=
"java.lang.String"
required
=
"true"
rtexprvalue
=
"true"
description
=
"The page title (required)"
/>
<
jsp:directive.attribute
name
=
"render"
type
=
"java.lang.Boolean"
required
=
"false"
rtexprvalue
=
"true"
description
=
"Indicate if the contents of this tag and all enclosed tags should be rendered (default 'true')"
/>
。。。
这是这个tag的声明,声明了<util:panel />中可以有哪些属性,包含属性的类型和描述等信息。下边的内容就是对传入进来的这些属性进行处理,用的是标准标签库,不难看懂。虽然在这里不能调试,不过由于会被解释为基本的html,那就可以采用javascript来弹一下值 <script>alert("${id}");</script>。经过声明、处理之后,走到了
<script type="text/javascript"> dojo.require('dijit.TitlePane'); </script>
<
div
id
=
"_title_
${sec_id}
_id"
>
<
script
type
=
"text/javascript"
>
Spring.addDecoration(
new
Spring.ElementDecoration({elementId :
'_title_${sec_id}_id'
, widgetType :
'dijit.TitlePane'
, widgetAttrs : {title:
'${sec_title}'
, open: ${sec_openPane}}}));
</
script
>
<
jsp:doBody
/>
</
div
>
这里,这里就是要转换html的主体,执行了相关的javascript、填充了上文处理出来的“页面内变量”。由于panel是一个外围tags,其内部可以包含其他内容,这部分内容会在被解析完成后填充到
<
jsp:doBody
/>中,之后加上
</
div
>尾巴,该标签解析完成。我们可以通过查看源码来了解到这里被解析的结果。
<
script
type
=
"text/javascript"
>
dojo.require(
'dijit.TitlePane'
);
</
script
>
<
div
id
=
"_title_title_id"
>
<
script
type
=
"text/javascript"
>
Spring.addDecoration(
new
Spring.ElementDecoration({elementId :
'_title_title_id'
, widgetType :
'dijit.TitlePane'
, widgetAttrs : {title:
'欢迎 PizzaShop'
, open:
true
}}));
</
script
>
<
h3
>
欢迎 PizzaShop
</
h3
>
<
p
>
欢迎内容
</
p
>
</
div
>
</
div
>
通过谷歌或者火狐,能够看到dojo展开之后页面的最终结果。了解这些之后,应该可以将dojo一点一点替换成自己熟悉的js框架{Ext、JQuery}。而且可以从panels标签的构造过程来看,roo狠狠的简化了标签的开发,开发人员可以很方便的修改已有标签和开发新的标签。