Sencha Touch - Modal panel height to auto

Question

Is there a way to tell Sencha to resize a modal panel's height to wrap the elements rather than giving it a specific height ?

Answer 1

This can be done if its config property 'scrollable' is set to false.And using the following css code

.<yourPanelClass> .x-scroll-scroller,.<yourPanelClass> .x-scroll-container{
position:relative;
}

Answer 2

CustomComponent

Ext.define('MyApp.view.modal.Popup', {
    extend: 'Ext.Panel',
    xtype: 'popup',

    config: {
        cls: 'popup',
        modal: true,
        centered: true,
        hideOnMaskTap: true,
        height: 'auto'
    }
});

CSS

.popup {
  width: 90%;

  > .x-panel-inner {
    position: relative;

    overflow: hidden;
  }
}