[TIMOB-20380] Android: Views height / width properties are not respected inside ScrollableView

GitHub Issue	n/a
Type	Bug
Priority	Critical
Status	Closed
Resolution	Duplicate
Resolution Date	2017-05-05T13:35:39.000+0000
Affected Version/s	Release 5.2.0
Fix Version/s	Release 6.1.0
Components	iOS
Labels	autolayout, module_scrollableview, qe-5.2.0, qe-testadded
Reporter	Bert Grantges
Assignee	Gary Mathews
Created	2016-02-10T16:49:25.000+0000
Updated	2017-07-04T01:47:00.000+0000

Description

When adding Views to a ScrollableView on Android, the views are not rendering inside the ScrollableView properly. This appears to be the result of the height and width parameters not being respected and defaulting to Ti.UI.FILL. As such setting the ScrollableView to have a height of Ti.UI.SIZE does nothing. The expectation is that the internal Views would scale based on height and width parameters, and as such the ScrollableView would have a dynamic height based on the Ti.UI.SIZE declaration. In the attached screenshots you can see how this works on iOS (expected result) and on Android (incorrect result) Code Example: https://gist.github.com/grantges/ffbb0771adf091d15941

Attachments

File	Date	Size
android.png	2017-05-05T13:26:49.000+0000	9041
Screen Shot 2016-02-10 at 10.48.09 AM.png	2016-02-10T16:48:36.000+0000	357823
Screen Shot 2016-02-10 at 10.48.22 AM.png	2016-02-10T16:48:36.000+0000	361844

Comments

Josh Longton 2016-02-10

I am seeing the same results. Tested on: Nexus 6p (6.0) iOS Simulator (9.2)  Mac OSX El Capitan 10.11.2  Studio: 4.5.0.201602100601 Ti SDK: 5.2.0.v20160210114026, 5.1.2 GA  Appc NPM: 4.2.3-2  App CLI: 5.2.0-254  Xcode 7.2 .1 Node v4.2.4
Hieu Pham 2016-02-24

This is by design on Android. Views inside ScrollableView will behave as Ti.UI.FILL. I believe this is on the spec for layout.
Pedro Enrique 2016-02-24

Once Autolayout is fully implemented on iOS, this behavior will be the same as Android. This seems to be a bug on iOS. ScrollableViews have "pages". A page defined as a full-size view, which is a big as the ScrollableView viewing area. In other words, all the views passed in the views array will get a FILL width and height.

Hans Knöchel 2017-05-03

This is an Android-issue, not an iOS one. Here is why: * The problem is not with the default height values, it's with setting Ti.UI.Size to the ScrollableView * Labels always SIZE it's parent, so when no label height is given, it should receive the height of it's parent * On Android, the view height is not respected, although specified as Ti.UI.SIZE * On iOS, it is respected and the sub-view wraps properly See this example:

   var win = Ti.UI.createWindow({
       backgroundColor: '#fff'
   });
   
   var view1 = Ti.UI.createView({
       backgroundColor: "red",
       height: 100,
       width: '90%'
   });
   
   var label1 = Ti.UI.createLabel({
       text: 'View 1'
   });
   
   view1.add(label1);
   
   var view2 = Ti.UI.createView({
       backgroundColor: "green",
       height: 100,
       width: '90%'
   });
   
   var label2 = Ti.UI.createLabel({
       text: 'View 2'
   });
   
   view2.add(label2);
   
   var scrollable = Ti.UI.createScrollableView({
       views: [view1, view2],
       width: Ti.UI.FILL,
   	height: Ti.UI.SIZE,
   	top : "30dip"
   });
   
   win.add(scrollable);
   win.open();

Pedro and Hieu both talked about the default view-behavior, which is indeed FILL. But if you use SIZE, it should still use it. Re-assigning to [~gmathews] for the Android platform.

Gary Mathews 2017-05-05
Hani Hamadeh 2017-07-04

JSON Source