Search code examples
sencha-touch-2toolbarsencha-touch-theming

Sencha Touch toolbar height


I dynamically create a bottom toolbar but it has its default height no matter the value I give to the height property. I tried the purcentage, pixels, simple numbers but nothing works.

myComponent.add({
                        xtype:'toolbar',

                        autoDestroy:true,
                        docked:'bottom',
                        bottom:0,

                        width:'100%',
                        height:'5px',

                        margin:'0 0 0 0',
                        padding:'0 0 0 0',

                        layout:{
                            pack:'middle',
                            align:'middle'
                        }
});

Solution

  • You must change the minHeight property.

    A working Example from my Code:

    Ext.define('MyApp.view.FailureBar', {
        extend : 'Ext.Toolbar',
        alias : 'widget.failureBar',
        config : {
            docked : 'bottom',
            minHeight : '30px',
            zIndex : 1,
            cls : 'failureBar'
        }
    });