Titanium JIRA Archive
Titanium SDK/CLI (TIMOB)

[TIMOB-3296] Android: ScrollView does not scroll horizontally

GitHub Issuen/a
TypeBug
PriorityMedium
StatusClosed
ResolutionFixed
Resolution Date2011-09-01T12:42:05.000+0000
Affected Version/sRelease 1.6.0
Fix Version/sSprint 2011-35, Release 1.8.0
ComponentsAndroid
Labelsscrollview
ReporterRick Blalock
AssigneeVikramjeet Singh
Created2011-04-15T03:41:38.000+0000
Updated2011-09-13T10:02:25.000+0000

Description

Horizontal scrolling does not work past the dimensions of the device's screen (unlike iOS implementation).

HD ticket: http://developer.appcelerator.com/helpdesk/view/76287">http://developer.appcelerator.com/helpdesk/view/76287

Sample:

Titanium.UI.setBackgroundColor('#fff');

var win = Titanium.UI.createWindow({
    backgroundColor: '#fff'
});

var scrollView = Ti.UI.createScrollView({
    contentWidth: 1100,
    contentHeight: 367,
    top:0,
    left:0,
    showVerticalScrollIndicator:false,
    showHorizontalScrollIndicator:true,
    backgroundColor:'#d6d0b7'
});

var imageView = Ti.UI.createImageView({
    image: 'http://placehold.it/1094x367',
    width: 1094,
    height: 367,
    top: 50,
    left: 0
});

scrollView.add(imageView);
win.add(scrollView);

win.open();

Attachments

FileDateSize
screenshot_337.png2011-08-31T15:14:14.000+000013728

Comments

  1. Paul Dowsett 2011-04-20

    Environment: * Ti 1.6.2 (main release) * Android 2.3.3 This seems to be a more general problem than the initial ticket implied. From my tests, horizontal scrolling does not work currently for Android scrollViews at all. See the following demonstration, where the relative vs absolute layouts and auto vs explicit dimensions can be toggled to show that scrolling does not work in either situation. 
       Titanium.UI.setBackgroundColor('#000');
   
   var win = Ti.UI.createWindow();
   
   var viewWidth = 100;
   var viewLeftPadding = 20;
   var viewQty = 10;
   
   var scrollViewWidth = (viewWidth * viewQty) + (viewLeftPadding * viewQty) + viewLeftPadding;
   Ti.API.info("scrollViewWidth = " + scrollViewWidth);
   
   var scrollView = Ti.UI.createScrollView({
     backgroundColor:'red',
     contentWidth:scrollViewWidth,
   //  relative layout and auto width also does not work
   //  contentWidth:'auto',
   //  layout:'horizontal',
     contentHeight:'auto',
     top:0,
     showVerticalScrollIndicator:true,
     showHorizontalScrollIndicator:true,
     scrollType:'horizontal'
   });
   
   for (var i=0; i<viewQty; i++){
   	var thisView = Ti.UI.createView({
       backgroundColor:'green',
       width:viewWidth,
       height:100,
       left:viewLeftPadding + (viewWidth * i) + (viewLeftPadding * i),
   //	    left:viewLeftPadding, // for relative layout
       top:20
   	});
   	scrollView.add(thisView);
   }
   
   win.add(scrollView);
   
   win.open();
  2. Eduardo Gomez 2011-07-11

    Associated HD ticket

    A customer relies on this, http://appc.me/c/APP-139864
  3. Francisco Antonio Duran Ramirez 2011-08-22

    HD Ticket.

    An Enterprise customer relies on this. APP-346557
  4. Don Thorp 2011-08-31

    In the documentation, there is a property for android scrolltype http://developer.appcelerator.com/apidoc/mobile/latest/Titanium.UI.ScrollView-object you need to set it to "horizontal" Since Android can only scroll in one direction or the other in ScrollView we have to guess. The default is "vertical" the auto checks are as follows. if you provide a width and contentWidth and they are equal scrollType is "vertical" if you provide a height and contentHeight and they are equal scrollType is "horizontal" scrollType overrides the default and our guesses with the explicitly requested scrolling direction.
  5. Bill Dawson 2011-08-31

    We're keeping this item open because we want to add a log statement indicating when our guesses cannot be done, i.e., indeterminate scrolling direction which defaults to vertical. We'll put a log warning that points to the scrollType property.
  6. Paul Dowsett 2011-08-31

    Note: This has been tested and works correctly in the following env, as per Don's post/explanation. * Android 2.1 * Titanium 1.7.3 (2011/08/05 10:18 ) * emulator
  7. Bill Dawson 2011-08-31

    Testing the new warning message: Use this app.js and run it, check logcat and you should see the warning "W/TiUIScrollView ... Scroll direction could not be determined...". 
       var win = Ti.UI.createWindow();
   win.add(Ti.UI.createScrollView());
   win.open();
    Then do this one, which will deduce horizontal scrolling, and make sure the warning does **not** appear: 
       var win = Ti.UI.createWindow();
   win.add(Ti.UI.createScrollView({
   	height: 500, contentHeight: 500, width: "auto"
   }));
   win.open();
    Then do this one, which will deduce vertical scrolling, and make sure the warning does **not** appear: 
       var win = Ti.UI.createWindow();
   win.add(Ti.UI.createScrollView({
   	width: 500, contentWidth: 500, height: "auto"
   }));
   win.open();
  8. Bill Dawson 2011-08-31

    Pull req ready https://github.com/appcelerator/titanium_mobile/pull/433
  9. Don Thorp 2011-09-01

    Review and test.
  10. Vikramjeet Singh 2011-09-13

    Resolved. Warning is only displayed when expected Tested on: Mac OSX Lion TiMob: 1.8.0.v20110906155354 TiStud: 1.0.5.201109091616 Devices Used: Android Emulator 2.2 Droid3 Google Nexus S

JSON Source