Titanium JIRA Archive
Titanium SDK/CLI (TIMOB)

[TIMOB-7837] Android: View - height:'auto' causing child view to not be displayed

GitHub Issuen/a
TypeBug
PriorityHigh
StatusClosed
ResolutionFixed
Resolution Date2012-05-02T11:07:37.000+0000
Affected Version/sRelease 1.8.1, Release 1.8.2
Fix Version/sRelease 2.0.0, Sprint 2012-06
ComponentsAndroid
Labelsmodule_view, parity, qe-testadded
ReporterJon Alter
AssigneeAllen Yeung
Created2012-02-28T08:12:12.000+0000
Updated2012-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;
};

Comments

  1. Ivan Skugor 2012-03-01

    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. ;)
  2. Allen Yeung 2012-03-13

    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
  3. Allen Yeung 2012-03-16

    Resolving as a part of https://github.com/appcelerator/titanium_mobile/pull/1659
  4. Natalie Huynh 2012-03-19

    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
  5. Natalie Huynh 2012-05-02

    Open to update label

JSON Source