Titanium JIRA Archive
Titanium SDK/CLI (TIMOB)

[TIMOB-9305] iOS: Vertical layout View inside ScrollView bug

GitHub Issuen/a
TypeBug
PriorityLow
StatusOpen
ResolutionUnresolved
Affected Version/sn/a
Fix Version/sn/a
ComponentsiOS
Labelsautoheight, layout, reprod, scrollview
ReporterDamien Meurisse
AssigneeUnknown
Created2012-04-27T03:40:02.000+0000
Updated2018-02-28T20:03:24.000+0000

Description

Intro

I just started migrating my app from sdk1.8.2 to 2.0.1.GA2 and I am having issues with my views inside tableviews .. I think the one in fault here is the view that doesn't actualize its automatic height once it reaches the screen height.

Test Case

var win = Ti.UI.createWindow({backgroundColor: 'white'});
 
var scroll = Ti.UI.createScrollView({
    top:0, left:0, right:0, bottom:0,
    contentHeight:'auto',
});
 
var itemsView = Ti.UI.createView({
    layout:'vertical',
    height:Ti.UI.SIZE
});
itemsView.addEventListener('postlayout', function(){
	Ti.API.info('width='+itemsView.size.width+' & height='+itemsView.size.height);
});

function addLabels() {
	Ti.API.info('Calling addLabels');
	var colors = ['red','green','grey'];
	for(var i = 0; i < 6; i++) {
	    itemsView.add(Ti.UI.createLabel({
	        width:Ti.UI.FILL, height:80,
	        textAlign:'center',
	        text: 'dodoah ' + i,
	        backgroundColor: colors[i%3],
	    }));        
	}
}

addLabels();
setTimeout(addLabels, 2000);
 
scroll.add(itemsView);
 
win.add(scroll);
win.open();

setTimeout(function(){
	Ti.API.info('Opening window');
	var modal = Ti.UI.createWindow({
		title:'Modal',
		backgroundColor:'white'
	});
	modal.open({ modal:true });
	setTimeout(function(){
		Ti.API.info('Closing window');
		modal.close();
	}, 1000);
}, 5000);

Problem

{quote} [INFO] Application started [INFO] test/1.0 (2.0.2.v20120418121806.0684d32) [INFO] Calling addLabels [INFO] width=320 & height=480 ... [INFO] width=320 & height=480 [INFO] Calling addLabels [INFO] width=320 & height=560 [INFO] width=320 & height=560 [INFO] Opening window [INFO] width=320 & height=960 [INFO] width=320 & height=960 [INFO] Closing window [INFO] width=320 & height=960 ... {quote} After 2 seconds, there should be 12 labels on top of each other, but only 7 appear. You can only see the rest after a redraw action (in this case, a modal window, but a regular window or even a keyboard would do the trick). As you can see, there are only two postlayout events after the second call and the size does not correspond to 6 * 80 pixels labels added. As soon as the modal window opens, new postlayout events are called but this time with the right height.

Note

I know a tableview would work just fine in this case, but it is just a basic sample code to show you the but i am having with more complicated code. And the problem also appears with a horizontal layout.

Comments

  1. Damien Meurisse 2012-05-11

    Hi, it's been almost 2 weeks now, and i am a little surprise nobody commented, not even other developers. It makes me wonder how other developers build their apps, because to me it is a blocking bug :/
  2. Damien Meurisse 2012-05-24

    I tried with the 2.0.2.v20120522180515.0f37aba CI build, it works if I manually ask the scrollview to recalculate its contentHeight ! I just added scroll.contentHeight = 'auto'; at the end of my playing with the views (remove / add). I'd say it still is a bug because it doesn't do it by itself, but at least, I can work !
  3. Max Stepanov 2012-05-29

    Definitely a bug. Should be addressed.
  4. Lee Morris 2017-06-19

    I am able to reproduce this issue with the following environment; iPhone 7 (10.2) Studio 4.9.0.201705302345 Ti SDK 6.1.1.v20170609091155 Appc NPM 4.2.9 Appc CLI 6.2.1 Ti CLI 5.0.13 Alloy 1.9.11 Arrow 2.0.0 Xcode 8.2 (8C38) Node v4.8.2 Java 1.8.0_131

JSON Source