Search code examples
appceleratorappcelerator-mobileappcelerator-titanium

Android - scrollTo() on ScrollView doesn't work properly


I'm using Titanium SDK 5.1.2.GA. I have a bar like TabGroup on Android and iOS. I move the scroll when a tab is not completely visible in the view and you click that tab.

On iOS works perfectly but on Android doesn't work fine.

This is my code to move the scroll view:

if((view.rect.x + view.rect.width) > (toolbarX + $.toolbar.rect.width)){
    $.toolbar.scrollTo(((view.rect.x + view.rect.width) - $.toolbar.rect.width) + 10, 0);
}else if(view.rect.x < toolbarX){
    $.toolbar.scrollTo(view.rect.x - 10, 0);
}

$.toolbar -> ScrollView

view -> tab

This photo explain my problem:

enter image description here

I've seen this JIRA ticket on Internet https://jira.appcelerator.org/browse/TIMOB-17954

This will be the problem??

EDIT

This problem is caused by the new unit system on Appcelerator.

I have this line on my tiapp.xml

<property name="ti.ui.defaultunit" type="string">dp</property>

but other functions on Titanium return their values on px, so that's a problem.

My question now is:

  • What units return the event listeners like 'scroll'?? (px or dp) Because my toolbarX = e.x from scroll event
  • What units need scrollTo(x,y)????

Solution

  • THE SOLUTION:

    if(Alloy.Globals.isAndroid){
                var measure = require('alloy/measurement');
    
                //Vemos si tenemos que mover la toolbar
                if((view.rect.x + view.rect.width) > (toolbarX + $.toolbar.rect.width)){
                    $.toolbar.scrollTo(((measure.dpToPX(view.rect.x) + measure.dpToPX(view.rect.width)) - measure.dpToPX($.toolbar.rect.width)) + 10, 0);
                }else if(view.rect.x < toolbarX){
                    $.toolbar.scrollTo(measure.dpToPX(view.rect.x) - 10, 0);
                }
            }else{
                //Vemos si tenemos que mover la toolbar
                if((view.rect.x + view.rect.width) > (toolbarX + $.toolbar.rect.width)){
                    $.toolbar.scrollTo(((view.rect.x + view.rect.width) - $.toolbar.rect.width) + 10, 0);
                }else if(view.rect.x < toolbarX){
                    $.toolbar.scrollTo(view.rect.x - 10, 0);
                }
            }
        }
    
    $.toolbar.addEventListener('scroll', function(e){
    
        Ti.API.info("-- toolbarX: " + e.x + " / " + Alloy.Globals.measure.pxToDP(e.x));
    
        if(Alloy.Globals.isAndroid){
            toolbarX = Alloy.Globals.measure.pxToDP(e.x);
        }else{
            toolbarX = e.x;
        }
    });
    

    This problem is new because that:

    <property name="ti.ui.defaultunit" type="string">dp</property>
    

    Now, you have to GUESS in what units (px or dp) you have to pass the values on Android, because some functions return px and need px and the others dp.