Sencha Touchでボタンハンドラを使用してパネルを追加する

Question

少し助けが必要です。私はSencha Touchでアプリケーションを構築しています。ボタンを押したときにコンテナ内のドッキングアイテムを変更する必要があります。これは、アプリ内のコンテンツを変更する（つまり、ページを切り替える）最適な方法だと考えています。

これまでのところ、私は次のコードを持っている -

var App = new Ext.Application({ 
    name: 'Test', 
    useLoadMask: true, 
    launch: function() { 

     // Toolbar 
     Test.views.toolbar = new Ext.Toolbar({ 
      id: 'toolbar', 
      title: 'Friend Pay' 
     }); 

     // Content 
     Test.views.content = new Ext.Panel({ 
      id: 'content', 
      layout: 'fit', 
      dockedItems: [{ 
       cls: 'copy', 
       html: '<h2>Copy block</h2>' 
      }, { 
       xtype: 'button', 
       id: 'buttonPanel', 
       html: 'Request Payment', 
       handler: function() { 
        // Link to newBlock panel 
       } 
      }] 
     }); 

     // Content 
     Test.views.newBlock = new Ext.Panel({ 
      id: 'content', 
      layout: 'fit', 
      dockedItems: [{ 
       cls: 'copy', 
       html: '<h2>Test 2</h2>' 
      }] 
     }); 

     // Container 
     Test.views.container = new Ext.Panel({ 
      id: 'container', 
      layout: 'fit', 
      dockedItems: [Test.views.toolbar, Test.views.content] 
     }); 

     // Viewport - Entire screen 
     Test.views.viewport = new Ext.Panel({ 
      fullscreen: true, 
      scroll: 'vertical', 
      items: [Test.views.container] 
     }); 

    } 
}); 

関数内で必要とされるどのような機能（）ではなくコンテンツよりnewBlockするコンテナ内dockedItemを変更するには、ボタンハンドラのためのタグ。

多くのお手伝いをいただきありがとうございます。

Answer 1

addDockedおよびremoveDocked。

Test.views.viewport.removeDocked(Test.views.content) 
Test.views.viewport.addDocked(Test.views.newBlock) 

あなたが多分あなたは、通常のitemsコレクションに追加するメンター、しかしdockedItemsにコンテンツを追加している少し奇妙に思えますか？ どちらの方法でも、標準コンポーネント機能に慣れ親しむためにExt.Panelのすべてをmain api docsにチェックアウトしてください。