煎茶触摸2 - 旁源按钮位置的浮动面板

Question

我有此代码它创建中心到屏幕浮动面板：

Ext.define('myapp.view.ButtonNav', { 
extend: 'Ext.Container', 
xtype: 'myapp_buttonnav', 
config: { 
    fullscreen: false, 
    layout: 'hbox', 
    items: [ 
     { 
      xtype: 'button', 
      text: 'Button 1', 
      listeners: { 
       tap: function() { 
        var panel = Ext.Viewport.add({ 
         xtype: 'panel', 
         defaultType: 'button', 
         baseCls: 'btn1_cont', 
         centered: true, 
         layout: { 
          type: 'vbox', 
          align: 'center', 
          pack: 'center' 
         }, 
         items: [ 
          { 
           baseCls: 'btn1', 
           text: 'HOME PAGE', 
           handler: function() { 
            Ext.Viewport.setActiveItem({ 
             xtype: 'myapp_homepage' 
            }); 
            panel.destroy(); 
           } 
          } 
         ], 
         top: // SET TOP TO SOURCE BUTTON 
         left: // SET LEFT TO SOURCE BUTTON 
        }); 
       } 
      } 
     }, 

    ]   
} 
}); 

正如你可以看到，它是一个容器，具有一个按钮，用于点击时显示浮动面板。 如何将浮动面板定位在触发浮​​动面板的按钮的中心位置？

Answer 1

如果我理解正确的话，你需要使用showBy功能，像这样：

myPanel.showBy(myButton); 

它会显示旁边的按钮面板，您可以选择对齐方式为好。

You can take a look at the documentation

如何获得按钮

如果你看看水龙头听众签名：http://docs.sencha.com/touch/2-0/#!/api/Ext.Button-event-tap

你可以看到，第一个参数是按钮本身这样：

listeners: { 
    tap: function (myButton, myEvent) { 
    ... // create your panel 
    myPanel.showBy(myButton); 
    } 
} 

希望这会有所帮助