一、命名规范
  在你编码过程中对类,名字空间以及文件名使用统一的命名规则对你代码的组织,结构化以及可读性有很大的好处。

1、类命名规范:
  类名最好只包含字母,在多数情况下,数字是不鼓励使用的,除非非要用不可,也不要使用下划线,-以及其它非字母字符,例如:
    MyCompany.useful_util.Debug_Toolbar 不鼓励这样命名
    MyCompany.util.Base64 可接受的命名
 
  类名最好包括组织,在适当的名字空间通过使用.来访问对象属性,至少,类名应该有一个顶层的包。例如:
    MyCompany.data.CoolProxy
    MyCompany.Application
  顶层的包名以及实际的类名应该使用CamelCased命名规范,其它应该为小写,如下:
    MyCompany.form.action.AutoLoad
 
  不要使用Ext作为顶层包名,首字母应该遵循CamelCased命名规范,如:
    Ext.data.JsonProxy instead of Ext.data.JSONProxy
    MyCompany.util.HtmlParser instead of MyCompary.parser.HTMLParser
    MyCompany.server.Http instead of MyCompany.server.HTTP
 

2、源文件命名规范:
  类名直接映射到存储该类的文件路径,因此,每个文件只能有一个类,如
    Ext.util.Observable is stored in path/to/src/Ext/util/Observable.js
    Ext.form.action.Submit is stored in path/to/src/Ext/form/action/Submit.js
    MyCompany.chart.axis.Numeric is stored in path/to/src/MyCompany/chart/axis/Numeric.js
  path/to/src目录包含应用的所有类,所有类应该放在这个公共根目录下,以合适的名字空间来获得最好的开发,管理以及部署体验。
 
  方法以及变量的命名规则与类命名相似,方法和变量的命名也只包含字母,数字不鼓励使用,除非必须用到,同样不使用下划线,-以及其它非字母字符。
  方法和变量命名应该遵循CamelCased命名规范,应适用首字母。例如
    可接受的方法名: 
      encodeUsingMd5()
      用getHtml() 替代 getHTML()
      用getJsonResponse()替代 getJSONResponse()
      用 parseXmlContent()替代parseXMLContent()
    可接受的变量名: 
      var isGoodName
      var base64Encoder
      var xmlReader
      var httpServer

3、属性命名:
  类属性命名和上面方法以及变量一样,除了当属性是静态常量的时候。
  当属性是静态常量时,字母应该大写。
    Ext.MessageBox.YES = "Yes"
    Ext.MessageBox.YES = "Yes"
    Ext.MessageBox.NO = "No"
    MyCompany.alien.Math.PI = "4.13"
 


二、define
  在ExtJS4之前,使用Ext.extend来创建类,在ExtJS4之后,使用Ext.define来创建类。
  基本语法:
  Ext.define(className, members, onClassCreated);
  其中,
    className:类名
    members:这是一个对象,它表示一个以键值对形式表示的类成员集合。
    onClassCreated:这是一个可定制的回调函数,当这个类所依赖的类都准备完毕时便会调用这个回调函数,并且类本身将会完全创建。由于有这个类创建新异步属性,这个回调在很多情况都会很有用。
 
例:
 Ext.define('MyComponent.getWH', {
showSize: function(){
var dom = Ext.get(Ext.getBody().dom);
Ext.Msg.alert('My Component WH','Dom Width: ' + dom.getWidth() + '<br />Dom Height: ' + dom.getHeight());
}
});
Ext.onReady(function(){
var myPanel = Ext.create('MyComponent.getWH',{
renderTo: Ext.getBody()
});
myPanel.showSize();
});

效果:

   



接下来的目标,就是在不同需求中,各种布局之下的组件功能的定制。

 

【ExtJS】关于自定义组件的更多相关文章

  1. 【ExtJS】自定义组件datetimefield(二)

    接上[ExtJS]自定义组件datetimefield(一) 第三步:添加按钮事件绑定,获取选定的时间 privates:{ finishRenderChildren: function () { v ...

  2. 【ExtJS】自定义组件datetimefield(一)

    目的: ExtJS中提供了下拉日期选择控件Ext.form.field.Date与下拉时间选择控件Ext.form.field.Time.不过没有一个在选择日期时选择时间的控件datetimefiel ...

  3. ExtJS 自定义组件

    主要参考的是官方文档 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&quo ...

  4. 【ExtJS】关于自定义组件(一)

    一.目的: ExtJS中提供了下拉日期选择控件Ext.form.field.Date与下拉时间选择控件Ext.form.field.Time.不过没有一个在选择日期时选择时间的控件datetimefi ...

  5. ExtJS4.2 - 从 Hello World 到 自定义组件 -01 (为爱女伊兰奋斗)

    ExtJS4.2 - 从 Hello World 到 自定义组件 - 01 经验.概述.项目搭建.国际化.HelloWorld.布局 —— 为爱女伊兰而奋斗 ——少走弯路,简单才是王道 1. 写在前面 ...

  6. Android开发之自定义组件和接口回调

    说到自定义控件不得不提的就是接口回调,在Android开发中接口回调用的还是蛮多的.在这篇博客开始的时候呢,我想聊一下iOS的自定义控件.在iOS中自定义控件的思路是继承自UIView, 在UIVie ...

  7. Android自定义组件

    [参考的原文地址] http://blog.csdn.net/l1028386804/article/details/47101387效果图: 实现方式: 一:自定义一个含有EditText和Butt ...

  8. 自己写的几个android自定义组件

    http://www.see-source.com/androidwidget/list.html 多多指点,尤其是自定义组件的适配问题,希望能有更好的方法

  9. PhoneGap: Android 自定义组件

    Hello Core Demo Plugin Development(组件部署): http://docs.phonegap.com/en/2.0.0/guide_plugin-development ...

  10. android开发之自定义组件

    android开发之自定义组件 一:自定义组件: 我认为,自定义组件就是android给我们提供的的一个空白的可以编辑的图片,它帮助我们实现的我们想要的界面,也就是通过自定义组件我们可以把我们要登入的 ...

随机推荐

  1. C# System.Threading.Timer 定时器

    前提: 需要引入  System.Threading: 描述: 在很多时间我们都需要进行延迟执行,或是定时执行一些指定业务,这个时候使用 Timer 是最合适的,而且 Timer 是Cpu 级别处理对 ...

  2. 百度离线地图API开发V2.0版本

    全面介绍,请看下列介绍地址,改写目前最新版本的百度V2.0地图,已全面实现离线操作,能到达在线功能的95%以上 http://api.jjszd.com:8081/apituiguang/gistg. ...

  3. vs2015+opencv3.3.1+ c++实现 静态背景下多运动目标提取,检测

    静止背景下运动物体的提取,跟踪出运动轨迹 下载地址 https://download.csdn.net/download/li_haoren/10761361 1.两遍扫描法得到第n帧的连通域,分离出 ...

  4. 标准库函数begin和end------c++primer

    尽管能计算得到尾后指针,但这种用法极易出错.为了让指针的使用更简单.更安全,c++新标准引入了两个名为begin和end的函数.这两个函数与容器中的两个同名成员功能类似,不过数组毕竟不是类类型,因此这 ...

  5. Launch VINS example (Euroc dataset) in RTAB-MAP

    $ roslaunch rtabmap_ros euroc_datasets.launch args:="-d RGBD/CreateOccupancyGrid false Odom/Str ...

  6. 321. Create Maximum Number (c++ ——> lexicographical_compare)

    Given two arrays of length m and n with digits 0-9 representing two numbers. Create the maximum numb ...

  7. f(!gotop.length) return false;

    if (!$("p").length) return; if语句接收一个布尔值,如果布尔值为true则执行接下来的语句,布尔值为false则执行else关键词后的语句. JavaS ...

  8. loj #6122. 「网络流 24 题」航空路线问题

    #6122. 「网络流 24 题」航空路线问题 题目描述 给定一张航空图,图中顶点代表城市,边代表两个城市间的直通航线.现要求找出一条满足下述限制条件的且途经城市最多的旅行路线. 从最西端城市出发,单 ...

  9. 51nod1228 序列求和(伯努利数)

    题面 传送门 题解 \(O(n^2)\)预处理伯努利数 不知道伯努利数是什么的可以看看这篇文章 不过这个数据范围拉格朗日差值应该也没问题--吧--大概-- //minamoto #include< ...

  10. postgreSQL PL/SQL编程学习笔记(一)

    1.Structure of PL/pgSQL The structure of PL/pgSQL is like below: [ <<label>> ] [ DECLARE ...