PDA

View Full Version : List contained in panel does not display



paulroth3d
14 Apr 2012, 1:18 PM
NOTE: I realized I posted this to the wrong forum (instead of the Sencha Forum) - admin can you close this thread? I can't figure out how to move the thread to the right forum.

Using sencha touch 2, I seem to be unable to get a list to display inside of a panel, has anyone seen this or found a way around it?

If I display a list by itself, it works fine:



Ext.define( 'troubleshooting.view.AccountsInline', {
extend: 'Ext.List',
xtype: 'AccountsInline',

listeners: {
initialize: function( self ){
console.log( "AccountsInline initialized!" );
}
},

config: {
fullscreen: true,
id: 'cucaList',
itemTpl: '{firstName} {lastName}',
store: {
fields: [
{name: 'firstName', type: 'String'},
{name: 'lastName', type: 'String'},
{name: 'middleInitial', type: 'String'}
],
data: [
{ firstName: "George", middleInitial: 'B', lastName: "Burns" },
{ firstName: "George", middleInitial: 'G', lastName: "Washington" },
{ firstName: "George", middleInitial: 'W', lastName: "Carver" }
]
}
}
});



And if I have a panel with other panels, that works fine:



Ext.define( 'troubleshooting.view.PanelInline', {
extend: 'Ext.Panel',
xtype: 'PanelInline',

config: {
fullscreen: true,
layout: {
type:'vbox',
align: 'stretch',
style: 'background-color: #FF0000'
},

/* defaults: { flex:1 }, */

items: [{
xtype:'panel',
flex: 1,
style: 'background-color: #00FF00',
html: 'Sub panel'
},{
xtype:'panel',
flex: 1,
style: 'background-color: #0000FF',
html: 'Sub panel'
}]
}
});



But if I have a panel with a list, then the list does not show:



Ext.define( 'troubleshooting.view.PanelCombined', {
extend: 'Ext.Panel',
xtype: 'PanelCombined',

config: {
fullscreen: true,
config: {
layout: {
type:'vbox'
//align: 'stretch'
}
},

items: [{
xtype:'panel',
height: 200,
style: 'background-color: #00FF00',
html: 'Sub panel'
},{
xtype: 'list',

listeners: {
initialize: function( self ){
console.log( "AccountsInline does get initialized!" );
}
},

config: {
flex: 1,

//-- even setting the size to explicit sizes does not solve the problem
//height: 300,
//width: 300,
//style: 'background-color: #0000FF',

itemTpl: '{firstName} {lastName}',
store: {
fields: [
{name: 'firstName', type: 'String'},
{name: 'lastName', type: 'String'},
{name: 'middleInitial', type: 'String'}
],
data: [
{ firstName: "George", middleInitial: 'B', lastName: "Burns" },
{ firstName: "George", middleInitial: 'G', lastName: "Washington" },
{ firstName: "George", middleInitial: 'W', lastName: "Carver" }
]
}
}
}]
}
});