sencha-SlideNavigation
sencha-SlideNavigation copied to clipboard
wnielson
Enable slide dragging only on the toolbar
Hello,
I was trying to enable the slide only by dragging the toolbar. I found that I can set the containerSlideDelay to "-1" to disable the dragging from the container and to let the dragging enabled on the toolbar.
This correctly works on Google Chrome, but doesn't work on an Android mobile (Android GingerBread 2.3.5).
Does anyone have an idea to fix this ?
Yes, by default it is set to 'x-toolbar' but all the container is draggable, not only the toolbar.
You have to comment out the following lines of of View.js so it looks like this:
// Create optional drag-on-container functionality
// if (containerSlideDelay > -1) {
// container.element.on({
// drag: function(e, node, opts, eOpts) {
// deltaX = e.absDeltaX;
// deltaY = e.absDeltaY;
//
// // This essentally acts as a vertical 'scroll-lock'. If the user drags more
// // than 10px vertically, we disable horizontal drag all together.
// if (deltaY > 10 && !container.dragAllowed) {
// container.dragAllowedForced = true;
// return false;
// };
//
// // If vertical scroll-lock hasn't been enforced (dragAllowedForced), and
// // deltaX is large enough, enable horizontal dragging
// if (deltaX > containerSlideDelay && !container.dragAllowed && !container.dragAllowedForced) {
// if (!container.dragAllowed) {
// scrollParent = me.container.getActiveItem().down('component[scrollable]');
// if (scrollParent) {
// scrollable = scrollParent.getScrollable();
// scroller = scrollable.getScroller();
// scroller._scrollState = scroller.getDisabled();
//
// console.log(scroller.getDisabled() != false);
//
// if (scroller._scrollState != false) {
// scroller.setDisabled(true);
// scrollable.hideIndicators();
// }
// }
// }
//
// container.dragAllowed = true;
// container.element.fireEvent('dragstart');
// }
// },
// dragend: function() {
// if (container.dragAllowed) {
// // Re-enable scrolling on the child element
// scrollParent = me.container.getActiveItem().down('component[scrollable]');
// if (scrollParent) {
// scrollable = scrollParent.getScrollable();
// scroller = scrollable.getScroller();
// scroller._scrollState = scroller.getDisabled();
//
// if (scroller._scrollState != false) {
// scroller.setDisabled(null);
// scrollable.hideIndicators();
// }
// }
// }
//
// container.dragAllowedForced = false;
// container.dragAllowed = false;
// }
// });
// }
