在我的应用程序中,我有一个列表。我想在点击项目时显示弹出(叠加)。它适用于某些项目,但对于某些项目,叠加层会直接显示在列表项目中。
注意:我想显示带有指向当前所选项目的箭头的叠加层。 这是我的代码:
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(index),但它做了同样的事情。任何人都可以指导我正确的方向吗?
塔伦。
答案 0 :(得分:2)
只需按功能即false
overlay.showBy(element, 'fade',false);
添加到节目中
http://docs.sencha.com/touch/1-1/#!/api/Ext.Panel-method-showBy
答案 1 :(得分:0)
这是我的面板代码。
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'}
]});