组合Draggable，Resizeable和Aloha Editor ExtJS组件

Question

我正在尝试创建一个Ext.Component，我可以使用Draggable，Resizable，Float和Aloha Editor。

目前我尝试过：

afterRender: function(me) {
    Aloha.jQuery('#' + me.myId).aloha();
    document.getElementById(me.myId).setAttribute("draggable", true);
}

这个不允许它可拖动，但编辑工作。

Aloha.jQuery('#' + me.myId).aloha();
draggable: true,
resizeable: true,
float: true

这个允许它被重新调整大小并拖动，但是aloha不起作用，因此它不可编辑。

Aloha.jQuery('#' + me.myId).draggable();
Aloha.jQuery('#' + me.myId).aloha();

这一次允许编辑但不能拖动。

似乎在调整大小或拖动事件时手柄出现的时刻aloha编辑器停止工作，但是如果没有句柄，则拖动和调整大小停止工作。有什么建议，或者之前有没有遇到过这个？

Answer 1

要解决这个问题，我做了一个Move Handler，HTML5风格：

http://www.w3schools.com/html/html5_draganddrop.asp

让我的主画布成为掉落区域。

接下来，我在组件内添加了一个可编辑的小div。

并且能够制作那个div aloha。只要您使边缘透明，默认的缩放器就可以工作。