ToyBricks
ToyBricks(积木)(以下简称ToyBricks)是基于面向积木方法论构建的、面向Java开发(尤其是RIA应用)的开源开发平台, 旨在提供给开发者一个简单易用、高效率、高产品质量、易扩展的开源平台,“像搭积木一样开发软件”。
ToyBricks解决了很多长期困扰Java开发者的问题,如:
1)开发所应用的“平台”都是拼凑而成而非真正意义上的整合解决方案
。
事实上,很多软件公司的平台都是用开源软件“混搭”而成,典型的,如 SSH(Struts+Spring+Hibernate)、FSH(Flex+Spring+Hibernate)等,这种混搭方案天然的割裂了作为组件 的完整性,因为很多组件是横跨展现、业务逻辑甚至持久层的 ;
2)JavaEE中Web开发规范的缺陷。
在当前的JavaEE开发中,作为一个功能,页面与业务逻辑、配置等文件是分散在不同地方的
(页面jsp、
html、js、css、图片等等一般放在工程rootFolder的某个文件夹中;业务逻辑放在classpath下;配置文件有时候要放在WEB-INF
文件夹中),这种分散天然的破坏了作为一个功能的“聚合”要求
(事实上在我们日常的设计工作中,人们追求松耦合更甚于高聚合),我们很多时候是希望作为一个功能的全部文件放在一起的;
这种分散式的结构直接导致了“一个功能或模块打包形成一个jar文件作为产出物”的困难
。
3)多个功能、模块之间的冲突问题
。
jar冲突是最显而易见的了,不同模块要求同一jar的版本可能不同,由于缺乏像OSGI那样的单元(OSGI中为Bundle) 隔离机制,所以只能一方向另一方妥协;
4)编程模型复杂、学习难度高
。
无论Struts的MVC、Flex的组件模型、Spring的IOC/AOP、Hibernate的ORM等等,其学习与应用 都是有一定难度的;
5)缺乏组件模型或组件模型复杂。
可复用的资源积累是一个软件企业知识资产积累的重要组成部分 ,以JSP的Tag为例,目前很多企业内部只有少部分高 水平技术人员被授权开发公司应用的标签库,这严重限制了可复用资源的积累;
6)缺乏清晰的功能、模块边界。
功能、模块之间高度耦合,且耦合分散在各个角落,导致模块拆分困难 ;
ToyBricks目前提供的功能
1)ToyBricks JavaBean运行容器;
2)Aquarell模板引擎;
3)RIA实现;
4)常规组件库:
1】 UI 类
1. 按钮(支持下拉菜单、状态控制、图标自动匹配)
2. Text 编辑器(支持自定义扩展、校验器等)
3. TextArea 编辑器(支持自定义扩展、校验器等)
4. Combox 编辑器(可组合其他编辑器、支持即时搜索(可配置客户端或服务端数据源)、校验器等等)
5. 日期(时间)选择器(支持可配置的年月、年月日、年月日时间、时间等等选择)
6. HTML 编辑器(基于 CKEditor ,支持各类常规操作,可通过配置 mode (模式)为 basic/cms 等来批量选择功能按钮)
7. 选择树编辑器(支持单选、多选、节点锁定等等)
8. 文件上传(基于 Flex 技术、支持单个与多文件上传、限制类型、大小、各类回调函数等等)
9. 代码高亮显示
10. 数据表格(支持列排序、列搜索、单元格编辑、分页、行菜单、表格菜单、预定义模板按钮等等)
11. *格式表格
12. Tree (支持节点懒加载、工具条按钮扩展、节点菜单等等)
13. 表单( Form )(支持编辑器*布局与格式化布局、支持值自动分发与收集、统一校验等等)
14. 菜单(无限层级支持、状态控制、动态数据源等等)
15. 菜单条
16. TabBox (支持 Tab 懒加载、锁定等)
17. 工具条
18. 对话框
19. CSS 引用(支持全局(页面)唯一引用)
20. JavaScript 引用(支持全局(页面)唯一引用)
21. Splitter
22. 图标库(预置了上百种各类图标,提供非常简单的扩展机制)
2】 数据源(基于 Toplink ( JPA ),支持基于 JPA 规范的 ORM ,支持多数据源,域对象自动发现等等)
3】 Dao (同时支持基于 JPA 规范与原生 SQL )
ToyBricks的特性
1)开发者只需要掌握简单的Java、Html(简单的Javascript及CSS)即可
;
2)搭积木的开发体验
,开发者只需要编写必须的代码;
3)ToyBricks提供了丰富的组件库
;
4)桌面级的用户产品体验
;
5)应用即组件、一切皆组件
。事实上,实际开发中有约50%以上都是重复的功能,基于ToyBricks体系,您可以将您想要的一切封装成组件;
6)一个功能(模块、甚至系统)可以打包成一个jar文件,边界清晰
;
7)运行时隔离;
8)比OSGI更简单的扩展机制
(套娃模型);
9)搭配ToyBricks的WebOS平台,您已经拥有了一套完整的系统;
ToyBricks平台结构
【下载ToyBricks平台(V4.0)核心源代码】 见附件
【下载ToyBricks平台源代码许可协议】 见附件
【下载ToyBricks平台开发手册】 见附件
【下载Demo样例】 MyEclipse工程形式的Demo(下载附件后(共三部分),解压缩,import入MyEclipse即可)
Demo工程源码简单分析
1.文件结构
2.源代码片段
project.ria.xml
该文件定义了应用程序
<?xml version="1.0" encoding="UTF-8"?> <prolet id="helloworld" title="Helloworld" view="helloworld.aq.html" class="HelloworldBiz"> <!-- 子应用程序 --> <subpro id="dialog0" title="对话框" view="dialog0.aq.html" /> <subpro id="dialog1" title="helloworld作为组件使用" view="dialog1.aq.html" /> </prolet>
HelloworldBiz 主应用程序的业务逻辑
package helloworld;
import java.util.HashMap;
import java.util.Map;
import org.cloudsinger.components.util.ListDataModel;
import org.cloudsinger.toybricks.api._JunctionTo;
public class HelloworldBiz {
private String name = "Hello ToyBricks.";
public void setName(String _name) {
name = _name;
}
/**
* ajax调用返回结果
*
* @return
*/
public String getName() {
return name;
}
/**
* 挂接到组件(demoGrid)的依赖项(getDataSource),获取数据源
* <p>
* 数据表格获取数据源有多种方法,如直接给出jpaSql、如本例中给出结果集等等
* </p>
*
* @return
*/
@_JunctionTo("this/demoGrid:getDataSource")
public ListDataModel<Map<String, String>> getDemoGridDS() {
ListDataModel<Map<String, String>> rtn = new ListDataModel<Map<String, String>>();
Map<String, String> row = new HashMap<String, String>();
row.put("id", "20110203");
row.put("title", "面向积木编程");
rtn.getDataList().add(row);
rtn.getDataList().add(row);
rtn.getDataList().add(row);
rtn.getDataList().add(row);
rtn.getDataList().add(row);
rtn.getDataList().add(row);
rtn.getDataList().add(row);
rtn.getDataList().add(row);
rtn.getDataList().add(row);
rtn.getDataList().add(row);
rtn.getDataList().add(row);
rtn.getDataList().add(row);
rtn.getDataList().add(row);
rtn.getDataList().add(row);
rtn.getDataList().add(row);
rtn.getDataList().add(row);
rtn.getDataList().add(row);
rtn.getDataList().add(row);
rtn.getDataList().add(row);
rtn.getDataList().add(row);
rtn.getDataList().add(row);
rtn.getDataList().add(row);
rtn.getDataList().add(row);
rtn.getDataList().add(row);
rtn.getDataList().add(row);
rtn.getDataList().add(row);
rtn.getDataList().add(row);
rtn.getDataList().add(row);
return rtn;
}
}
helloworld.aq.html 主应用程序的视图
<!-- 引用ToyBricks的UI组件库 -->
<#taglib use="cloudsinger.components/ui/*" for="cs"/>
<style>
.tt{
background-color:#f1f1f1;
height:50px;font-family:微软雅黑;font-size:16px;font-weight:bold;
line-height:50px;
}
</style>
<script>
function sayHello(){
var msg = ${window}.ajax("getName");
alert("您单击的结果是:"+msg+",右键单击可以显示菜单哦");
}
function showDialog(){
${window}.dialogR("dialog0",500,400);
}
function showOtherHelloworld(){
${window}.dialog("dialog1",700,400);
}
</script>
<#-- 打印变量 --#>
<div class="tt">${name}</div>
<#-- 菜单条组件 --#>
<cs:Menubar>
<cs:Menu title="文件">
<cs:item title="打开对话框" onclick="showDialog" />
<cs:item title="将helloworld作为组件打开" onclick="showOtherHelloworld" />
<cs:item />
<cs:item title="其他">
<cs:item title="子菜单项目" onclick="alert('子菜单项目')" />
<cs:item title="子菜单项目" onclick="alert('子菜单项目')" />
<cs:item title="子菜单项目" onclick="alert('子菜单项目')" />
</cs:item>
</cs:Menu>
<cs:Menu title="帮助">
<cs:item title="关于" onclick="alert('ToyBricks开放平台演示应用程序')"/>
</cs:Menu>
</cs:Menubar>
<#-- 工具条组件 --#>
<cs:Toolbar>
<cs:Button title="新建" onclick="alert('新建')" />
<cs:Button title="打开对话框" onclick="showDialog" />
<cs:Button title="将helloworld作为组件打开" onclick="showOtherHelloworld" />
<cs:Button/>
<cs:Button title="关于">
<cs:menu>
<cs:Menu>
<cs:item title="关于" onclick="alert('ToyBricks开放平台演示应用程序')"/>
</cs:Menu>
</cs:menu>
</cs:Button>
</cs:Toolbar>
<#-- 菜单组件,注册为按钮btn的右键菜单 --#>
<cs:Menu apply="#btn">
<cs:item title="测试菜单项" />
<cs:item title="新建" />
<cs:item />
<cs:item title="其他">
<cs:item title="测试菜单项" />
</cs:item>
</cs:Menu>
<#-- 数据列表组件 --#>
<cs:DataGrid id="demoGrid" style="height:300px;width:100%;">
<cs:columns>
<cs:colum field="id" title="ID" />
<cs:colum field="title" title="标题" />
</cs:columns>
<cs:rows onDblClick="showDialog">
<cs:menu>
<cs:Menu>
<cs:item title="打开对话框" onclick="showDialog" />
<cs:item title="将helloworld作为组件打开" onclick="showOtherHelloworld" />
</cs:Menu>
</cs:menu>
</cs:rows>
</cs:DataGrid>
dialog0.aq.html 第一个对话框的视图
<#taglib use="cloudsinger.components/ui/*" for="cs"/>
<cs:TabBox>
<cs:Tab title="欢迎">
<img id="imm" src="${lafPath}/welcome.gif" />
</cs:Tab>
<cs:Tab title="Tab页面1">
<div>abc</div>
</cs:Tab>
</cs:TabBox>
dialog1.aq.html 第二个对话框的视图
<#taglib use="helloworld" for="hw"/>
<div style="border:1px dashed red;">
<hw:helloworld name="应用程序即组件,我也是一个组件哦"/>
</div>
运行效果如下图:
天云创意.基础平台研发团队
合作者意向联系方式 Mail:[email protected] QQ 16384284
美丽人生.精彩创意 天云创 意