Sencha Touch 2 - 需要基本的拖放示例

Question

Sencha Touch 2包括Ext.util.Droppable和Ext.util.Draggable类。有没有人有一个简单的例子来说明基本的拖放行为是如何工作的？

似乎任何组件都可以使用'draggable'配置选项进行拖动。在这里，我创建了一个带有可拖动图像组件的简单面板：

    Ext.create("Ext.Panel", {
        fullscreen: true,
        items: [
            {
                xtype: 'image',
                src: 'http://www.sencha.com/assets/images/sencha-avatar-64x64.png',
                height: 64,
                width: 64,
                left: '10px',
                top: '10px',
                draggable: {
                    direction: 'both',
                },
            }
        ]
    });

并且工作正常：现在可以在Panel内拖动组件。

但是我们现在如何使用Ext.util.Droppable类创建一个简单的“drop target”？