Results 1 to 4 of 4

Thread: Component Alignment?

  1. #1
    Sencha Premium Member
    Join Date
    Sep 2013
    Posts
    99

    Default Component Alignment?

    I have a label inside a panel that I want centered (horizontally) within the panel at all times, how can I achieve this? The only option I see there is defaultAlign but it doesn't seem to change anything, the panel that the label is in does have an absolute layout though, so I'm not sure if that affects it. Any help would be greatly appreciated.

  2. #2
    Sencha - Support Team scottmartin's Avatar
    Join Date
    Jul 2010
    Location
    Houston, Tx
    Posts
    9,409
    Answers
    716

    Default

    Something like this?

    Code:
            Ext.create('Ext.form.Panel', {
                title: 'Simple Form',
                bodyPadding: 5,
                width: 350,
                height: 200,
               
                title: 'MyPanel',
    
                renderTo: Ext.getBody(),
    
                html: '<center>This text will be center-aligned.</center> '
            });

  3. #3
    Sencha Premium Member
    Join Date
    Sep 2013
    Posts
    99

    Default

    not exactly, I have a label component, and it's text is going to be changing constantly, also the panel it's on will be able to get resized, so I just want to keep it centered within the panel, is there an option for that?

  4. #4
    Sencha Premium User
    Join Date
    Feb 2011
    Location
    NJ
    Posts
    337
    Answers
    62

    Default

    You could use the hbox layout with pack: 'center'. Something like this:

    Code:
    Ext.create('Ext.form.Panel', {
        title: 'Simple Form',
        bodyPadding: 5,
        width: 550,
        height: 200,
        title: 'MyPanel',
        renderTo: Ext.getBody(),
        layout: {
            type: 'hbox',
            pack: 'center'
        },
        items: [{
            xtype: 'label',
            text: 'Your text label'
        }]
    });

Posting Permissions

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