Threaded View

  1. 19 Oct 2011 4:24 PM #1
    rockinthesixstring
    rockinthesixstring is offline
    Sencha User
    Join Date
    May 2011
    Posts
    143
    Vote Rating
    0
    Answers
    5
    rockinthesixstring is on a distinguished road
      0  

    Default Answered: How can I get these three buttons to centered and evenly spaced within the container?

    Answered: How can I get these three buttons to centered and evenly spaced within the container?


    Just wondering if anyone can let me know how I can get these three buttons to centered and evenly spaced within the container?
    Code:
    Ext.define('rpc.view.home.indexView', {    extend: 'Ext.Panel',
    alias: 'widget.homeView',
    config: {
       items: [{
           xtype: 'container',
           layout: { 
               type: 'vbox',
               pack: 'center'
           },
           defaults: {
               xtype: 'button',
               margin: '10 10 0 10'
           },
           items: [{
               text: 'Videos',
               cls: 'x-button-quicknav'
           }, {
               text: 'Events',
               cls: 'x-button-quicknav'
           }, {
               text: 'Sites',
               cls: 'x-button-quicknav'
           }]
        }]
    },
    initialize: function () {
        console.log('rpc.view.home.index ~ initialize');
    }
});
    Reply With Quote Reply With Quote
  2. Best Answer Posted by rockinthesixstring

    You're right, this works equally well

    Code:
               xtype: 'container',
           layout: {
               type: 'hbox',
               pack: 'center'
           },
           defaults: {
               xtype: 'button',
               ui: 'plain',
               flex: 1,
               cls: 'x-button-rpc'
           },
           items: [{
               text: 'Videos'
           }, {
               text: 'Events'
           }, {
               text: 'Sites'
           }]