如何使用Sencha touch動態創建UI組件？

我是Sencha touch API的初學者。我真的很努力使用Sencha touch lib來製作UI組件。我創建了一些示例UI。但現在它本質上是靜態的。我怎樣才能使它動態。動態意味着我希望我的JSON響應決定要添加到屏幕上的組件。我怎樣才能做到這一點。請幫幫我。如何使用Sencha touch動態創建UI組件？

Ext.setup({ 
    icon: 'icon.png', 
    tabletStartupScreen: 'tablet_startup.png', 
    phoneStartupScreen: 'phone_startup.png', 
    glossOnIcon: false, 

    onReady: function() { 

     var form; 

     var formBase = { 
      scroll : 'vertical',    
      standardSubmit : false, 
      items: [ 
       { 
        xtype: 'fieldset', 
        title: 'Login Screen', 
        instructions: 'Enter agent number and password to login.', 
        defaults: { 
         required: true, 
         labelAlign: 'left', 
         labelWidth: '45%' 
        }, 
        items: [ 
        { 
         xtype: 'textfield', 
         name : 'username', 
         label: 'Agent Number', 
         useClearIcon: true 
        }, { 
         xtype: 'passwordfield', 
         name : 'password', 
         label: 'Password', 
         useClearIcon: false 
        }]     
       }], 
      listeners : { 
       submit : function(form, result){ 
        console.log('success', Ext.toArray(arguments)); 
       }, 
       exception : function(form, result){ 
        console.log('failure', result); 
       } 
      }, 

      dockedItems: [ 
       { 
        xtype: 'toolbar', 
        dock: 'bottom', 
        items: [ 
         { 
          text: 'Exit', 
          ui: 'exit', 
          handler: function() { 
            alert('Are you sure ?');        
          } 
         }, 
         { 
          text: 'Login', 
          ui: 'confirm', 
          handler: function() { 
            alert('Login please wait..'); 
          } 
         } 
        ] 
       } 
      ]  
     }; 

     if (Ext.is.Phone) { 
      formBase.fullscreen = true; 
     } else { 
      Ext.apply(formBase, { 
       autoRender: true, 
       floating: true, 
       modal: true, 
       centered: true, 
       hideOnMaskTap: false, 
       height: 385, 
       width: 480 
      }); 
     } 

     form = new Ext.form.FormPanel(formBase); 
     form.show(); 
    } 
});

來源

2011-09-23 Nilanchala Panigrahy

要將項目添加到面板使用panel.items.add(list);事後不要忘記調用panel.doLayout();。看到這個問題，例如Calling the items.add method twice causes the two items to overlap on the card

來源

2011-09-23 07:43:14 ilija139

你可以給我提供一些代碼示例。 –

Sencha Touch 2中沒有doLayout。他們說它會自動發生，但它不適用於我。 –

Dyanmic forms from json file in sencha touch

檢查此鏈接我已經發布了這個。你的解決方案只需要發送的xtype通過JSON。和任何你想要的意見。我也發佈了json文件和代碼來創建動態視圖.hope，它會幫助你

來源

2013-04-17 05:08:49

如何使用Sencha touch動態創建UI組件？

回答

相關問題