1. #1
    Sencha User
    Join Date
    Mar 2010
    Location
    Modena, Italy
    Posts
    59
    Vote Rating
    1
    gianmarco is on a distinguished road

      0  

    Default vbox layout inside a tabpanel with deferredRender=false

    vbox layout inside a tabpanel with deferredRender=false


    Hi, this layout:
    Code:
    {
    	xtype: 'tabpanel',
    	activeTab: 0,
    	width: 500,
    	height: 280,
    	items: [ {
    		xtype: 'panel',
    		title: 'Tab 1'
    	}, {
    		xtype: 'panel',
    		title: 'Tab 2',
    		layout: 'absolute',
    		items: [ {
    			xtype: 'container',
    			width: 200,
    			height: 140,
    			x: 110,
    			y: 60,
    			layout: 'vbox',
    			layoutConfig: {
    				align: 'stretch'
    			},
    			items: [ {
    				xtype: 'label',
    				text: 'Label:'
    			}, {
    				xtype: 'textfield'
    			} ]
    		} ]
    	} ]
    }
    is rendered as expected.
    When i disable deferredRender on TabPanel, the Label and the TextField become invisible, and this is not the expected behavior.
    Following is the added code:
    Code:
    	deferredRender: false

  2. #2
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,501
    Vote Rating
    47
    Animal has a spectacular aura about Animal has a spectacular aura about

      0  

    Default


    Why overnest in a weird, (almost useless IMNSHO) absolute layout?

    Code:
    {
        xtype: 'tabpanel',
        activeTab: 0,
        width: 500,
        height: 280,
        items: [{
            xtype: 'panel',
            title: 'Tab 1'
        },
        {
            title: 'Tab 2',
            xtype: 'container',
            hideMode: 'offsets',
            layout: {
                type: 'vbox',
                align: 'stretch'
            },
            items: [{
                xtype: 'label',
                text: 'Label:'
            },
            {
                xtype: 'textfield'
            }]
        }]
    }

  3. #3
    Sencha User
    Join Date
    Mar 2010
    Location
    Modena, Italy
    Posts
    59
    Vote Rating
    1
    gianmarco is on a distinguished road

      0  

    Default


    Bucause i need it.. The code is just a distilled part of a more complex, dynamically generated, layout.

  4. #4
    Sencha - Ext JS Dev Team evant's Avatar
    Join Date
    Apr 2007
    Location
    Sydney, Australia
    Posts
    16,833
    Vote Rating
    609
    evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute

      0  

    Default


    You need to use layoutOnTabChange: true.
    Evan Trimboli
    Sencha Developer
    Twitter - @evantrimboli
    Don't be afraid of the source code!

  5. #5
    Sencha User
    Join Date
    Mar 2010
    Location
    Modena, Italy
    Posts
    59
    Vote Rating
    1
    gianmarco is on a distinguished road

      0  

    Default


    It works! Tank you all for support!

  6. #6
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,501
    Vote Rating
    47
    Animal has a spectacular aura about Animal has a spectacular aura about

      0  

    Default


    Quote Originally Posted by gianmarco View Post
    Bucause i need it.. The code is just a distilled part of a more complex, dynamically generated, layout.
    I can't believe anyone really needs the absolute layout if they know how layouts work! Absolute layout is next to useless!

  7. #7
    Sencha User
    Join Date
    Mar 2010
    Location
    Modena, Italy
    Posts
    59
    Vote Rating
    1
    gianmarco is on a distinguished road

      0  

    Default


    One note:
    adding
    Code:
    layoutOnTabChange: true
    on TabPanel make the inner controls became visible, but the layout is not as expected (it is a really complex absolute layout with inner vbox and hbox layout). With
    Code:
    hideMode: 'offsets'
    on inner components, as suggested by Animal, all look as expected (the initilal rendering of the page increase significantly)

  8. #8
    Sencha User
    Join Date
    Mar 2010
    Location
    Modena, Italy
    Posts
    59
    Vote Rating
    1
    gianmarco is on a distinguished road

      0  

    Default


    In general ExtJS development i agree with you.

    But i'm dynamically generating a web UI based on a Borland Delphi DFM file.
    In the DFM file, component position is expressed with X,Y,Width,Height positioning.

    With this informations available, the best matching layout in ext to render a UI based on a DFM is to use absolute layout.

    Agree?

  9. #9
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,501
    Vote Rating
    47
    Animal has a spectacular aura about Animal has a spectacular aura about

      0  

    Default


    Yes, if you are interpreting something which specifies X and Y as pixel positions.

Similar Threads

  1. Replies: 6
    Last Post: 8 Jun 2011, 3:43 AM
  2. Replies: 3
    Last Post: 23 Jul 2010, 6:19 AM
  3. deferredRender:false in tabpanel failed resizing with IE , BUG ?
    By stevanovich in forum Ext 2.x: Help & Discussion
    Replies: 0
    Last Post: 20 Nov 2008, 2:55 PM

Thread Participants: 2

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..." hd porno faketaxi