Results 1 to 4 of 4

Thread: change the height of a panel by dynamically ?

  1. #1
    Sencha User
    Join Date
    Dec 2010
    Posts
    48

    Default change the height of a panel by dynamically ?

    Hi All,
    I want to change the height of a panel by dynamically .
    How can i do this ?

    I have tried with setHeight() function . but it is not working.



    Any help would be appreciated

    Shiju

  2. #2
    Sencha User AndreaCammarata's Avatar
    Join Date
    Jun 2009
    Location
    Italy
    Posts
    1,395

    Default

    Hi Shijutv,
    setHeight() is the right function.
    What's the error you got? Could you provide the code you are using?
    Alternatively try to use setSize(width, height).
    Sencha Inc
    Andrea Cammarata, Solutions Engineer
    Owner at SIMACS

    @AndreaCammarata
    www.andreacammarata.com
    github: https://github.com/AndreaCammarata

    TUX components bundle for Sencha Touch 2.x.x
    https://github.com/AndreaCammarata/TUX


  3. #3
    Sencha User jep's Avatar
    Join Date
    Sep 2010
    Posts
    862

    Default

    Was it something along the lines of:
    TypeError: Result of expression '_______.setHeight' [undefined] is not a function.
    ?

    I'm thinking you're calling it before the panel has actually been rendered. On the other hand, this will work:

    Code:
    onReady: function() { 
      
        var pnl = new Ext.Panel({
          style:{backgroundColor:'yellow'},
          html:'Child panel'
        }); 
      
        var mainPanel = new Ext.Panel({
          fullscreen:true,
          items:[pnl]
        });
        
        pnl.setHeight(300);  
      
      }
    but this will throw that error:

    Code:
      onReady: function() { 
      
        var pnl = {xtype:'panel',
          style:{backgroundColor:'yellow'},
          html:'Child panel'
        }; 
      
        var mainPanel = new Ext.Panel({
          fullscreen:true,
          items:[pnl]
        });
        
        pnl.setHeight(300);  
      
      }
    This is because pnl is using an xtype. The actual Ext.Panel it represents isn't created until later when the mainPanel renders. So you try to call setHeight on the config object, not on the actual Ext.Panel object. In this case, the variable pnl will NEVER point to the actual Ext.Panel object. You could use something like this, though it's probably not what you want:

    Code:
      onReady: function() { 
      
        var pnl = {xtype:'panel',
          style:{backgroundColor:'yellow'},
          html:'Child panel'
        }; 
      
        //var 
        mainPanel = new Ext.Panel({
          fullscreen:true,
          items:[pnl],
          listeners:{
            render:function (sender) { sender.getComponent(0).setHeight(300); }
          } 
        });     
      
      }

  4. #4

    Default

    I solved it, try this:

    HTML Code:
    Ext.getCmp('hbox').setHeight(0).setHeight('auto');

Similar Threads

  1. Auto adjust panel height after dynamically adding items
    By markalroberts in forum Ext 3.x: Help & Discussion
    Replies: 9
    Last Post: 1 Jul 2014, 4:50 AM
  2. Can't change panel height in a viewport
    By lpastor in forum Ext 3.x: Help & Discussion
    Replies: 8
    Last Post: 31 Oct 2009, 3:07 PM
  3. Getting Dynamically Changing Panel to Fit to Height
    By psysephiroth in forum Ext 2.x: Help & Discussion
    Replies: 0
    Last Post: 23 Jul 2009, 11:50 AM
  4. Dynamically height of south Panel
    By sheddy in forum Ext 2.x: Help & Discussion
    Replies: 16
    Last Post: 3 Sep 2008, 12:25 PM
  5. Dynamically setting the height of a panel
    By NotChris in forum Ext 2.x: Help & Discussion
    Replies: 3
    Last Post: 6 Mar 2008, 8:00 AM

Posting Permissions

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