Ext js 4.2 макет аккордеона в vbox

Question

Панель с компоновкой аккордеона содержится в vbox с другим одним элементом.

У меня есть 2 проблемы:

1. Когда я пытаюсь установить прогибаются панель с аккордеоном макетом он вызывает ошибку «[E] Схема запуск не удался»
2. Когда высота фиксируются Констанд он работает не так, как ожидалось: первая панель не рушится.

Вот пример кода:

Ext.create('Ext.panel.Panel', { 
    title: 'Accordion Layout', 
    width: 300, 
    height: 500, 
    layout: 'vbox', 
    items: [{ 
     xtype: 'datefield' 
    }, { 
     defaults: { 
      // applied to each contained panel 
      bodyStyle: 'padding:15px' 
     }, 
     layout: { 
      // layout-specific configs go here 
      type: 'accordion', 
      titleCollapse: true, 
      animate: true 
     }, 
     items: [{ 
      title: 'Panel 1', 
      html: 'Panel content 1!' 
     }, { 
      title: 'Panel 2', 
      html: 'Panel content 2!' 
     }, { 
      title: 'Panel 3', 
      html: 'Panel content 3!' 
     }], 
    }], 
    renderTo: Ext.getBody() 
}); 

http://jsfiddle.net/6DHM4/1/

Answer 1

Я не мог воспроизвести вашу ошибку, но все выглядит хорошо для меня flex: 1 если я изменю layout: 'vbox' к

layout: { 
    type: 'vbox', 
    align: 'stretch' 
} 

(см this fiddle)

Answer 2

может быть правильным способом является использование 'якоря' раскладку против 'VBox'? попробуйте этот путь?

Ext.create('Ext.panel.Panel', { 
title: 'Accordion Layout', 
width: 300, 
height: 500,  
layout: 'anchor', 
items: [ 
      {xtype: 'datefield'}, 
      { 
      defaults: { 
       // applied to each contained panel 
       bodyStyle: 'padding:15px' 
       ,anchor: '100%' 
      }, 

    ... 

Я не знаю, почему, но когда я проверить его на jsfiddle.net он показывает ошибку: "первая панель не сворачивается. Но если я тестирую его здесь, например, http://try.sencha.com/, он отлично работает.