Extjs新手教程

Extjs新手教程

            这是我在iteye发的第一篇博客，目的在于把自己学的记录下来，如果可以帮到其他人，那我感到很荣幸，自己的水平很有限，如果有什么不足还望指正。

            去年年末开始接触extjs版本是最新的4.1.1但只是理论上的看看，没有写代码，新年到公司后，没有什么活，就决定把以前的一个办事流程改写成extjs的，公司目前没有美工，界面全部是开发人员自己做，而且没有统一的风格，自己审美观也差，所以就用人家做好的吧。先说说我使用以后感觉到的好处。

            1. 风格统一，比较大气，比我目前做的要好多了。2.extjs和flex，swing等在组件的结构上都是基于组件开发的，这种结构把创建，渲染，布局很好的管理起来，通过继承已经有了的组件，可以快速开发自己定义的，而且通过覆盖父类中的特有的方法，可以在组件布局，创建，渲染过程中对于组件进行更加细微的控制。如果不是很个性化的项目，一般的项目完全够用了。

开始前的准备

           要准备的东西很简单，就两个：一个是js编辑工具，一般就是eclipse了，然后是最重要的，就是extjs的api了，我觉的官方的api做的很不错了，就是全是英文的，要仔细读，而且有些没有例子，看起来不是很明白，但对于初学者来说已经很好的了。extjs的api是用php写的，所以你要用起来，先要装个apache服务器

我的电脑里装的是amfphp，随便个版本就可以了，把extjs的api放到www的目录下，运行ampphp就可以了，amfphp自带一个apache服务器，和一个mysql数据库。这个东西是为flex的amf数据格式而写的，就是负责flex使用amf数据格式，于后台传递数据的，java语言也有一个版本是openamf。

简单的例子

          我觉的从简单的例子开始比较好，建议在学习的时候先用，等到了一定程度，看源码，不要一开始就看源码，眼过千遍，不如手过一遍。

         先说说extjs 的使用场合吧，extjs不适合门户网站，因为extjs太大了，中国的网速也不是很快，如果门户网站的话就完蛋了，一般extjs 的使用场合是办公平台，就是那种打开页面一天不用关闭的那种，即使网速慢也只是加载一次而已，如果使用mvc结构，可以改善extjs加载慢的问题。我以前的版本没有学过，在网上看有很多的不同，在这里我也就不说和其他的不同了，有兴趣的网上这样的博客很多，自己搜搜就有了。

       首先是一个使用最多的函数：Ext.create("全路径的类名",{//初始化参数})。相当于new 全路径类名。作用是创建一个类的实例，返回改实例的引用。接着我们创建一个类，代码如下：

Ext.create("Ext.container.Viewport",{
       id:"maincontainer",
       title:"XX管理平台",
       layout:"border",
       frame:true,
       items:[{
             region:"north",
             html:"北方"},{
             region:"south",
             html:"南方"},{
             region:"west",
             html:"西方"},{
             region:"east",
             html:"东方"},{region:"center",
             html:"中"
       }]
});

 运行下试试，但是首先要引入ext-all-debug.js和resource目录下面的css中的ext-all.css,最好把resource放到

项目的根目录下，然后运行上面的程序就能看到一个布局分为上，下，左，右，中布局的平台了。viewport这个类创建的对象默认是渲染到body标签的，会覆盖页面中的所有东西。