title: Scrollable panel in sencha touch
body: <p>i had made a panel with number of buttons in it like this,</p>
  
  <pre><code>Ext.define('BeLocal.view.Test', {
         extend: 'Ext.Panel',
  
         config: {
         fullScreen: true,
         height: 482,
         width: 324,
         scrollable: 'vertical',
         items: [
                 {
                 xtype: 'button',
                 text: 'MyButton1'
                 },
                 {
                 xtype: 'button',
                 top: '30%',
                 text: 'MyButton2'
                 },
                 {
                 xtype: 'button',
                 top: '50%',
                 text: 'MyButton3'
                 },
                 {
                 xtype: 'button',
                 top: '96%',
                 text: 'MyButton4'
                 },
                 {
                 xtype: 'button',
                 top: '110%',
                 text: 'MyButton5'
                 }
                 ]
         }
  
         });
  </code></pre>
  
  <p>i can show only 3 buttons now.
  i want this panel scrollable so that i can show all the buttons by scrolling it down, i had set property <strong>scrollable: 'vertical'</strong> , but it doesn't work.
  When i remove position of all buttons like <strong>top:50%</strong> scroll works properly, but i want all the buttons on proper position.
  how can i fix this problem ?</p>