Hierarchy
Ext.BaseExt.dd.DragDropSubclasses
Files
定义接口和基本操作的项，可以拖动或放下目标。 它的目的是为了扩展，重写startDrag，onDrag，onDragOver和onDragOut的事件处理程序。 三个HTML元素与DragDrop实例：
linked element: 被传递到构造函数的元素。 这是与其他的DragDrop对象相互作用的边界定义的元素。
handle element(s): 拖动操作只发生在被点击的元素相匹配的处理元素。 默认情况下，这是链接的元素， 但也有时候，你需要启动拖动操作，这只是链接元素的一部分， 并且setHandleElId（）方法提供了一种定义。
drag element: 这代表了在拖动操作期间，将光标移动的元素。 默认情况下，这是链接的元素本身 Ext.dd.DD. setDragElId() 让你定义单独的移动元素, 在 Ext.dd.DDProxy.
这个类不能被实例化，直到onload事件，以确保相关的元素。 以下将定义DragDrop的OBJ互动“group1”的组中的任何其他的DragDrop OBJ：
dd = new Ext.dd.DragDrop("div1", "group1");
如果你运行上面的代码，由于没有任何事件处理程序得到落实，所以什么都不会发生。 通常你会重写这个类的默认函数，你也可以重写你想要的类的实例方法...
dd.onDragDrop = function(e, id) {
alert("dd was dropped on " + id);
}
扩展事件
Defaults to: []
内置的typeof运算符标志
Defaults to: true
可用的 可用属性默认设置为false，直至链接的dom元素可以访问。
Defaults to: false
设置为true时,应用于横向约束
Defaults to: false
设置为true时,应用于垂直约束
Defaults to: false
提供了默认的约束填充“constrainTo”元素。
Defaults to: {left: 0, right: 0, top: 0, bottom: 0}
将被拖动的元素的id。 默认情况下，这是作为链接的元素，但可以改变到另一个元素。 Ex: Ext.dd.DDProxy
Defaults to: null
这个组定义了相关的DragDrop对象的逻辑集合。只得到实例事件与其他在同一组的DragDrop对象进行交互的时候。 如果我们想定义多个组，使用单一的DragDrop子类，。
对象中的格式 {'group1':true, 'group2':true}
Defaults to: null
启动拖动操作的元素的id。 默认情况下，这是链接的的元素，但可以改变此元素的子元素。 这让我们做的事情像是点击链接的HTML元素内的头元素时才开始拖动。
Defaults to: null
默认情况下，如果在MouseDown链接的元素是在该地区发生，拖动只能被启动。 This is done in part to work around a bug in some browsers that mis-report the mousedown if the previous mouseup happened outside of the window. 这是解决在一些浏览器的bug，错误报告的MouseDown，如果以前的mouseup窗外发生。 如果处理自定义，此属性应设置为true。默认为false。
Defaults to: false
自动忽略 设置为false使DragDrop对象解雇拖动事件同时拖动其自己的元素。 默认为true - DragDrop对象默认情况下不触发拖动事件。
阵列元素的CSS类名被视为无效，拖动处理。
Defaults to: null
确定对象的属性名的元素拖动控被视为无效的id。 非空的属性值确定为无效的ID。例如，以防止被"foo"的元素的ID启动拖动,使用：
{
foo: true
}
Defaults to: null
确定对象的属性名作为拖动控被视为无效的HTML标签。
非空的属性值确定为无效的标签。默认为以下值，以防止被<a>元素启动拖动操作：
{
A: "A"
}
Defaults to: null
保持偏移 保持偏移时，我们重置约束。 当你想的到它的父元素的相对位置保持不变，设置为true时页面变化 当页面变化希望元素的相对位置与父级保持不变，设置为true
Defaults to: false
配置填充拖放对象，计算放下区域与此对象的交集。
阵列padding包含4个值： [top, right, bottom, left]
Defaults to: null
默认情况下，拖放实例将只响应点击主按钮（右手鼠标左键）。 设置为true，允许拖放，启用鼠标在浏览器上任意散布点击
Defaults to: true
本身
获取当前类的引用，此对象被实例化。不同于 statics,
this.self是依赖范围，它意味着要使用动态继承。
参见 statics 详细对比
Ext.define('My.Cat', {
statics: {
speciesName: 'Cat' // My.Cat.speciesName = 'Cat'
},
constructor: function() {
alert(this.self.speciesName); // 依赖 'this'
},
clone: function() {
return new this.self();
}
});
Ext.define('My.SnowLeopard', {
extend: 'My.Cat',
statics: {
speciesName: 'Snow Leopard' // My.SnowLeopard.speciesName = 'Snow Leopard'
}
});
var cat = new My.Cat(); // alerts 'Cat' 猫
var snowLeopard = new My.SnowLeopard(); // alerts 'Snow Leopard' 雪豹
var clone = snowLeopard.clone();
alert(Ext.getClassName(clone)); // alerts 'My.SnowLeopard'
链接元素的时候绝对的X坐标开始拖动
Defaults to: 0
链接元素的时候绝对的X坐标开始拖动
Defaults to: 0
成员
适用于被传递到构造函数的参数配置。 这应该发生于每一级通过继承链。 So 为了得到每个对象的所有参数，DDProxy 完成执行应用于配置DDProxy，DD，和DragDrop。
onMouseDown事件之前立即执行的代码
mousedown事件
调用原来的方法，这是以前的override重写
Ext.define('My.Cat', {
constructor: function() {
alert("I'm a cat!");
}
});
My.Cat.override({
constructor: function() {
alert("I'm going to be a cat!");
this.callOverridden();
alert("Meeeeoooowwww");
}
});
var kitty = new My.Cat(); // alerts "I'm going to be a cat!"
// alerts "I'm a cat!"
// alerts "Meeeeoooowwww"
This method has been deprecated since 4.1
版本 使用 callParent 代替.
参数的参数，数组或'参数'对象
来自当前方法，例如： this.callOverridden(arguments)
返回调用重写方法的结果。
所谓的"parent"方法是指当前的方法。 这是以前的方法派生或重写(参见 Ext.define)。
Ext.define('My.Base', {
constructor: function (x) {
this.x = x;
},
statics: {
method: function (x) {
return x;
}
}
});
Ext.define('My.Derived', {
extend: 'My.Base',
constructor: function () {
this.callParent([21]);
}
});
var obj = new My.Derived();
alert(obj.x); // alerts 21
这可以用来重写如下:
Ext.define('My.DerivedOverride', {
override: 'My.Derived',
constructor: function (x) {
this.callParent([x*2]); // 调用原来的My.Derived构造
}
});
var obj = new My.Derived();
alert(obj.x); // 现在提示 42
This also works with static methods.
Ext.define('My.Derived2', {
extend: 'My.Base',
statics: {
method: function (x) {
return this.callParent([x*2]); // 调用 My.Base.method
}
}
});
alert(My.Base.method(10); // alerts 10
alert(My.Derived2.method(10); // alerts 20
然后，它也可以重写静态方法。
Ext.define('My.Derived2Override', {
override: 'My.Derived2',
statics: {
method: function (x) {
return this.callParent([x*2]); // 调用 My.Derived2.method
}
}
});
alert(My.Derived2.method(10); // 现在提示 40
这个参数, 通过当前方法得到数组或者 arguments 对象,
例如: this.callParent(arguments)
返回调用父类的方法的结果。
清除应用到该实例的任何约束。 另外清除记号，因为他们可以在这个时候不存在独立的约束。
清除此实例中定义的任何记号间隔
初始化拖放对象的约束，限制某些元素的移动。
用法:
var dd = new Ext.dd.DDProxy("dragDiv1", "proxytest",
{ dragElId: "existingProxyDiv" });
dd.startDrag = function(){
this.constrainTo("parent-id");
};
你也可以使用初始化 Ext.Element 对象:
Ext.get("dragDiv1").initDDProxy("proxytest", {dragElId: "existingProxyDiv"}, {
startDrag : function(){
this.constrainTo("parent-id");
}
});
要约束的元素或元素id。
(可选) Pad 提供了一种方法来指定"padding" 的约束，
并可以是对称的填充数(4 个值等于 {left:4, right:4, top:4, bottom:4}) 或对象其中包含双方的pading。
例如: {right:10, bottom:10}
(可选) 限制在该元素的内容框的拖动 (内侧填充和边框)
拖动对象是调用的代码
mouseup事件
返回引用到实际元素拖动。默认情况，这是相同的HTML元素， 但它可以被分配到另一个元素。 这样的例子，可以在Ext.dd.DDProxy找到
HTML元素
返回引用到链接的元素
HTML元素
链接元素是可用时执行
这个类的初始化配置。典型例子:
Ext.define('My.awesome.Class', {
// 这是默认配置
config: {
name: 'Awesome',
isAwesome: true
},
constructor: function(config) {
this.initConfig(config);
}
});
var awesome = new My.awesome.Class({
name: 'Super Awesome'
});
alert(awesome.getName()); // 'Super Awesome' 超级棒
配置
mixins 混入原型 键-值对
锁定这个实例
在需要的初始位置被确定后，重写的onAvailable方法。
拖动某一项时，调用在onMouseMove事件的抽象方法 object.
mousemove事件
在此项上放下另一个DragDrop对象，调用的抽象方法
the mouseup event
在POINT模式下，放下元素的id。 在INTERSECT模式下, 阵列或更多的拖放项鼠标不在上面。
当这个元素的指标开始悬停在另一个的DragDrop对象调用这个抽象方法
mousemove事件
在POINT模式下, 这个悬停元素的id。 在INTERSECT模式下, 阵列或更多的拖放项悬停。
当我们不再悬停在元素上的抽象方法调用
mousemove事件
In 在POINT模式下, 这个悬停元素的id。 在INTERSECT模式下, 阵列或更多的拖放项鼠标不在上面
当这个元素悬停在DragDrop对象时，调用的抽象方法
mousemove事件
在POINT模式下, 这个悬停元素的id。 在INTERSECT模式下, 阵列或更多的拖放项悬停。
当这个区域没有放下的目标被丢弃时，调用的抽象方法
mouseup 事件
拖动/放下的对象得到mousedown事件时调用
mousedown事件
拖动/放下的对象得到mouseup事件时调用
the mouseup event
允许你指定子链接的元素应该用来启动拖动操作。 这样的例子是，如果你有一个有内容div包含文本和链接。 在内容区域的任何地方点击，通常会启动拖动操作。 用法 指定元素的内容div里面的元素开始拖动操作。
将用于启动拖动的元素的id。
获取从该对象被实例化的类的引用。 请注意不同于 self,
this.statics()是独立的作用域，无论this是否运行，总是返回其中的调用类。
Ext.define('My.Cat', {
statics: {
totalCreated: 0,
speciesName: 'Cat' // My.Cat.speciesName = 'Cat'
},
constructor: function() {
var statics = this.statics();
alert(statics.speciesName); // 总是等于'Cat'，无论'this'是什么，
// 相当于：My.Cat.speciesName
alert(this.self.speciesName); // 依赖 'this'
statics.totalCreated++;
},
clone: function() {
var cloned = new this.self; // 依赖 'this'
cloned.groupName = this.statics().speciesName; // 相当于: My.Cat.speciesName
return cloned;
}
});
Ext.define('My.SnowLeopard', {
extend: 'My.Cat',
statics: {
speciesName: 'Snow Leopard' // My.SnowLeopard.speciesName = 'Snow Leopard'
},
constructor: function() {
this.callParent();
}
});
var cat = new My.Cat(); // alerts 'Cat', 然后提示 'Cat'
var snowLeopard = new My.SnowLeopard(); // alerts 'Cat', 然后提示 'Snow Leopard'
var clone = snowLeopard.clone();
alert(Ext.getClassName(clone)); // alerts 'My.SnowLeopard'
alert(clone.groupName); // alerts 'Cat'
alert(My.Cat.totalCreated); // alerts 3
配置扩展
解锁定这个实例
删除所有与拖放挂钩的元素
方法/属性添加到这个类的原型。
Ext.define('My.awesome.Cat', {
constructor: function() {
...
}
});
My.awesome.Cat.implement({
meow: function() {
alert('Meowww...');
}
});
var kitty = new My.awesome.Cat;
kitty.meow();
成员
添加/重写这个类的静态属性。
Ext.define('My.cool.Class', {
...
});
My.cool.Class.addStatics({
someProperty: 'someValue', // My.cool.Class.someProperty = 'someValue'
method1: function() { ... }, // My.cool.Class.method1 = function() { ... };
method2: function() { ... } // My.cool.Class.method2 = function() { ... };
});
成员
this
这个类的原型借用另一个类的成员
Ext.define('Bank', {
money: '$$$',
printMoney: function() {
alert('$$$$$$$');
}
});
Ext.define('Thief', {
...
});
Thief.borrow(Bank, ['money', 'printMoney']);
var steve = new Thief();
alert(steve.money); // alerts '$$$'
steve.printMoney(); // alerts '$$$$$$$'
this 借用成员
创建这个类的新实例。
Ext.define('My.cool.Class', {
...
});
My.cool.Class.create({
someConfig: true
});
所有参数传递至类的构造。
创建的实例。
创建现有的原型方法的别名。例如：
Ext.define('My.cool.Class', {
method1: function() { ... },
method2: function() { ... }
});
var test = new My.cool.Class();
My.cool.Class.createAlias({
method3: 'method1',
method4: 'method2'
});
test.method3(); // test.method1()
My.cool.Class.createAlias('method5', 'method3');
test.method5(); // test.method3() -> test.method1()
别名新方法的名称，或对象设置多个别名。 参见flexSetter
原来的方法名
以字符串格式，获取当前类的名称。
Ext.define('My.cool.Class', {
constructor: function() {
alert(this.self.getName()); // alerts 'My.cool.Class'
}
});
My.cool.Class.getName(); // 'My.cool.Class'
className 类名
重写这个类的成员。通过callParent重写的方法可以调用。
Ext.define('My.Cat', {
constructor: function() {
alert("I'm a cat!");
}
});
My.Cat.override({
constructor: function() {
alert("I'm going to be a cat!");
this.callParent(arguments);
alert("Meeeeoooowwww");
}
});
var kitty = new My.Cat(); // alerts "I'm going to be a cat!我要成为一只猫！"
// alerts "I'm a cat!我是一只猫！"
// alerts "Meeeeoooowwww"
在4.1版本, 直接利用这种方法已经过时了。 使用 Ext.define 代替:
Ext.define('My.CatOverride', {
override: 'My.Cat',
constructor: function() {
alert("I'm going to be a cat!");
this.callParent(arguments);
alert("Meeeeoooowwww");
}
});
以上完成了相同的结果，但可以由Ext.Loader重写， 其目标类和生成过程中，可以决定是否需要根据目标类所需的状态覆盖管理(My.Cat)。
This method has been deprecated since 4.1.0
使用 Ext.define 代替
添加到这个类的属性。 这应当被指定为一个对象包含一个或多个属性的文字。
this class 当前类