[TIMOB-23930] Windows: ScrollView doesn't load complete data

GitHub Issue	n/a
Type	Bug
Priority	High
Status	Closed
Resolution	Fixed
Resolution Date	2016-10-21T09:26:00.000+0000
Affected Version/s	Release 5.5.0
Fix Version/s	Release 6.0.0
Components	Windows
Labels	n/a
Reporter	Rakhi Mitro
Assignee	Kota Iguchi
Created	2016-09-20T04:34:48.000+0000
Updated	2016-10-21T16:06:41.000+0000

Description

ScrollView doesn't work properly according to sample code provided in the [API](http://docs.appcelerator.com/platform/latest/#!/api/Titanium.UI.ScrollView) doc using SDK 5.5.0GA. It does not scroll to show the rest of the data. *Test Environment:* Operating System Microsoft Windows 8.1 Enterprise Node.js 0.12.7, npm Version 2.11.3 Appcelerator CLI Installer 4.2.4, Core Package 5.2.2 CLI Version 5.0.6,node-appc Version 0.2.31 SDK-5.5.0.GA,Windows phone device(8.1) *Test code:*

var win = Ti.UI.createWindow({
  backgroundColor:'white'
});

if (Ti.UI.Android){
  win.windowSoftInputMode = Ti.UI.Android.SOFT_INPUT_ADJUST_PAN;
}

function createRow(i) {
  var row = Ti.UI.createView({
    backgroundColor: 'white',
    borderColor: '#bbb',
    borderWidth: 1,
    width:'100%', height: 70,
    top: 0, left: 0
  });
  var inputTextField = Ti.UI.createTextField({
    hintText: 'Enter value ' + i,
    keyboardType: Ti.UI.KEYBOARD_NUMBERS_PUNCTUATION,
    top: 10, left: '10%',
    width: '80%', height: 60
  });
  row.add(inputTextField);
  return row;
}

var scrollView = Ti.UI.createScrollView({
  bottom:120,
  layout: 'vertical'
});

for(var i = 0; i <= 20; i++){
var row = createRow(i);
  scrollView.add(row);
}
win.add(scrollView);

var label = Ti.UI.createLabel({
  backgroundColor:'darkgray',
  text: 'Your advert here',
  textAlign: 'center',
  bottom:0,
  width: Titanium.UI.FILL,
  height:100
});
win.add(label);
win.open();

*Test Steps:* * Create a classic project * Copy the sample code and run on Windows phone device(8.1) * Scrollview is not working as expected and does not scroll to show complete data. Output: Check the [link](http://s12.postimg.org/l2i4hrbwd/wp_ss_20160920_0001.png).

Comments

Joe Finnigan 2016-09-27

I am also seeing this, simple alloy test case here:

Kota Iguchi 2016-10-06

I was able to reproduce this, started working on this. Temporary workaround for this would be: Set ScrollView.contentHeight manually.

   var win = Ti.UI.createWindow({
       backgroundColor: 'green'
   });
   
   function createRow(i) {
       var row = Ti.UI.createView({
           backgroundColor: 'blue',
           borderColor: '#bbb',
           borderWidth: 1,
           width: '100%', height: 70,
           top: 0, left: 0
       });
       var inputTextField = Ti.UI.createTextField({
           hintText: 'Enter value ' + i,
           keyboardType: Ti.UI.KEYBOARD_NUMBERS_PUNCTUATION,
           top: 10, left: '10%',
           width: '80%', height: 60
       });
       row.add(inputTextField);
       return row;
   }
   
   var scrollView = Ti.UI.createScrollView({
       bottom: 120,
       layout: 'vertical'
   });
   
   var contentHeight = 0;
   for (var i = 0; i <= 20; i++) {
       var row = createRow(i);
       contentHeight += parseInt(row.height);
       scrollView.add(row);
   }
   
   scrollView.contentHeight = contentHeight;
   
   win.add(scrollView);
   
   var label = Ti.UI.createLabel({
       backgroundColor: 'darkgray',
       text: 'Your advert here',
       textAlign: 'center',
       bottom: 0,
       width: Titanium.UI.FILL,
       height: 100
   });
   win.add(label);
   win.open();

Kota Iguchi 2016-10-06

master: https://github.com/appcelerator/titanium_mobile_windows/pull/876 6_0_X: https://github.com/appcelerator/titanium_mobile_windows/pull/877 I would like to merge this to 6_0_X because this is regression introduced in release 5.4.0.

Ewan Harris 2016-10-18

[~kota] If I explicitly set the scrollview to Ti.UI.FILL then it seems to keep with the behaviour of before. However on android it seems to work as expected

   var win = Ti.UI.createWindow(),
       scrollView = Ti.UI.createScrollView({
           layout: "vertical",
           backgroundColor: 'red',
           width: Ti.UI.FILL, height: Ti.UI.FILL,
       });
       
       
   function createRow(i) {
       var row = Ti.UI.createView({
           backgroundColor: 'blue',
           borderColor: '#bbb',
           top: 10,
           left: 10,
           height: Ti.UI.SIZE,
           width: Ti.UI.SIZE
       });
       var inputTextField = Ti.UI.createTextField({
           hintText: 'Enter value ' + i,
           keyboardType: Ti.UI.KEYBOARD_NUMBERS_PUNCTUATION
       });
       row.add(inputTextField);
       return row;
   }
   
   for (var i = 0; i <= 20; i++) {
       var row = createRow(i);
       scrollView.add(row);
   }
   
   win.add(scrollView);
   win.open();

Kota Iguchi 2016-10-19

Confirmed explicitly setting Ti.UI.FILL reproduces this issue. Reopening.
Kota Iguchi 2016-10-19

6_0_X: https://github.com/appcelerator/titanium_mobile_windows/pull/883 master: https://github.com/appcelerator/titanium_mobile_windows/pull/884
Ewan Harris 2016-10-21

Verified using: OS: Microsoft Windows 10 Pro 10.0.14393 Appc core: 6.0.0-63 Appc NPM: 4.2.8-9 Ti SDK: 6.0.0.v20161021055155 Code in description and example from previous comment now work as expected Closing ticket

JSON Source