I'm working on an iOS app using Phonegap/ Cordova and jQuery Mobile.
I want to be able to refresh the data when the user pulls the page down (rubber band effect). I tried using iScroll 4 but it made scrolling my page slow.
I didn't find a phonegap plugin for this. I thought this was a pretty standard iOS feature so maybe I am missing something? Is there any easy way to listen to the pull down event using phonegap / cordova?
Thanks!
Adding this line into CDVViewController.m (Cordova 2.0 or later) is said to work but I've actually never tried it myself as I'm still using iScroll 4. Give it a shot and let me know how it worked for you.
[webView.scrollView setDecelerationRate:UIScrollViewDecelerationRateNormal];
Likewise, however somewhat irrelevant to this matter, the code snippet below is said to reduce the on click delay from 300 ms which is also something phonegap developers usually want. Neither this nor the line above has been properly tested but perhaps a good way to start off.
[webView.scrollView setDelaysContentTouches:NO];
Related
My vuejs nuxt portfolio(https://gunjankadu.com/)is not opening on ios phones but working flawlessly on all other devices. On IOS devices only a red spinner is shown and nothing more.
What can be done?
A script "tag.js" took time to load, which I have currently disabled but still not working.
I had a look on your application and found out two problems.
First was about regular expressions, It seems Safari doesn’t support look behind yet. One alternative would be to put the / that comes before in a non-captured group, and then extract only the first group (the content after the / and before the #).
/(?:\/)([^#]+)(?=#*)/
And second is about The minimal-ui viewport property that you can find out more here
Look at all your js/vue files especially in store. And see if any variable used is not imported. Nuxt in SPA mode doesn't detect those kind of errors and surprisingly the UI gets stuck on loading only on iOS. Very weird but scratched my brain over it for a day.
Im just working with codeceptjs and using appium driver for testing android application.
Now i have different issues with this framework. Im currently working for a test, where i have to use swipeLeft, but it isnt working, there is nothing happen when that function is calling, also swipe, swipeRight, swipeUp, swipeDown. Has anyone already solved this problem or can i use alternatively a back() function or something?
Use the following syntax to make your code work:
I.executeScript('mobile: swipe', {direction: 'left'});
Have you consider Touch Perform (or Action) ? It is working for me
I have used webdriverio and it seems like Codeceptjs have similarities with their implementations of appium methods for mobile automation.
Are you testing using Android or iOS device?
Have you tried using different method overrides for Swipes?
On my experience, iOS and Android have different Speed and Offset settings you need to adjust the values until you get the swipe action working.
And of course you need to make sure you are selecting the appropriate View/Slider/Element that is scrollable, otherwise swipe will fail.
https://codecept.io/helpers/Appium
in my app I use webview with many local HTML files. When the app is running over Android version 4.4.X or newer, the performance of scroll worsened and the text selection ceased to function properly. Looking for a solution, I saw that to solve this problem the Appcelerator docs recommend to set borderRadius property to a value greater than zero (the problem is associated with rendering on Chromium). Indeed, when I set borderRadius to 1, the scrolling performance is better and the text selection works well, but the quality of text (pixel) worsened and the users are complaining rightly. I'm using Titanium SDK 5.0.2GA and 23 platform API. I tried too using 5.2.2GA and 5.3.1GA but with the same results. I spent many hours to find a solution but without success. Please, someone can help me? I have been desperate. Many thanks in advance.
I found the problem and solution. In tiapp.xml, in the tag manifest, there were parameter android:anyDensity with value to "false". When I changed to "true", the scroll of webviews became very quick. In other hand, I needed to change all app's interface because this change caused change of all UI reference. But, after many hours of adjusts, finally the app is OK. Thanks.
I have a strange situation with a project for iOS.
Its created using browserify and React for Cordova and aimed at iOS.
We have built the project for iOS using Cordova commands without any issues. It runs with no xcode errors or Javascript errors either however none of the JS ui appears on screen. We just get a blank white screen with the system bar at the top. See attached screen shot.
So far we have found out that if you add HTML to the index.html in WWW folder it prints that fine so I assume its the JS.
When we run in a browser it works as well as building for Android.
We have no problems with anything other than iOS (simulator and device build).
hopefully someone can help me out here because I'm stumped. Please let me know what files you need to look at and I'll make them available.
Thanks in advance.
IMAGES
The error screen: http://www.voidapplications.co.uk/errorScreen.png
What we expect to be shown: http://www.voidapplications.co.uk/whatWeExpect.png
If you are using internationalization component that's because you need to use the Intl polyfill:
Intl.js and FT Polyfill Service
Intl.js polyfill was recently added to the Polyfill service, which is developed and maintained by a community of contributors led by a team at the Financial Times. It is available thru cdn.polyfill.io domain, which routes traffic through Fastly, which makes it available with global high availability and superb performance no matter where your users are.
To use the Intl polyfill thru the Polyfill service just add one script tag in your page before you load or parse your own JavaScript:
<script src="https://cdn.polyfill.io/v1/polyfill.min.jsfeatures=Intl.~locale.en"></script>
When specifying the features to use thru the polyfill service, you have to specify what locale, or locales to load along with the Intl polyfill for the page to function, in the example above we are specifying Intl.~locale.en, which means only en, but you could do something like this:
<script src="https://cdn.polyfill.io/v1/polyfill.min.js?features=Intl.~locale.fr,Intl.~locale.pt"></script>
note: the example above will load the polyfill with two locale data set, fr and pt.
This is by far the best option to use the Intl polyfill since it will only load the polyfill code and the corresponding locale data when it is really needed (e.g.: safari will get the code and patch the runtime while chrome will get an empty script tag).
source & other ways to include Intl polyfill: https://github.com/andyearnshaw/Intl.js#getting-started
You can debug the UIWebView in the simulator with Safari http://moduscreate.com/enable-remote-web-inspector-in-ios-6/. You'll probably see a big error message in the console, if not you will have access to the debugger so you can step through and sort it out.
I have had this issue in the past, it turned out to be unsupported javascript features. for example, setting default parameters in the function. I.e:
function test( myvalue=0 ) { /* ... */ };
I had to initialise the value inside the function instead. You could also try removing any ecma script 2016 features you may have implemented.
Trouble shooting this type of issue was painful. I created a minimal version of the smallest part of my product compiled and ran it on ios emulator, added another chunk of the product, rinse and repeat.
Im sure there's a better way to detect these issues, but I do not know it.
I'm writing an angular app, using angular-ui-router to manage states / routing.
On desktop browsers (Chrome / Safari) this is working fine. However, on Mobile Safari on IOS 6 on iPhone 4 (and to a lesser extend on IOS 7 on iPhone 5) changing state, via $state.go, can take anything up to 2 seconds.
I'm using ngTouch, so I don't think that it's the 300ms that the native click event takes to fire. ngClick attributes that don't call $state.go now seem to work pretty much instantaneously.
How can I debug this to find where the time is being spent?
ngTouch doesn't work with the ui-sref directive. We used fastclick.js to handle the click behavior, and removed ngTouch. The issue is that the directives step on each others events, and are in fact incompatible. You can see this by reading the implementation of both directives.
Use console.time to print out in the Mobile Safari Console,
https://developer.chrome.com/devtools/docs/console-api#consoletimelabel
...in association with the ui-router listeners :
$stateChangeStart
$stateChangeSuccess
$viewContentLoading
$viewContentLoaded
/* EXAMPLE - INCREMENT THE TIMER
FOR EACH ONE OF THE LISTENERS, TO DETECT THE BOOTLENECK */
// START TIMING NOW
console.time('state_transition');
/*
http://devin-clark.com/what-you-might-not-know-about-chrome-devtools/
*/
$rootScope.$on('$stateChangeSuccess',
function(event, toState, toParams, fromState, fromParams){
console.timeStamp('state_transition');
});
// STOP TIMER
console.timeEnd('state_transition');
http://www.ng-newsletter.com/posts/angular-ui-router.html
Who knows, maybe for improving ui-router's reactivity on mobile devices, FutureState from UI-router's extras could be something worth to explore :
http://christopherthielen.github.io/ui-router-extras/#/future
...but the only way to be sure is to understand the innards of the mobile browsers and their DOM/JS/GPU's management/computing limitations in respect of desktop browsers.
It could be that ng-animate requires too much of a mobile browser by building the "next" template ahead of its appearance into the viewport. And yet it could be something completely trivial.
Please let us know your progress.