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文件，即此入口文件）

posted @ 2017-11-25 22:34 HelenJ 阅读(984) 评论(0) 编辑收藏举报

刷新页面返回顶部

霓好

smartClient 1--框架介绍

公告