PDA

View Full Version : Card Layout does not display in HBox Layout



kohyea
1 Apr 2013, 8:06 AM
Ext.define('MyApp.view.tablet.Main', {
extend: 'Ext.Container',
requires: [
'Ext.TitleBar', 'Ext.SegmentedButton'
],
config: {
fullscreen: true,
layout: 'hbox',
items: [{
xtype: 'panel',
flex: 1,
cls: 'ui-side-bar',
items: [{
docked: 'top',
xtype: 'titlebar',
title: 'Browse'
}, {
xtype: 'toolbar',
ui: 'neutral',
docked: 'top',
scrollable: {
direction: 'horizontal',
indicators: false
},
items: [{
xtype: 'spacer'
}, {
xtype: 'segmentedbutton',
allowDepress: true,
items: [{
text: 'Folder',
pressed: true
},{
text: 'Name'
}]
}, {
xtype: 'spacer'
}]
},{
layout: 'card',
items: [{
html: 'First Item'
}, {
html: 'Second Item'
}]
}]
},{
xtype: 'panel',
flex: 2,
items: [{
docked: 'top',
xtype: 'titlebar',
title: 'Content'
}]
}]
}
});


Hi all,

I put a Card layout in HBox layout, but the card layout does not display, anyone call tell me how to fix this?

Thanks,
Kohyea

mitchellsimoens
3 Apr 2013, 4:59 AM
You need to give it a height or it's parent needs to give it a height via some layout.

The reason that container (assuming the one with First Item and Second Item) is not showing is because card layout makes the children have 100% height and width but if it doesn't have a size then it can't give it's children a size can it?