PDA

View Full Version : Dragging an Object from a Toolbar to a Panel



r4md4c
18 Apr 2012, 1:27 AM
Hello, I am new to Sencha products and Sencha Touch 2.

I have a toolbar docked at the left of the page and a workspace beside it. I want to drag an element from the toolbar to the workspace. How can I achieve that behaviour using Sencha Touch 2 ?

mitchellsimoens
18 Apr 2012, 5:36 AM
You can make any component draggable using the draggable config.

r4md4c
18 Apr 2012, 6:27 AM
I did set the draggable config as you said. The problem is that when I drag the element outside the toolbar the element goes behind the workspace. I tried to set the zindex but it turned to be useless.




Ext.define('Draggy.view.ToolbarElement', {
extend: 'Ext.Panel',

initialize: function() {
this.element.on({
dragstart: this.onDragStart
});
},
config: {
layout: 'vbox',
draggable: {
constraint: null
},
items: [
{
xtype: 'image',
src: 'http://www.sencha.com/assets/images/sencha-avatar-64x64.png',
width: 64,
height: 64
},
{
html: 'text'
}
]

},

onDragStart: function(thisDraggable, event, offsetX, offsetY, eOpts ) {
this.fireEvent('elementstartdrag', this, this);
}
});

chris_np
25 Apr 2012, 8:28 PM
The problem is that when I drag the element outside the toolbar the element goes behind the workspace.

I'm having this problem too. Did anyone find a solution?