| Defined In: | Resizable.js |
| Class: | Ext.Resizable |
| Extends: | Ext.util.Observable |
在元素上应用拖动柄以使其支持缩放。拖动柄是嵌入在元素内部的且采用了绝对定位。某些元素, 如文本域或图片, 不支持这种做法。为了克服这种情况, 你可以把文本域打包在一个 Div 内, 并把 "resizeChild" 属性设为 true(或者指向元素的 ID), 或者在配置项中设置 wrap 属性为 true, 元素就会被自动打包了。
下面是有效的拖动柄的值列表:
值 说明 ------ ------------------- 'n' 北(north) 's' 南(south) 'e' 东(east) 'w' 西(west) 'nw' 西北(northwest) 'sw' 西南(southwest) 'se' 东北(southeast) 'ne' 东南(northeast) 'all' 所有
下面是展示的是创建一个典型的 Resizable 对象的例子:
var resizer = new Ext.Resizable("element-id", {
handles: 'all',
minWidth: 200,
minHeight: 100,
maxWidth: 500,
maxHeight: 400,
pinned: true
});
resizer.on("resize", myHandler);
想要隐藏某个缩放柄, 可以将它的CSS样式中的 display 属性设为 none, 或者通过脚本来实现:
resizer.east.setDisplayed(false);
| 配置项 | 定义者 | |
|---|---|---|
|
resizeChild
: Boolean/String/Element
值为 true 时缩放首个子对象, 或者值为 id/element 时...
值为 true 时缩放首个子对象, 或者值为 id/element 时缩放指定对象(默认为 false)
|
Resizable | |
|
minWidth
: Number
元素允许的最小宽度(默认为 5)
元素允许的最小宽度(默认为 5)
|
Resizable | |
|
maxWidth
: Number
元素允许的最大宽度(默认为 10000)
元素允许的最大宽度(默认为 10000)
|
Resizable | |
|
enabled
: Boolean
设为 false 可禁止缩放(默认为 true)
设为 false 可禁止缩放(默认为 true)
|
Resizable | |
|
width
: Number
以像素表示的元素宽度(默认为 null)
以像素表示的元素宽度(默认为 null)
|
Resizable | |
|
animate
: Boolean
设为 true 则在缩放时展示动画效果(不可与 dynamic 同时使...
设为 true 则在缩放时展示动画效果(不可与 dynamic 同时使用, 默认为 false)
|
Resizable | |
|
dynamic
: Boolean
设为 true 则对元素进行实时缩放而不使用代理(默认为 false)
设为 true 则对元素进行实时缩放而不使用代理(默认为 false)
|
Resizable | |
|
multiDirectional
: Boolean
Deprecated. 以前的添加多向缩放柄的方式, 建议使用 ha...
Deprecated. 以前的添加多向缩放柄的方式, 建议使用 handles 属性。(默认为 false)
|
Resizable | |
|
easing
: String
指定当 animate = true 时的动画效果(默认为 'easi...
指定当 animate = true 时的动画效果(默认为 'easingOutStrong')
|
Resizable | |
|
heightIncrement
: Number
以像素表示的高度缩放增量(dynamic 属性必须为 true, 默认...
以像素表示的高度缩放增量(dynamic 属性必须为 true, 默认为 0)
|
Resizable | |
|
preserveRatio
: Boolean
设为 true 则在缩放时保持对象的原始长宽比(默认为 false)
设为 true 则在缩放时保持对象的原始长宽比(默认为 false)
|
Resizable | |
|
minX
: Number
The minimum allowed page X for the ...
The minimum allowed page X for the element (仅用于向左缩放时, 默认为 0)
|
Resizable | |
|
draggable
: Boolean
便利的初始化拖移的方法(默认为 false)
便利的初始化拖移的方法(默认为 false)
|
Resizable | |
|
constrainTo
: Mixed
强制缩放到一个指定的元素
强制缩放到一个指定的元素
|
Resizable | |
|
resizeRegion
: Ext.lib.Region
强制缩放到一个指定区域
强制缩放到一个指定区域
|
Resizable | |
|
listeners
: Object
一个配置项对象,可方便在该对象初始化时便加入多个事件处理函数。 这应该...
一个配置项对象,可方便在该对象初始化时便加入多个事件处理函数。 这应该是一个如#addListener有效的配置项对象,即可一次过加入多个事件处理函数。
|
Observable | |
| 方法 | 定义者 | |
|---|---|---|
Resizable
(
Mixed el,
Object config
)
: Ext.Resizable
构造器
构造器
参数项:
|
Resizable | |
resizeTo
(
Number width,
Number height
)
执行手动缩放
执行手动缩放
参数项:
|
Resizable | |
|
getEl
(
)
: Ext.Element
返回此组件绑定的 element 对象。
返回此组件绑定的 element 对象。
参数项:
|
Resizable | |
|
getResizeChild
(
)
: Ext.Element
返回 resizeChild 属性指定的 element 对象(如...
返回 resizeChild 属性指定的 element 对象(如果没有则返回 null)。
参数项:
|
Resizable | |
destroy
(
[Boolean removeEl]
)
销毁此 resizable对象。如果元素被打包且 removeEl...
销毁此 resizable对象。如果元素被打包且 removeEl 属性不为 true 则元素会保留。
参数项:
|
Resizable | |
fireEvent
(
String eventName,
Object... args
)
: Boolean
触发指定的事件,并将欲执行的处理函数的参数传入。(应该至少要有事件的...
触发指定的事件,并将欲执行的处理函数的参数传入。(应该至少要有事件的名称)
参数项:
|
Observable | |
addListener
(
String eventName,
Function handler,
[Object scope],
[Object options]
)
为该组件加入事件处理函数(event handler)
sc...
为该组件加入事件处理函数(event handler)
处理函数执行时所在的作用域。处理函数“this”的上下文。 触发事件后开始执行处理函数的延时时间(invocation:the act of making a particular function start),单位:毫秒 true代表为下次事件触发加入一个要处理的处理函数,然后再移除本身。 不同配搭方式的选项 一次调用加入上多个处理函数(handlers) 或者是以简写的方式书写,前提是只允许同一个的作用域对象传入到所有的处理函数中:
参数项:
|
Observable | |
removeListener
(
String eventName,
Function handler,
[Object scope]
)
移除侦听器
移除侦听器
参数项:
|
Observable | |
|
purgeListeners
(
)
从这个对象身上移除所有的侦听器
从这个对象身上移除所有的侦听器
参数项:
|
Observable | |
addEvents
(
Object object
)
定义观察者的事件。
定义观察者的事件。
参数项:
|
Observable | |
hasListener
(
String eventName
)
: Boolean
查询该对象是否有指定事件的侦听器
查询该对象是否有指定事件的侦听器
参数项:
|
Observable | |
|
suspendEvents
(
)
暂停触发所有的事件(参阅#resumeEvents)
暂停触发所有的事件(参阅#resumeEvents)
参数项:
|
Observable | |
|
resumeEvents
(
)
重新触发事件(参阅{@link #suspendEvents})
重新触发事件(参阅{@link #suspendEvents})
参数项:
|
Observable | |
on
(
String eventName,
[Object scope],
Function handler,
[Object options]
)
为该元素添加事件处理函数(event handler),addLis...
为该元素添加事件处理函数(event handler),addListener的简写方式 @param {String} eventName 侦听事件的类型 @param {Object} scope (可选的) 执行处理函数的作用域 @param {Function} handler 事件涉及的方法 @param {Object} options (可选的)
参数项:
|
Observable | |
un
(
String eventName,
Function handler,
[Object scope]
)
移除侦听器 @param {String} eventName ...
移除侦听器 @param {String} eventName 侦听事件的类型 @param {Function} handler 事件涉及的方法 @param {Object} scope (可选的)处理函数的作用域
参数项:
|
Observable | |
capture
(
Observable o,
Function fn,
[Object scope]
)
开始捕捉特定的观察者。 在事件触发之前,所有的事件会以“事件名称+标...
开始捕捉特定的观察者。 在事件触发之前,所有的事件会以“事件名称+标准签名”的形式传入到函数(传入的参数是function类型)。 如果传入的函数执行后返回false,则接下的事件将不会触发。 @param {Observable} o 要捕捉的观察者 @param {Function} fn 要调用的函数 @param {Object} scope (可选的)函数作用域
参数项:
|
Observable | |
releaseCapture
(
Observable o
)
从Observable身上移除所有已加入的捕捉captures。 @...
从Observable身上移除所有已加入的捕捉captures。 @param {Observable} o 要释放的观察者
参数项:
|
Observable | |