[OPEN-150] Scrollable sortable

If the sortable elements overflow the viewable space, how do you make it auto-scroll as you drag elements out of the viewable area? For an example of what I want, in iphone os go to settings>general>international>keyboards, add a bunch of keyboards, then click edit and sort an item out of the viewable area, it auto-scrolls as you sort.

Currently there's no built in way to do it. The best place to include it would be inside Draggable, so it detects if the position is within the scrolling threshold (say, 10px from the edge or whatever you set it to) then scrolls in the appropriate direction.

Twitter - @evantrimboli
Former Sencha framework engineer, available for consulting.
As of 2017-09-22 I am not employed by Sencha, all subsequent posts are my own and do not represent Sencha in any way.

This functionality seems like it should be baked in... turn the iphone sideways on the out of the box sortable example and you can no longer see the bottom of the list. Is it possible to move this to the bugs forum and track it as such?

The draggable element going off the screen is covered in bug 150, you can track it in the bugs forum, search for "[OPEN-150] Scrollable sortable".

Unfortunately, pinch and drag cannot be concurrently combined. This is because drag overrides the touchmove event and stops it from executing up the chain, where the pinch logic lives. However, I did discover a bug in that disabling the draggable only detaches the tapEvent, not the touchmove or touchend events. In the below example, you can drag the box, clicking Broken disables the drag but you still cannot pinch resize the box. Click Works and the drag is correctly disabled and you can pinch-resize the box. Once this bug has been corrected you can disable the draggable and pinch will once again fire. Sencha team, please move this thread to the bugs forum and add a Trac ticket for the incomplete disable dragging method.

it wasn't perfect but i managed to get some similar functionality by setting the container panel to scrollable: both, and put the pinch event code on the element inside. It's not exactly perfect, because if you zoom too much then you push the limits of the scroll...