smartClient 1--框架介绍
一、是什么(以下简称SC)
smartClient 是一个基于web技术的开发框架,主要包括:
- 一个无需安装的 Ajax/HTML5 客户端引擎
- UI组件和服务(采用富客户端RIA)— 提供大量强大而美观的 UI 控件
- 客户端/服务器数据绑定系统
二、有什么用
快速构建 大型企业应用开发(无需过多关注UI),适合基于云技术的应用,主要关注业务的发展和营销,加快开发进程
三、缺点
1、不适合传统企业网站、内容网站(从SEO角度看,该框架适合web应用,而非web网站)
2、其本质是js编写的单页面程序,对搜索引擎不友好(不利于SEO)
3、IE6兼容性差
四、运行
1、首先运行SC需要搭建web服务器,下载SC之后http://www.smartclient.com,详见http://blog.csdn.net/womeng2009/article/details/55190448
五、首页入口文件和js文件
1、SC是采用单页面的形式构建 web应用。因此,每个应用都有一个首页入口文件index.html(或者default.html)
a. 首页文件主要作用是调用SC的类库,从而能在自己的js文件中调用这些类库,生成期望的客户端UI和业务逻辑
b. 首页主要内容:至少八个js引入(包括load_skin.js,里面有十几种不同风格的皮肤,通过脚本可以改变; frameworkMessages_zh_CN.properties文件是中文包,如果使用IIS作为web服务器,则调试会出错,解决方案是将其改为frameworkMessages_zh_CN.properties.js<注意在引入的时候也要改>)
c. 添加 loading 动画:在 ISC_Fundation.js 后面(第二后引入脚本之后)(此兼容浏览器)(注意后面需要添加消失loading代码)
<script type="text/javascript"> isc.Label.create({ ID: "imgLoading", padding: 10, width: "100%", height: "100%", align: "center", valign: "center", wrap: false, icon: "/images/loading.gif", contents: "Loading..." }); </script>
2、新建js文件夹,所有的js文件都将在此。
a. 如下,创建 loading.js(放上面loading动画) 和 default.js(作为整个项目的入口代码)
(function(){
//注意:由于js没有命名空间,因此为避免命名冲突(如var isc = ''; 和SC内置对象命名冲突,此时下面的创建SC标签代码报错),实行闭包的写法(function() {......})(); isc.Label.create({ ID: "imgLoading", padding: 10, width: "100%", height: "100%", align: "center", valign: "center", wrap: false, icon: "/images/loading.gif", contents: "Loading..." }); })(); (function(){ imgLoading.destroy(); //loading标签销毁,类库加载完毕,就会运行 isc.say("hello world!"); //弹出消息的形式显示 hello world! })();
六、更多主题(可以更换系统自带主题,还可以自定义主题)
1、系统主题(web服务根目录下的isomorphic文件夹的skins下)(awd见web/awd/thirdParty/isomorphic/skins)
a. 更换主题,只需要引入不同主题文件即可
<script type="text/javascript" src="/isomorphic/skins/Graphite/load_skin.js"></script>
七、多语言支持(同更换系统皮肤,只需要引入不同的语言包即可)(iosmorphic/locales下)(awd见web/awd/thirdParty/isomorphic/locales)
1、中文字体问题(由于CSS文件定义是以英文字体、字号为标准《11px》(中文必须在12px下才能清晰显示),因此中文显示效果不理想,字体太小)
解决方案:
a. 进入对应的skin文件夹下,先备份skin_style.css.bak,然后打开skin_style.css,将font-size: 11px; font-family: xxx; 改为 font-size: 12px; font-family: Microsoft YaHei,SimSun,Arial,Verdana,sans-serif; 即可
注意:
a. 为了支持多语言,需要在入口文件中指定编码方式为 UTF-8
b. 语言包的扩展名为.properties,当以js形式加载时(用script标签引入),某些服务器会拒绝(如IIS6),因此需要手动修改扩展名(添加 .js )
八、目录结构
1、web服务器根目录下(不一定是直接根目录,放在其他文件夹如 thirdparty 亦可),和传统网页开发类似而不同如下:
web isomorphic skins //系统皮肤文件夹 system modules xxx.js //SC类库 images js xxx.js //各个业务逻辑代码 ...... default.js //入口文件,是js的入口文件,注意在html入口文件中引用时,需要放在其他js引入的最后,保证程序正常运行 css index.html //首页入口文件(单页面开发,通篇只需要一个HTML文件,即此入口文件)
版权声明:本文为hihao原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。