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,333
    Vote Rating
    85
    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,333
    Vote Rating
    85
    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

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..."