CODEWITHSUNDEEP
csssencha-touch
FreeJ
FreeJ

Reputation: 276

Sencha Touch 2 & webkit-overflow-scrolling: touch

Has anyone had any luck with working out a solution to get -webkit-overflow-scrolling: touch to work in Sencha Touch 2?

Although the performance is quite good on iPhones, Sencha's scroller is still too choppy on Android Phones. Meanwhile the CSS3 Solution would seem to be the choice to go for now on Android.

Anyone any luck?

Upvotes: 1

Views: 1870

Answers (2)

tarikakyol
tarikakyol

Reputation: 591

To apply native style scrolling to a panel given as;

Ext.create('Ext.Panel', {
        style: 'overflow-y:scroll;-webkit-overflow-scrolling:touch;',
        id: 'scroll-panel',
        items:[...]
});

overwrite touch move event to prevent Sencha Touch to control over scrolling on that panel

    var scrollPanelDom = Ext.get("scroll-panel").dom;
    scrollPanelDom.addEventListener("touchmove", function(e){
        e.stopPropagation();
    }, false);

so you can get rid of choppy scrolling and have it native style instead on IOS devices (and according to my tests better scrolling experience on Android devices)

Upvotes: 4

ilija139
ilija139

Reputation: 2974

At the moment, -webkit-overflow-scrolling is exclusive to Mobile Safari on iOS 5 and later. So no Android anyway.

Upvotes: 0

Related Questions