Sencha Touch：按鈕

Question

我試圖在Sencha Touch 2的彈出窗口中實現按鈕。 按鈕的工作原理是什麼？我想要一個按鈕關閉窗口，另一個按鈕調用doSomething函數。

function foo(){ 
    Ext.Viewport.add({ 
     xtype: 'panel', 
     scrollable: true, 
     centered: true, 
     width: 400, 
     height: 300, 
     items:[ 
      { 
       docked: 'bottom', 
       xtype: 'titlebar', 
       items:[ 
        { 
         xtype: 'button', 
         ui: 'normal', 
         text: 'Do Something', 
         go: 'testsecond' 
        }, 
        { 
         xtype: 'button', 
         ui: 'normal', 
         text: 'Close', 
         go: 'testsecond',    
        },     
       ] 
      }, 
     ] 
    });//Ext.Viewport.add 
} 

function doSomething() { 
    console.log('hi'); 
} 

Answer 1

只是一個處理程序添加到按鈕像

或

{ 
    xtype: 'button', 
    ui: 'normal', 
    text: 'Close', 
    go: 'testsecond', 
    handler:function(){ 
     //do something. 
    }    
} 

Answer 2

簡單這裏

   { 
        xtype: 'button', 
        ui: 'normal', 
        text: 'Do Something', 
        go: 'testsecond', 
        handler:function(){ 
        //do something. 
        } 
       }, 
       { 
        xtype: 'button', 
        ui: 'normal', 
        text: 'Close', 
        go: 'testsecond', 
        handler:function(){ 
         //popup_window.hide(); 
        }    
       } 

Answer 3

我想，你需要類似疊加在東西Sencha Touch。

既然您要彈出窗口，您應該將此面板設置爲浮動窗格。

這裏是它們的工作原理：

Ext.Loader.setConfig({ 
    enabled: true 
}); 

Ext.application({ 
    name: 'FloatingPanelWindow', 

    launch: function() { 
     overlay = Ext.Viewport.add({ 
      xtype: 'panel', 
      scrollable: true, 
      modal: true,     // to make it floating 
      hideOnMaskTap: true,   // close the window by clicking on mask outside popup window 
      centered: true, 
      width: 400, 
      height: 300, 
      items:[ 
       { 
        docked: 'bottom', 
        xtype: 'titlebar', 
        items:[ 
         { 
          xtype: 'button', 
          ui: 'normal', 
          text: 'Do Something', 
          listeners : { 
           tap : function() { 
            overlay.hide(); // to close this popup window. 
            Ext.Msg.alert("Clicked on DoSomething"); //callDoSomethingMethod(); // perform your task here.        
           } 
          } 
         }, 
         { 
          xtype: 'button', 
          ui: 'normal', 
          text: 'Close', 
          listeners : { 
           tap : function() { 
            overlay.hide(); 
           } 
          }    
         },     
        ] 
         }, 
        ] 
    });//Ext.Viewport.add 
    } 
}); 

這是樣本輸出你會得到。