[TIMOB-12577] [android] horizontal layout doesnt compute correctly

GitHub Issue	n/a
Type	Bug
Priority	High
Status	Closed
Resolution	Fixed
Resolution Date	2013-04-22T20:46:32.000+0000
Affected Version/s	Release 3.0.0, Release 3.1.0
Fix Version/s	Release 3.2.0
Components	Android
Labels	exalture, module_views, qe-testadded
Reporter	Martin Guillon
Assignee	Sunila
Created	2012-10-14T17:35:54.000+0000
Updated	2014-06-19T12:43:47.000+0000

Description

When using a horizontal layout with a view where the width is Ti.UI.FILL, you expect that view to take as much width as possible without expanding outside its parent. Running the example below, you can see that it works correctly on ios (click the label for info) On android, the label will actually have the width of its parent, and not the expected width i did not test but i assume the problem is the same with vertical layout

var win = Titanium.UI.createWindow();
win.backgroundColor = '#ccc';

var container = Ti.UI.createView({
    	height:70,
    	layout:'horizontal',
        horizontalWrap:false,
    	backgroundColor:'red'
   	})
var view = Ti.UI.createView({
    	width:100,
    	backgroundColor:'blue'
   	})
container.add(view);

var view2 = Ti.UI.createLabel({
	width:Ti.UI.FILL,
	backgroundColor:'green',
	textAlign:'right',
	text:'TEST'
})
container.add(view2);

view2.addEventListener('click', function(e) {
	alert('my width is ' + e.source.rect.width + ' when it should be ' + eval(container.rect.width - view.rect.width));
})
win.add(container);
win.open();

Comments

Jamie Buckley 2013-02-05

Confirmed issue on android 4.0.3 with 3.0.0 GA on both Vertical and Horizontal layouts.
Shameer Jan 2013-03-07

The problem reproduces with release 3.0.2 and master release 3.1.0 tested on Titanium Studio, build: 3.0.2.201302191606 Titanium SDK version: 3.1.0 Titanium SDK version: 3.0.2 Device: Samsung galaxy s duos Android version: 4.0.4 Android Emulator: Android SDK version: 2.2
Sunila 2013-04-08

Added boundary condition for width so that it doesn't exceed max width https://github.com/appcelerator/titanium_mobile/pull/4115

Allen Yeung 2013-04-11

This is not an issue with vertical layouts:

   var win = Titanium.UI.createWindow();
   win.backgroundColor = '#ccc';
    
   var container = Ti.UI.createView({
           height:Ti.UI.FILL,
           layout:'vertical',
        //   horizontalWrap:false,
           backgroundColor:'red'
       })
   var view = Ti.UI.createView({
           height:300,
           backgroundColor:'blue'
       })
   container.add(view);
    
   var view2 = Ti.UI.createLabel({
       height:Ti.UI.FILL,
       backgroundColor:'green',
       textAlign:'right',
       text:'TEST'
   })
   container.add(view2);
    
   view2.addEventListener('click', function(e) {
       alert('my width is ' + e.source.rect.height + ' when it should be ' + eval(container.rect.height - view.rect.height));
   })
   win.add(container);
   win.open();

Tested on 3.0.2.GA

Allen Yeung 2013-04-12

PR related to this: https://github.com/appcelerator/titanium_mobile/pull/4045
Allen Yeung 2013-04-22

backport to 3_1_X: https://github.com/appcelerator/titanium_mobile/pull/4206
Federico Casali 2013-10-18

Verified fixed. TiSDK 3.2.0.v20131017152001 CLI 3.2.0 Titanium Studio 3.2.0.201310152326 Closing.
Martin Guillon 2013-10-18

great thanks for your work

JSON Source