See the attached images. The first image is from the Android emulator, and appears correctly. The second image is from the iPhone simulator and shows the problem. This is a layout parity issue.
var win1 = Ti.UI.createWindow({
layout : 'vertical',
backgroundColor : 'gray'
});
function Panel(PanelWidth) {
return Ti.UI.createView({
borderColor : 'black',
width : PanelWidth,
height : Ti.UI.SIZE,
layout : 'vertical',
left : 0,
top : 0,
borderWidth : 2,
borderRadius : 5
});
}
function PanelLabel(ParentView, Title) {
var l1 = Ti.UI.createLabel({
text : Title + '\n ',
left : '8dp',
right : '8dp'
});
ParentView.add(l1);
}
var HeaderView1 = Ti.UI.createView({
width : Ti.UI.FILL,
height : Ti.UI.SIZE,
layout : 'horizontal',
backgroundColor : 'yellow'
});
var PanelWidthWide = '45%';
var PanelWidthNormal = '35%';
var PanelWidthExtra = '40%';
var Row1Box1 = Panel(PanelWidthWide);
PanelLabel(Row1Box1, 'Row1Box1');
HeaderView1.add(Row1Box1);
var Row1Box2 = Panel(PanelWidthWide);
PanelLabel(Row1Box2, 'Row1Box2');
HeaderView1.add(Row1Box2);
var HeaderView2 = Ti.UI.createView({
width : Ti.UI.FILL,
height : Ti.UI.SIZE,
layout : 'horizontal',
backgroundColor : 'orange'
});
var Row2Box1 = Panel(PanelWidthNormal);
PanelLabel(Row2Box1, 'Row2Box1');
HeaderView2.add(Row2Box1);
var Row2Box2 = Panel(PanelWidthExtra);
PanelLabel(Row2Box2, 'Row2Box2');
HeaderView2.add(Row2Box2);
var Row2Box3 = Panel(PanelWidthNormal);
PanelLabel(Row2Box3, 'Row2Box3');
HeaderView2.add(Row2Box3);
var Row1 = Ti.UI.createView({
backgroundColor : 'red',
height : Ti.UI.SIZE,
width : Ti.UI.SIZE,
left : 0,
layout : 'horizontal'
});
Row1.add(HeaderView1);
var Row2 = Ti.UI.createView({
backgroundColor : 'blue',
height : Ti.UI.SIZE,
width : Ti.UI.SIZE,
left : 0,
layout : 'horizontal'
});
Row2.add(HeaderView2);
win1.add(Row1);
win1.add(Row2);
win1.open();
Tested and confirmed in iOS 6 simulator, Android emulator on Ti SDK 2.1.2 GA, 2.1.3 GA, 2.1.4 GA and 3.0 RC. All versions consistent with attached screenshots EXCEPT between 2.1.4 GA and 3.0 RC where the boxes in the Android emulator are in fact smaller, including the font.
Pull pending https://github.com/appcelerator/titanium_mobile/pull/3572
Backport PR to 3_0_X https://github.com/appcelerator/titanium_mobile/pull/3636
HD ticket: [APP-233365](http://support.appcelerator.com/tickets/APP-233365)
Views with height=Ti.UI.SIZE are rendering as expected. Verified with following Titanium SDK: 3.1.0.v20130102102603 Titanium SDK:3.0.1.v20121228113204 Titanium Studio:3.0.1.201212181159 Device: iPad4 iOs 6.0
Verified fixed with SDK 3.1.0.v20130109175536