On a template page is a button that activates the camera for scanning qrcodes. To ensure the camera is always in view, I jump the view to the top of the page and disable scrolling on the page. Not doing this frequently causes view to open off screen and often the user thinks the app is broken because out of view all they see is a white page. So in the function that activates the camera view, I add:
$ionicScrollDelegate.scrollTop() ;
$ionicScrollDelegate.freezeAllScrolls(true) ;
When the camera view is closed, I reactivate scrolling again with:
$ionicScrollDelegate.freezeAllScrolls(false) ;
All this works.
Also on the same page, I have a street address that if the user taps/clicks, will jump to a static map lower on the page. I am scrolling to a specific location on the same page using:
$scope.scrollTo = function(id){
$location.hash(id);
$ionicScrollDelegate.anchorScroll(true);
}
It works, however, once scrolled to that position, the page won’t scroll back up. It gets stuck at that jump point. To fix this, I must add overflow-scroll='true'
to my <ion-content>
tag. This allows the user to scroll back up past the jump point.
This works.
BUT…adding overflow-scroll="true"
then overrides the code for the camera - with overflow-scroll enabled then the freezeAllScrolls(true)
no longer works and the user can accidentally scroll the view off the page. The scrollToTop still works (which is good), but page scrolling is still enabled at that point (which is bad).
How can I resolve this?