PDA

View Full Version : How to use Draggable and Resizable?



firblazer
17 Feb 2013, 7:11 PM
Hi!

I want to make a drawComponent resizable and draggable. Here is my code:



var drawComponent = Ext.create('Ext.draw.Component', {
viewBox: false,
items: [{
type: 'rect',
fill: '#79BB3F',
x: 100,
y: 100,
width: 100,
height: 100,
resizable: {pinned: true, dynamic: true,handles: 'all'}
}],
draggable: {}
});


var areas = Ext.create('Ext.panel.Panel', {
width: 1000,
height: 500,
layout: 'fit',
items: [drawComponent]
});

But it is only draggable, not resizable. Please help, Thanks.

vadimv
17 Feb 2013, 10:25 PM
Regarding draggable here:


var drawComponent = Ext.create('Ext.draw.Component', {
viewBox: false,
draggable: true,
items: [{
type: 'circle',
fill: '#79BB3F',
radius: 10,
x: 10,
y: 10
}]
});


Ext.create('Ext.Window', {
width: 215,
height: 235,
layout: 'fit',
items: [drawComponent]
}).show();

as regarding resize, is more complicated and depends how you want to resize, look if you find sth useful here, it's for SVG: http://www.sencha.com/forum/showthread.php?242721-Ext.ux.DrawPoly&p=887612#post887612