Ext第一周 史上最强学习笔记---GridPanel(基础篇)
2024-05-06 14:16:16
供稿:网友
如果你想实现什么特效,这个文字不适合你,但如果你想Ext文章,我想鄙人的小文非常适合你。
另:这篇教程是建立在Ext2.2上的。这个很多教程都没说明。让人很糊涂。我在此特别说明
网上很多教程,但是实际使用并不是很多,我想作为一个星期一个星期的总结来给各位网络上的朋友带来帮助。希望各位有用。我会从每个细节都说明,尽量不漏掉作为初学者需要知道的基础知识。第一次写教程,见笑了。
因为我学这个是这样一个过程,通过一个控件了解其他的控件,剩下的就是属性查API了。API我自己在翻译CHM版的。因为是个人操作。所以时间有限。。大家见谅。
在Ext下。首先接触的一定是Grid。我也是如此。我是因为 Grid与Ext结缘。
下面先说一下Ext类的申明形式。
以Grid为例
Js代码
代码如下:
var grid=new Ext.form.GridPanel({
这里是属性。
});
var grid=new Ext.form.GridPanel({
这里是属性。
});
这个申明和java的面向对象很相似。以new关键词作为建立GridPanel类的实例,关于面向对象的基础知识就不在这里展开了。只是在写这个总结的时候常用到面向对象的概念。个人觉得学程序,不管你学不学java。think in java必须看完,如果你想学好最好看英文版。因为一句话你可以反复的揣摩。加深印象。我才看到一半都觉得他对一个人的程序思维起很大的作用。好了不走题了。
知道OOP的都知道,在类的里面有一个构造器,在实现类的实例的时候将会初始化这个构造器内的属性值或者调用方法。
但是在Ext中的属性赋值不是“=”而是":"。
上面说的是理论的,实际上过程就是这样。
var grid = new Ext.form.GridPanel();实例化一个类的对象。
{}里面包含的就是传递给这个类的初始化属性值。因为核心代码我还没研究,也没到那份上,所以具体如何传递和实现就不说明了,在以后的Ext学习经验里会说明的。
那将上面的例子扩展一下。
Java代码
代码如下:
var grid=new Ext.form.GridPanel({
id: 'list-account-panel',
ds: dataStore,
cm: userCM,
sm: selectBoxModel,
tbar: menubar,
bbar: pagingbar,
loadMask: {msg: 数据加载中...'},
layout: 'fit',
autoScroll:true
});
var grid=new Ext.form.GridPanel({
id: 'list-account-panel',
ds: dataStore,
cm: userCM,
sm: selectBoxModel,
tbar: menubar,
bbar: pagingbar,
loadMask: {msg: 数据加载中...'},
layout: 'fit',
autoScroll:true
});
这些是常用的属性,将从这里向其他的部分扩展出去。
这样就申明了一个实力对象并且将其初始化。
你明白了这个过程,如果是真的理解了,只要你熟悉了API .了解到组件的属性和其定义的方法,你可以去创建任何你想要的组件了。如GridPanel.Panel,Tree.其实道理是胡同的。好了,将好这个关键的基础部分,后面的就是属性了,有兴趣的可以继续看。