I have scrollable content on every slide of an ionic slide.
Everything worked fine, great, when I upgraded my Galaxy S5 from 4.4.2 to 4.4.4 this morning. Now UX is an absolute nightmare. Scrolling content inside slides is very difficult to work with. The lateral movement sensitivity is super super high and prevents vertical scrolling if absolutely absolutely vertical.
Holding gestures are also very difficult to use (again, due to the sensitivity of the wipes to the side).
I noticed this on my wife Nexus 5 (which always worked 4.4.4).
I need to find a solution to this ASAP, since my Galaxy S5 is my main demo device, and now it's a shared trip.
I recently upgraded to Ionic beta13, no change. As with the full UX application, embarrassment is to survive in the wild.
I also uninstalled the Chrome update that came with Android 4.4.4 (37-> 35), in the hope that the WebView would be downgraded to the previous version, no luck.
I am wondering if there is anything specific in my HTML setup or what else I can provide to deal with this problem. I am surprised that I have not seen more action on this issue, because it makes my previously smooth application completely useless. It makes me think this is an isolated problem, but I don’t know where to start.
An attached HTML template where this happens to me. Any thoughts were greatly appreciated.
<ion-view title="LOVE."> <ion-nav-buttons side="left"> <button ng-if="activeSearchSlide == 2" class="button no-animation button-icon icon ion-ios7-arrow-back" style="-webkit-user-select: none; -webkit-user-drag: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);" ng-click="clearSearch()"> </button> </ion-nav-buttons> <ion-nav-buttons side="right"> <button class="button no-animation button-icon icon ion-ios7-gear" style="-webkit-user-select: none; -webkit-user-drag: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); float: left;" on-tap="gotoSettings()" on-hold="holdMe()"> </button> <button class="button no-animation button-icon icon ion-ios7-paperplane" style="-webkit-user-select: none; -webkit-user-drag: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);" on-tap="sendFeedback()" on-hold="holdMe()"> </button> </ion-nav-buttons> <ion-content has-header="true" > <ion-slide-box does-continue="false" auto-play="false" active-slide="activeSearchSlide" on-slide-changed="slideChanged(index)"> <ion-slide> <div> <label class="tagLabel" on-tap="clickTag()" on-hold="tagMenu($index, tag)" ng-repeat="tag in templates.categories track by $index" style="{{tag.checked | myTagStyle}}"> <p>{{tag.name}}<span ng-show="!tag.active">*</span><span class="searchCount">{{tag.bundleCount}}</span></p> </label> <form ng-submit="addTag(newTagText)"> <div> <div style="border-left: none; border-top: none; border-bottom: none; border-right: 40px solid #f8f8f8"> <input type="text" id="inputText" ng-model="newTagText" placeholder="new tag category..."> </div> </div> </form> </div> <br/> <br/> <br/> <br/> </ion-slide> <ion-slide> <div ng-if="!somethingSelected" > <br/> <br/> <br/> <br/> <br/> <br/> <p style="font-size:45pt;color:#DDD;"> ??? </p> </div> <div> <div ng-repeat="tag in templates.categories track by $index" ng-show="tag.checked" class="check-element animate-show" > <label class="tagLabel" on-tap="clickTag()" on-hold="tagMenu($index, tag)" style="{{tag.checked | myTagStyle}}"> <p>{{tag.name}}<span ng-show="!tag.active">*</span><span class="searchCount">{{tag.bundleCount}}</span></p> </label> <label class="tagLabel" on-tap="clickSubTag($parent)" on-hold="subTagMenu($index, item)" ng-repeat="item in tag.items track by $index" style="{{item.checked | myTagletStyle}}" > <p><span style='display:inline-block;'> </span>{{item.name}}<span ng-show="!item.active">*</span><span class="searchCount">{{item.bundleCount}}</span></p> </label> <form ng-submit="addSubTag()"> <div> <div> <input type="text" class="subtagTextInput" id="inputText" placeholder="new {{tag.name}} taglet..." ng-model="inputText"> </div> </div> </form> <br/> </div> </div> <br/> <br/> <br/> <br/> </ion-slide> <ion-slide style="padding-left: 3px; padding-right: 3px;"> <h1>{{searchString}}</h1> <div ng-repeat="bundle in searchResults track by $index | orderBy:attributes.timestamp:reverse"> <div on-tap="viewBundle($index)" on-hold="openBundleModal($index, bundle)" style="background-image: url('{{bundle.firstThumb}}');" class="item {{bundle.attributes.tagged | paintUntagged}}"> <div class="bundleCount"><p>{{bundle.URLcount}}</p></div> </div> </div> </ion-slide> </ion-slide-box> </ion-content> <div> <button ng-if="locked && overLimit && onSearchPage" class="button button-energized inAppPurchase" ng-click="unlockApp()">{{searchLimit}}/{{totalBundles}}</button> </div>