PDA

View Full Version : Can't find the correct layout solution to build my page



explo91
24 Jan 2014, 6:21 AM
Hi all,

I want to use layout combinations to build a page but i cannot find the good soultion for this:

47699
(green and red square is a container (layout absolute) which contain an image with style="max-width: 150%; max-height: 150%" in order to have a square from random shape images)

This view is inside a tabpanel which parent's layout is a hbox layout with stretch.

Below, the parent's tabpanel container config.
The layout that i don't find a solution is for the child item of xtype 'collection.collection.grid'. I want that the view collection.collection.grid looks like the image above.
I don't want fix the size in px.



initComponent: function() {
Ext.apply(this, {
layout: {
type: 'hbox',
align: 'stretch'
},
items: [
{
xtype: 'tabpanel',
flex: 1,
activeTab: 0,
plain: true,
items: [
{
xtype: 'collection.collection.grid',
tabConfig: {
title: 'Grid'
}
},
{
xtype: 'collection.collection.list',
tabConfig: {
title: 'List'
}
}
]
},
{
xtype: 'panel',
flex: 1
},
{
xtype: 'container',
flex: 4
}
]
});
this.callParent();
}


Do you have an idea without fixing the size of red square ?

greg.barry
5 Feb 2014, 3:58 PM
It sounds like you may want to check out our Table Layout:
http://docs-origin.sencha.com/extjs/4.2.2/#!/api/Ext.layout.container.Table

Thanks!
Greg