ExtJS 2.0 的PHP封装

yipsilon

浏览: 246929 次
性别:
来自: 大连

最近访客更多访客>>

一个java程序员

Corey_KouRui

风窗的故事

CH.smallhow

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

项目: CMSPAD

PHP JavaScript EXT 脚本 OO

本来想自己研发UI库，自从看到了ExtJS，我们彻底打消了重复造轮子的想法，也决定使用ExtJS来作为CMSPAD UI部分的基础类库。于是，偶们想到了一个个人感觉比较BT的方法来实现它--使用PHP来进行封装。

（以下代码和演示已经验证可用）
先看看运行ExtJS库PHP代码：

<?php
import('ExtJS:ExtApplication');
import('ExtJS:ExtButton');
import('ExtJS:ExtMessageBox');
class Test1 implements ExtRunnable{
	
  /**
   * @param ExtApplication $application
   */
  public function run($application){
    $button = new ExtButton(array('text' => 'hello world!', 'width' => '500px', 'renderTo' => 'extButton'), 'button');
    $button->disable();
    /*
    $msgbox = new ExtMessageBox(array('title' => 'Address', 'msg' => 'Please enter your address:', 'width' => 300, 'buttons' => ExtConstant::getConstant('OKCANCEL'), 'multiline' => true), 'msgbox');
    */
    ExtMessageBox::alert('Hello', 'World!');
  }
}
?>

以上代码假设保存在inc/test/Test1.php文件中，再看看前台模板是怎么调用的：

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Extjs 2.0 Example Test</title>
    <!-- 调用ExtJS自带的样式文件 -->
    <{portlet name="ExtJS" view="stylesheets"}>
    <!-- 调用ExtJS的脚本文件，当前指定的是所有脚本 -->
    <{portlet name="ExtJS" view="javascripts" extra="all" debug=true}>
    <!-- 执行Test1，也就是上面的文件 -->
    <{portlet name="ExtJS" view="application" main="ExtJS:test.Test1"}>
  </head>
  <body>
    <div id="extButton"></div>
    This is body.
  </body>
</html>

下面看看附件中的执行效果截图，页面中有三个元素：一个被禁用的按钮、一个文本和一个对话框。正好是执行的那两个。看起来，还是好用的。:)

以下是输出HTML页面的源代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Extjs 2.0 Example Test</title>
    <!-- 调用ExtJS自带的样式文件 -->
    <link rel="stylesheet" type="text/css" href="/CMSPAD/kernel/../portlet/ExtJS/lib/resources/css/ext-all.css" />
    <!-- 调用ExtJS的脚本文件，当前指定的是所有脚本 -->
    <script type="text/javascript" src="/CMSPAD/kernel/../portlet/ExtJS/lib/adapter/ext/ext-base.js"></script>
    <script type="text/javascript" src="/CMSPAD/kernel/../portlet/ExtJS/lib/ext-all-debug.js"></script>
    <!-- 执行Test1，也就是上面的文件 -->
    <script type="text/javascript">
      Ext.onReady(function(){
        var button = new Ext.Button({text:'hello world!',width:'500px',renderTo:'extButton'});
        button.disable();
        Ext.MessageBox.alert('Hello','World!');
      });
    </script>
  </head>
  <body>
    <div id="extButton"></div>
    This is body.
  </body>
</html>

目前UI系统之正在初级验证和架构阶段，封装了一些常用代码，把小家伙们累惨了*_*。待到进入Beta测试时，我会发布更多特性～～

大家还有什么想法，可以一起研究哦～～

查看图片附件

分享到：

只有一个文件的ORM工具包：CMSPAD Object! | 感受PHPortlet技术的几个实用的特性

2007-12-01 01:06
浏览 5652
评论(9)
论坛回复 / 浏览 (9 / 4952)
分类:Web前端
查看更多

9 楼 yipsilon 2007-12-03

yeaha 写道

对于初学者而言，把js跟服务器端脚本混为一谈就是比较危险的事，js最大的毛病就是效率问题和浏览器兼容问题，初学者很容易掉到这两个坑里，会写出逻辑正确但是实际用起来很不爽，很慢的东西
对于熟练工，降低门槛的效用又没有什么意义
不过楼主的想法的确有点意思，在某些特定场合也许很合适

恩，就是因为JS跟服务器端脚本混为一谈是很危险的，所以，我觉得只让他们学习服务器端脚本，或者说利用服务器端脚本的方式来操作JS，那样就不会产生两种语言混淆的危险了，不是么？

8 楼 yeaha 2007-12-03

7 楼 yipsilon 2007-12-03

chenjf2k 写道

没有必要这么做，使用EXT技术而只要求开发人员仅具备初级javascript水平，这是非常危险的，效果往往适得其反...
封装后虽然使用方便了，但对于扩展性和移植性都不太好

这位仁兄的回答，我不太清楚为什么是非常危险的。之所以要封装它：

因为，“我们没有找到这套ExtJS库到底是给谁来做”这个问题的答案。如果要让美工使用它，那将是比较困难的，毕竟美工的能力点并不在于熟悉Javascript，而是页面设计能力，再者说，学习面向对象的概念是比较吃力的，更别说像javascript和ExtJS（例如对applyTo、extend、override等函数的理解）这样结构特殊的语言。

如果让程序员来使用它，在没有版本管理（据说好多小的项目或团队还使用着FTP和最后修改日期来管理项目文件）的情况下，会出现两者同时修改的文件被覆盖的情况，这样就不好办了。

其实以上分析最重要的在于扩展问题：美工要扩展ExtJS大多数情况下肯定是不行了，毕竟不是干这一行的；程序员呢，可以学会，但要不断滴在后台程序和前台模板之间切换，在后台程序中编写硬性的JS生成代码、在前台模板中加入相关的标签和代码，而且会发生上述的错误，这在一定程度上会降低开发效率。而这套封装库，目前应该说一点儿扩展性都没有，但不代表以后也没有，如果我们找到了合适的扩展方法，那会同时解决上面分析的问题，程序员不用深入学习Javascript面向对象的语法和ExtJS库的操作方式，也不用不时滴切换思路了，而美工只需要把心思全面关注到界面设计（包括CSS）了。归根到底，还是降低了用人和学习成本。呵呵...

PS：我觉得封装代码在Java中应该更好实现，毕竟在我眼里它是超强的。：）

6 楼 yipsilon 2007-12-03

sp42 写道

PHP以操作数组为中心（虽然PHP5更OO），JS以操作HASH TABLE为中心（object based==hash/ or object as container）,楼主何不以向原汁原味的JS学习，收获或者更大！

PHP的数组概念，一部分就是Hashtable的概念，例如：$arr = array('key1' = > 'value1', 'key2' => 2); 使用时： $arr['key1'] $arr['name'] $arr[7] ... 所以，我们做这套东西时也是为了简化开发，全面使用PHP数组来作为必要数据的操作。而面向对象，更多是为了兼容ExtJS的functions。

5 楼 chenjf2k 2007-12-02

yipsilon 写道

本来我们封装的目的就是想在PHP中使用跟Javascript基本一样的语法来操作ExtJS 2.0库。这样有个好处就是，其他PHP开发人员并不需要深入学习Javascript语言，降低了企业用人的技术门槛，可以更快速地让开发人员投入到工作状态。而且，PHP封装的库在对象和函数上基本跟原JS库的结构基本相同，这样，如果有必要的需求，PHP的开发人员要直接使用Javascript操作ExtJS库时，因了解其结构，入门也更快速些。总体来说，就是降低开发人员的初期技术门槛，为项目贡献自己最大的力量。呵呵。

4 楼 yipsilon 2007-12-02

3 楼 yipsilon 2007-12-02

2 楼 cnpollux 2007-12-01

嗯。ExtJS有它自己的开发模式，我觉得还是不要封装的好。封装得太多，如果某些地方不符合使用的人的要求，他可能还得hack一下。

1 楼 sp42 2007-12-01

PHP以操作数组为中心（虽然PHP5更OO），JS以操作HASH TABLE为中心（object based==hash/ or object as container）,楼主何不以向原汁原味的JS学习，收获或者更大！

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论