1. #1
    Sencha User
    Join Date
    Jun 2012
    Location
    India
    Posts
    25
    Vote Rating
    2
    _sench_user is on a distinguished road

      0  

    Default How to resize components (Rectangle for a case) ?

    How to resize components (Rectangle for a case) ?


    I am just newbie to ExtJs, i want to know how to resize a rectangle by pulling its side by mouse pointer. I have tried something like this :

    Ext.onReady(function(){
    var drawComponent = Ext.create('Ext.draw.Component', {
    viewBox: false,
    renderTo: Ext.getBody(),
    resizable: {
    dynamic: true,
    handles: 'all',
    layout: 'fit',
    widthIncrement: 20,
    minWidth:50,
    minHeight: 50,
    preserveRatio: true
    },
    items: [{
    type: 'rect',
    fill: '#ffc',
    x: 100,
    y: 100,
    anchor: '100%',
    width: 200,
    height: 200,
    id: 'circle',
    draggble: true
    }]
    });
    });

    But its not woking, its only rezise the outside container that contains rectangle but NOT the actual rectangle.Please help me for the same, Thanks in advance

  2. #2
    Sencha - Community Support Team sword-it's Avatar
    Join Date
    May 2012
    Location
    Istanbul
    Posts
    1,332
    Vote Rating
    83
    sword-it is a jewel in the rough sword-it is a jewel in the rough sword-it is a jewel in the rough sword-it is a jewel in the rough

      0  

    Default put your draw container into window

    put your draw container into window


    Hi Sencha_user,

    Put your draw container into panel or window and add config viewBox : true ( bydefault it is true) at draw container for example..

    Code:
    Ext.onReady(function(){ var drawComponent = Ext.create('Ext.draw.Component', { viewBox: true, resizable: true, items: [{ type: 'rect', fill: '#ffc', x: 100, y: 100, anchor: '100%', width: 200, height: 200, id: 'circle', draggble: true}] }); Ext.create('Ext.panel.Panel', { layout: 'fit', resizable:true, renderTo: Ext.getBody(), width: 200, height: 200, items: [drawComponent] }).show(); });
    sword-it.com, Sencha Developer House in Turkey - Istanbul University Technopark Suite 204.

  3. #3
    Sencha User
    Join Date
    Jun 2012
    Location
    India
    Posts
    25
    Vote Rating
    2
    _sench_user is on a distinguished road

      0  

    Default


    Hi Sword,

    Thanks buddy its woking.
    You have solved my problem.

  4. #4
    Sencha User
    Join Date
    Jun 2012
    Location
    India
    Posts
    25
    Vote Rating
    2
    _sench_user is on a distinguished road

      0  

    Default


    Hey Sword,

    For a case if it is circle then how can we acheive it as panel or window are rectangular and it seems to be a circle in an a box.But i just want to resize just circle and as UI ,I want it will be containing circle only and on pulling the the edges of circle it will expand or shrink.
    Sorry if I am asking something silly, its just the curiosity. Thanks buddy

  5. #5
    Sencha - Community Support Team sword-it's Avatar
    Join Date
    May 2012
    Location
    Istanbul
    Posts
    1,332
    Vote Rating
    83
    sword-it is a jewel in the rough sword-it is a jewel in the rough sword-it is a jewel in the rough sword-it is a jewel in the rough

      0  

    Default


    The Draw Component is a surface in which sprites can be rendered, draw component have resizable config so you can resize the draw component. you didn't resize sprite because it don't have resizable config.
    Idea is put sprite into container and it's automatically resize according container width/height.
    sword-it.com, Sencha Developer House in Turkey - Istanbul University Technopark Suite 204.

  6. #6
    Sencha User
    Join Date
    Jun 2012
    Location
    India
    Posts
    25
    Vote Rating
    2
    _sench_user is on a distinguished road

      0  

    Default


    Ok, like if we want our circle or rectangle to be draggable then we need to just put them in container and set the config of container as draggble to true. Am i right? It will automaticaly adapt the property as according to container in that case?

Thread Participants: 1

Tags for this Thread

film izle

hd film izle

film sitesi

takipci kazanma sitesi

takipci kazanma sitesi

güzel olan herşey

takipci alma sitesi

komik eğlenceli videolar