Results 1 to 3 of 3

Thread: Auto sizing north region

  1. #1
    Sencha Premium Member
    Join Date
    Jul 2011
    Posts
    119
    Vote Rating
    5
      0  

    Default Auto sizing north region

    How to I make the 'north' panel size to it's contents?

    As shown, the north region has no height. If I set it using height:300 that works, but I want it to auto-size to contents. Thanks,

    Code:
    Ext.onReady(function ()
    {
    	var tabs = Ext.create('Ext.form.Panel', {
    		//height: 300,
    		region: "north",
    		border: false,
    		style: { border: 0 },
    		fieldDefaults: {
    			labelWidth: 75,
    			msgTarget: 'side'
    		},
    		defaults: {
    			anchor: '100%'
    		},
    
    
    		items: {
    			xtype: 'tabpanel',
    			activeTab: 0,
    			defaults: {
    				bodyStyle: 'padding:10px'
    			},
    
    
    			items: [{
    				title: 'Phone Numbers',
    				defaultType: 'textfield',
    
    
    				items: [{
    					fieldLabel: 'Home',
    					name: 'home',
    					value: '(888) 555-1212'
    				}, {
    					fieldLabel: 'Business',
    					name: 'business'
    				}, {
    					fieldLabel: 'Mobile',
    					name: 'mobile'
    				}, {
    					fieldLabel: 'Fax',
    					name: 'fax'
    				}]
    			}]
    		}
    	});
    
    
    	var grid = Ext.create('Ext.grid.Panel', {
    		region: 'center',
    		id: 'mainSection',
    		layout: 'fit',
    		columns: [{ text: "first" }, { text: "second"}]
    	});
    
    
    	Ext.create('Ext.container.Viewport', {
    		layout: 'border',
    		renderTo: Ext.getBody(),
    		items: [tabs, grid]
    	});
    });

  2. #2
    Sencha - Sr Software Engineer mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    39,556
    Vote Rating
    1272
      0  

    Default

    This is working great in 4.1.0 beta3 but not 4.0.7
    Mitchell Simoens @LikelyMitch
    Sencha Inc, Senior Software Engineer
    ________________
    Learn BBCode and use it! Checkout the CODE tag!

    Check out my GitHub, lots of nice things for Ext JS and Sencha Touch
    https://github.com/mitchellsimoens

  3. #3
    Sencha Premium Member
    Join Date
    Jul 2011
    Posts
    119
    Vote Rating
    5
      0  

    Default

    I think I've solved my problem. If I make the north region layout: 'fit' that seems to fix it (although using tabs, the tab panels themselves need layout: 'auto' to make it work).

    This is on 4.0.7

    Thanks,

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •