《开源框架那点事儿20》:发布TinyUI前端框架
来源:互联网 发布:网络聊天电台 编辑:程序博客网 时间:2024/06/16 17:52
在执行mvn install的时候,第一次时间比较长,因为要从中央仓库下载一些资源包,可以抽支烟、喝杯茶、走走步啥的。 如果走完最后一步,就可以启动起一个本地环境(注意,没有别的应用战用8080端口),这个时候起个浏览器,输入:
?
注意,请在IE9以上浏览器、Chrome、FireFox等浏览器上浏览,目前IE8还在作适应性调整。 一些说明,本UI框架中,有一些内容取自H-UI,这个我们和H-UI源创团队进行过沟通,他们允许我们复用他们框架中的内容。 本UI框架中,在某些外在实现方面参考了SmartAdmin的一些特性,但是没有复用它的源码。 本UI框架中,集成了一些开源的JQuery插件,但是不改变原来插件的授权方式,请使用者在使用时查看原始插件的授权方式。 TinyUI的一些特性说明:
- 提供了完整的主页面框架
- 提供了整页切换和Ajax局部刷新的支持
- 提供了丰富的菜单插入点
- 提供了多种皮肤
- 提供了丰富的界面元素自定义
- 提供了UI组件包的封装
- 提供了宏封装,使得使用时不必关心具体实现
- 提供了流式布局,在手机端也有良好的展现
- 良好的解决了UI组件包之间的依赖关系
- 良好的解决了CSS合并和JS合并及其压缩方面的问题
下面我通过一些图形了做一个展示: <ignore_js_op>
上面是其中的一个页面,组件包列表是根据实际加载的组件包数量实时计算出来的,因此不需要人为进行修改---这个就是依赖TinyUiEngine的强大支持了。 <ignore_js_op>
点击设置按钮,会显示界面调整面板,在这里可以对导航条、菜单栏、导般菜单等进行固定与否的调整,也可以调整菜单的位置。还可以选择是采用全屏还是固定宽度的设置,值得一提的是如果选择固定宽度,会根据页面的宽度在970与1170宽度之间自动适应。再下面就是各种各样的主题风格了。呵呵,现在的主题风格只是简单调整了一下,用于测试,后面会请专业的美工同学进行系统性的调整。 然后,里面就是几十个组件的实际示例,我敢保证你想用的多大多组件都已经包含在内了。如果你认为还不够,请到bbs.tinygroup.org社区中留言,只要提的合理,我们会以你想象不到的速度快速进行添加。 下面我展示一个流式布局的示范: 一开始是整页宽度的固定宽度显示,还可以看到两边的阴影,现在固定宽度为1170像素。 <ignore_js_op>
我们减少它的宽度 <ignore_js_op>
它的宽度已经变成970像素宽。 再把它的宽度减少, <ignore_js_op>
可以看到两边的隐藏已经没有了。 <ignore_js_op>
由于宽度实在是小,菜单就不再完整显示,而是只显示图标了。 <ignore_js_op>
嗯嗯,效果不错,已经完整的展示了整个过程。 <ignore_js_op>
上面是菜单显示方式,可以看到是非常适合手机等触摸屏上操作的。 Tiny出品,必是精品,小伙伴们一起参与或加入我们吧!!!
欢迎访问开源技术社区:http://bbs.tinygroup.org。本例涉及的代码和框架资料,将会在社区分享。《自己动手写框架》成员QQ群:228977971,一起动手,了解开源框架的奥秘! 或点击加入QQ群:http://jq.qq.com/?_wv=1027&k=d0myfX
开源访谈录
- 《开源框架那点事儿20》:发布TinyUI前端框架
- 《开源框架那点事儿20》:发布TinyUI前端框架
- 《开源框架那点事儿20》:自己动手写前端框架
- 《开源框架那点事儿11》:软件开发杂谈
- 《开源框架那点事儿25》:对框架模板引擎实现方式的改造实录
- 《开源框架那点事儿25》:对框架模板引擎实现方式的改造实录
- SSH框架整合中的那点事儿!
- 《开源框架那点事儿13》:开源与中小型软件公司的未来趋势
- 《开源框架那点事儿17》:与屈原对话及开源精神
- 《开源框架那点事儿17》:与屈原对话及开源精神
- 《开源框架那点事儿19》:特斯拉建“桩”与开源的生命力
- 《开源框架那点事儿19》:特斯拉建“桩”与开源的生命力
- 《开源框架那点事儿19》:特斯拉建“桩”与开源的生命力
- 《开源框架那点事儿17》:与屈原对话及开源精神
- 《开源框架那点事儿14》:教计算机程序解数学题
- 《开源框架那点事儿14》:教计算机程序解数学题
- 《开源框架那点事儿15》:借船下海还是造船下海
- 《开源框架那点事儿15》:借船下海还是造船下海
- TinyDBF-用200行的DBF解析器来展示良好架构设计
- Tiny快速入门之Web界面快速开发实践
- easyui form load onLoadSuccess 的用法
- Tiny示例:对整个目录中的POM树进行批量处理
- 像写SQL一样编写Java数据应用-TinySqlDsl
- 《开源框架那点事儿20》:发布TinyUI前端框架
- 《开源框架那些事儿21》:巧借力与借巧力
- 《开源框架那些事儿22》:UI框架设计实战
- 《开源框架那点事儿23》:采用TinyDB组件方式开发
- 《开源分享1》:前端开发必备《Html-CSS中文手册》
- 《开源框架那点事儿24》:开着跑车换轮胎
- 《开源框架那些事儿26》:“最好的模板引擎”Beetl剖析及与Tiny模板引擎对比
- 《开源框架那些事儿27》一段SQL引发的性能危机及其背后隐藏的设计缺陷
- Android换肤Demo