Layout Sencha触摸屏布局不占用所有可用屏幕空间

我有一个全屏面板

  PortalDashboard.views.Dashboardcard = Ext.extend(Ext.Panel, {
  fullscreen: true,
  title: 'Dashboard',
  html: '',
  cls: 'card5',
  iconCls: 'team',
  layout: Ext.Viewport.orientation == 'landscape' ? {
    type: 'hbox',
    pack: 'center',
    align: 'stretch'
  } : {
    type: 'vbox',
    align: 'stretch',
    pack: 'center'
  },
  monitorOrientation: true,
  listeners: {
        orientationchange : this.onOrientationChange,
    },
  styleHtmlContent: false,
  initComponent: function () {
    Ext.apply(this, {
      items: [
      {
        xtype: 'dashboardbox',
        items: [rep1, rep2, rep3]
      }, {
        xtype: 'dashboardbox',
        items: [rep4, rep5, rep6]
      }]
    });
    PortalDashboard.views.Dashboardcard.superclass.initComponent.apply(this, arguments);
  }
})

因此面板有一个hbox布局，有两个子面板。子面板实际上占据了全部水平空间，但不是垂直空间

我可以在css中设置最小高度，这在我的电脑上的chrome和safari中得到尊重。。。但ipad却忽视了这一点

子面板定义为：

PortalDashboard.views.DashboxBox = Ext.extend(Ext.Panel, {
  cls: 'dashbox',
  monitorOrientation: true,
  listeners: {
        orientationchange : this.onOrientationChange,
    },
  layout: Ext.Viewport.orientation == 'landscape' ? {
    type: 'vbox',
    align: 'stretch',
    pack: 'center'
  } : {
    type: 'hbox',
    align: 'stretch',
    pack: 'center'
  },
  defaults: {
    flex: 1
  }
});

Ext.reg('dashboardbox', PortalDashboard.views.DashboxBox);

---

我以前在一些子面板的TabPanel父面板上遇到过这种情况。在父面板中尝试布局：“适合”。（尽管我不确定将其添加到当前布局选项列表中是否有效，或者是否需要自行设置。）