Sencha Touch帶按鈕的固定彈出窗口

Question

我需要創建一個包含按鈕的錨定彈出窗口，當點擊一個新的視圖時創建。請參閱下面的屏幕截圖（從yelp移動應用程序獲取）。我一直沒能找到這個功能的例子 - 由於

Answer 1

我不KNW如何創建一個錨定彈出窗口，但你可以嘗試在煎茶觸摸-2實施Action Sheet。
它不固定，但它可以包含可以提供功能的按鈕。

Answer 2

我認爲你正在尋找的只是一個浮動面板。

參見例如sencha docs及其使用showBy方法的示例。

希望這可以幫助你。

Answer 3

This issue can be resolve by calling a panel inside a container. 

//添加container1.js鑑於

Ext.define('Sencha.view.container1', { 
extend: 'Ext.Container', 
alias: 'widget.container1', 
xtype: 'container1', 
//fullscreen: true, 

config: { 
scrollable: true, 
height: 50, 
    items: [ 
     { 
       docked: 'top', 
       xtype: 'titlebar', 
       items: [ 
       { 
       xtype: 'button', 
       ui: 'confirm', 
       text: 'Back', 
       itemId: 'button113', 
       id: 'rightButton', 
       handler: function() { 
       var sh = Ext.create('Sencha.view.panel1', { 
            extend: 'Ext.Panel', 
            fullscreen:true, 

           }); 
           sh.show(); 


       } 
       } 
       ] 
      } 
    ] 
    } 
}); 

//添加panel1.js也查看

Ext.define("Sencha.view.panel1", { 
extend: "Ext.Panel", 
alias: "widget.panel1", 

config: { 


     html: 'Floating Panel', 
     //left: 0, 
     //padding: 50, 
     items: [ 
     { 
      xtype: 'button', 
      ui: 'action', 
      height: 20, 
      text: 'Edit Bussiness', 

     }, 
     { 
      xtype: 'button', 
      ui: 'action', 
      height: 20, 
      text: 'Add Photo', 
     }, 
     { 
      xtype: 'button', 
      ui: 'action', 
      height: 20, 
      text: 'Add BookMark', 
     }, 
     { 
      xtype: 'button', 
      ui: 'action', 
      height: 20, 
      text: 'Check In', 
     }, 
     { 
      xtype: 'button', 
      ui: 'action', 
      height: 20, 
      text: 'Write Review', 
     }, 
     { 
      xtype: 'button', 
      ui: 'action', 
      height: 20, 
      text: 'Make Reservation', 
     }, 

      { 
      xtype: 'button', 
      ui: 'action', 
      height: 20, 
      text: 'Cancel', 
       handler: function() { 
       this.up('panel').hide(); 
       } 
      }, 

     ], 
     listeners: [ 
     { hide: { fn: function(){ this.destroy();} }}, 


     ] 
} 
}); 

//App.js

Ext.application({ 
    name: 'Sencha', 

    controllers: ['Main'], 

    views: ['container1', 'panel1'], //add all the view files here which you wants to call on any other panel so that the instance of it will be created. 
    stores: [], 
    models: [], 

    launch: function() { 
     Ext.Viewport.add({ 
      xtype: 'container1' 
     }); 
    } 
}); 

這個工作對我來說會給你相同的輸出。此外，在取消按鈕它會隱藏面板希望這會幫助你。 謝謝