Sencha彈出列表itemtap

在我的應用程序中，我有一個列表。我想在輕按項目時顯示彈出式（覆蓋）。它適用於某些項目，但對於某些項目，疊加層會直接進入列表項目。Sencha彈出列表itemtap

注：我想顯示一個疊加箭頭指向當前選定的項目。這裏是我的代碼：

var overlay = new Ext.Panel({ 
     floating: true, 
     modal: true, 
     width: 100, 
     height: 100, 
     scroll: false}); 

var list = Ext.extend(Ext.List, { 

    store: myStore, 
    itemTpl: "{firstName} {lastName}", 

    listeners: { 
     itemtap: function (list, index, element, event) { 
     // Grab a reference the record. 
     var record = list.getRecord(element); 

     // First, we update the the overlay with the proper record (data binding). 
     overlay.update(record.data); 
     overlay.showBy(element, 'fade'); 
     list.doComponentLayout();   
    } 
}});

問題，可能是我沒有得到正確的列表項。我只是在這裏使用當前元素。我也嘗試list.getNode（索引），但它做同樣的事情。任何人都可以引導我正確的方向嗎？

塔倫。

來源

2011-10-20 tarun_sharma

只是函數添加false的演出即overlay.showBy(element, 'fade',false);

http://docs.sencha.com/touch/1-1/#!/api/Ext.Panel-method-showBy

來源

2011-10-20 14:37:35 ilija139

哦！我是多麼的愚蠢......謝謝llya。 –

解決方案工作完美，但是當我將面板擴展到vbox佈局中的按鈕時，顯示的面板高度隨機降低。即對於一些項目，它顯示完美的箭頭面板和三個垂直堆疊的按鈕，但對於一些項目在列表底部的特殊項目面板高度減少??我無法認識到這種隨機行爲。 –

這裏是我的面板代碼。

var overlay = new Ext.Panel({ 
// We'll set the image src attribute's value programmatically. 
//dock:'left', 
floating: true, 
modal: true, 
width: 138, 
height: 140, 
scroll: false, 
layout: { 
    type: 'vbox', 
    align:'center', 
    pack:'center' 
}, 
//defaults:{flex:1}, 
items:[ 
    {xtype: 'spacer'}, 
    { 
      xtype: 'button', 
      ui:'action', 
      height:30, 
      width:103, 
      id: 'profileButton', 
      text: 'Profile' 
    }, 
    {xtype: 'spacer'}, 
    { 
     xtype: 'button', 
     ui:'action', 
     height:30, 
     width:103, 
     id: 'positionsButton', 
     text: 'Positions' 
    }, 
    {xtype: 'spacer'}, 
    { 
     xtype: 'button', 
     ui:'action', 
     height:30, 
     width:103, 
     id: 'actionButton', 
     text: 'Action' 
    }, 
    {xtype: 'spacer'} 
]});

來源

2011-10-21 07:42:54

Sencha彈出列表itemtap

回答

相關問題