Ext.ResizableZone

[zquirm]

I'd like to be able to mix Ext.View and Ext.Resizable so that each node in my view can be resized. This isn't really a problem if the view is small, but once it starts growing, there's a definite lag in performance, especially when the view is constantly being updated with new Store records.

Is there a way to make a ResizableZone, like DragZone or DropZone, so that everything in the zone will be resizable?

[jack.slocum]

I don't think it would gain you much in performance since Resizable depends on handles being in place. In the end it would just be creating Resizables behind the scenes anyway.

It may be possible to use something like what I am using in the GridView3 headers - monitoring mouse movements to detect when it's within x pixels from the edge of the element. Doing that generically would be difficult, but a specific implementation might not be as hard.

Basically the flow goes like this:

On mouseover: get a region for the target element - e.getTarget(selector) can be used to search up the chain for a specific element.
On mousemove: detect if the mouse is within x pixels of the edge of that region. If it is, change the target to cursor:e-resize (or whatever) and flag that you are within the resize bounds. If not, set the cursor to '' and set the flag to false.
On mousedown: If the flag is set, start the resize drag. I use a DragZone for this so I can reuse constraining and other logic.
On mouseup: resize the element

Hopefully that helps in some way.