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

Question

Sencha Touch 2包括Ext.util.Droppable和Ext.util.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',
                },
            }
        ]
    });

效果很好：现在可以在面板内部拖动组件。

但是，我们现在如何使用Ext.util.Droppable类创建一个简单的“放置目标”？