I’m trying to build UI where you can change numeric values by dragging up and down. I’m using on-drag-up and on-drag-down directives and everything works as expected except all content in view moves too when I drag the button.
Here is the pen: http://codepen.io/lrolecek/pen/CBlAL
Is it possible to somehow disable scrolling when I start dragging on the button but have it enabled when I start dragging anywhere else?
Documentation is vague as ever. This maybe suggests that it’s possible but I don’t really understand what author meant by “Blocking the scrolling when moving left and right is a good practice. When all the drag events are blocking you disable scrolling on that area.”
Thanks in advance for your suggestions.
To be honest I am not entirely in the know about all of the scrolling mechanics.
However I’ve just been looking at the $ion-scroll part of the Ionic documentation and there is perhaps two possible solutions.
Ion-scroll
The first I could see would be to create a DIV element and have scrolling confined to that box alone as shown in the example on the page.
Or alternatively there is a locking property under the API which could be used to disable scrolling in various directions. However I think that would require some experimenting with to find a solution.
But hope that is a push in the right direction.
As far as I know there is no way to set locking property from code. You can set it only in HTML as a part of the scroll directive. I might be wrong but I can’t find any property of $ionicScrollDelegate that you could set to enable it from code.
Using ion-scroll as a small area with transparent content that you can drag around might work and I’ll try that. It just seems like such a complicated and fragile hack for something that is so common in mobile UIs.
Thanks anyway, much appreciated.
No worries, I hope it works.