Задать scope для обработчика события drag весьма затруднительно
 

Я пытаюсь сделать обработчик события drag:

draggable: {
	listeners: {
		drag: "onDrag"
	}
},

onDrag: function() {...}

Но это не работает.

Воспользоваться initComponent нельзя, так как объект draggable не существует, а dd запрещен документацией. Да и вообще, как выяснилось, объект dd не доступен в initComponent... он доступен после события boxready.

И как мне в таких условиях задать scope?

После серии экспериментов выяснилось, что если установить draggable: true, то в компоненте будет вызываться метод onDrag, если он определен. Странное поведение какое-то.

Причем метод onDragEnd или onDragend не вызывается, хотя по логике должен.

можно и в initComponent scope задать https://fiddle.sencha.com/#fiddle/pmg

давно уже не делал разных драгов, но если чего-то нет в initComponent, потому что оно еще не отрисовано, то оно уже есть в afterRender. а листенеры можно накладывать с помощью .on("onDrag"...

@bastrakov,

Не надо ничего делать в afterRender, особенно не надо инициализировать Drag'n'Drop. Всё это нужно делать в onBoxReady.

Почему, спросите вы? А всё просто: afterRender вызывается сразу после того, как компонент отрендерен в DOM, но до раскладки (layout). Делать что-либо с DOM в afterRender чревато forced reflow, а это очень больно в IE8 и на таблетках.

onBoxReady вызывается после того, как компонент первый раз прошёл через layout, и размеры элементов уже известны. Чтение/запись в DOM (в разумных пределах) не вызовет reflow, и проблем не будет.

Проблема в том, чтобы в onBoxReady что-то задать, нужно воспользоваться объектом this.dd, который в документации отсутствует. Что весьма печально... А ведь уже приходится пользоваться, так как иных вариантов не нашел.