[TIMOB-7837] Android: View - height:'auto' causing child view to not be displayed
GitHub Issue | n/a |
---|---|
Type | Bug |
Priority | High |
Status | Closed |
Resolution | Fixed |
Resolution Date | 2012-05-02T11:07:37.000+0000 |
Affected Version/s | Release 1.8.1, Release 1.8.2 |
Fix Version/s | Release 2.0.0, Sprint 2012-06 |
Components | Android |
Labels | module_view, parity, qe-testadded |
Reporter | Jon Alter |
Assignee | Allen Yeung |
Created | 2012-02-28T08:12:12.000+0000 |
Updated | 2012-05-02T11:07:37.000+0000 |
Description
Setting the height of a view to 'auto' causes the child view to not be displayed. If you set the height to a constant value the the child view will be displayed.
Steps to reproduce:
Step 1: run the code below Step 2: notice the the red view is not green (it would be green if clickView was visible). Step 3: in sectionHeader change "height: 'auto'" to "height: 30" Step 4: run the app again Step 5: notice that the red view is now green
var win = Ti.UI.createWindow({backgroundColor:'white'});
win.open();
var section = createSectionView('TEST');
win.add(section);
function createSectionView(text){
var sectionView = Ti.UI.createView({
height: 'auto',
layout: 'vertical',
});
// using 'auto' here causes clickView to not be displayed
var sectionHeader = Ti.UI.createView({
height: 'auto',
// height: 30,
backgroundColor:'red',
});
var sectionHeaderLabel = Ti.UI.createLabel({
text: text,
height: 'auto',
top: 2,
bottom: 3,
left: 10,
right: 10,
color: '#FFF',
});
var clickView = Ti.UI.createView({
backgroundColor: 'green',
opacity: 0.5,
});
sectionView.add(sectionHeader);
sectionHeader.add(sectionHeaderLabel);
sectionHeader.add(clickView);
return sectionView;
};
IMHO, the problem is "auto" dimension value (percentage has similar problem). It can't be used in components that are composite (ScrollView and "contentHeight/Width", TableView and TableViewSection/TableViewRow). There are couple of tickets related to this, in one of them I suggested implementation of general behavior, so you might want to check it. ;)
The behavior has changed since the composite layout spec. The auto behavior for height is different so the best thing to do is set a height. This should be tested in both iOS and android with the height set to 30, to verify parity. This needs to be tested as a part of https://github.com/appcelerator/titanium_mobile/pull/1659
Resolving as a part of https://github.com/appcelerator/titanium_mobile/pull/1659
Tested with 2.0.0.v20120319003254 with rhino/v8 on Android Emulator 2.3.3 and iPhone 5.0 with height set to auto and height to 30
Open to update label