Ionic 2 shows me white screen in android 4.2 devices - android

I was just curious on how can I run my Ionic 2 project on Android Jellybean devices well. The application runs well in KitKat to Nougat OS devices but in Jellybean, It only shows white screen. Is there any way I can make my Ionic 2 project be compatible in Android 4.2 (Jellybean) devices? Thank you in advance.

You can use Crosswalk
Why should I use Crosswalk?
Older versions of Android devices (4.0-4.3) use Android’s default
browser, which has significantly less performance and standards
compliance than modern Chrome. Using Crosswalk gives you a specific
and more performant version of Chrome to use on all Android devices,
in order to reduce fluctuations and fragmentation among devices.
How does Crosswalk improve Cordova Android apps?
By designating a specific version of Chrome, you can skip the
unexpected behavior from browsers that vary from device to device.
Crosswalk also provides improved performance and ease of debugging.
What can I expect, performance and size-wise?
In older Android Devices (4.0-4.3), you’ll see about a 10x improvement
of both HTML/CSS rendering and JavaScript performance and CSS
correctness. To bundle Chrome, you will see a small (~10-15MB) size
increase in your Android Apps.
More about Crosswalk https://github.com/crosswalk-project/cordova-plugin-crosswalk-webview

Related

Minimum hardware and software requirements to run mobile apps built with React Native

I am looking to source some testing Android and iOS devices for React Native apps. I've looked at the official docs, but there isn't a specific section for it.
I don't think there is a set of 'minimum requirements' per se. React-native applications should work on most modern smartphones, and even some very old ones.
The caveat I would raise here is that it's more about how the app is written, there are many things you can do inside react-native that will kill performance on older devices, such as avoiding unnecessary UI element frame updates. (This can happen if you are hooking into the state changes non optimally)
I suggest having a look at some common anti-patterns when it comes to RN, a good place to start would be here: https://facebook.github.io/react-native/docs/performance (this page goes over common reasons why apps will be performing slowly.)
For your scenario there is no any official smart devices which are recommended to use to test React Native applications.
You can use any of smart devices of both Android and iOS to test your applications.
For testing your applications on Android :
Android 4.1 (API 16) or newer. ( You can find minSDKVersion from android studio app gradle file)
So you can run your application any smart device on or above Android OS 4.1
For testing your applications on iOS :
iOS 9.0 or newer ( You can find Target min OS version from Deployment Info on XCODE )
So you can run your application any smart device on or above iOS 9.0
Note :
My solution is to find devices with different screen sizes.
If you are going to test iOS application try to use different screen sizes and different os Apple devices like -> iPhone SE , iPhone 6s , iPhone 8 Plus , iPhone X
For iPhones try to test both notch devices and normal old devices because you need to avoid notch issues with height and width.
For Android try to use different android os running devices which have different screen sizes with different brands.
As example try to use both low end budget and high end flagship models.
You can find requirements from official git repo here

From an Android app development perspective, what's the difference between enabling support for Samsung DeX and Chrome OS?

Per Samsung DeX's technical documentation, it uses standard Android APIs, which makes supporting it theoretically seamless. Does Chrome OS use the same APIs? What's the difference in difficulty and complexity of developing an Android app that supports one as opposed to the other?
Per Samsung DeX's technical documentation, it uses standard Android APIs, which makes supporting it theoretically seamless.
I would phrase it more as that they support the standard Android 8.0+ freeform multiwindow implementation.
Does Chrome OS use the same APIs?
Chrome OS uses freeform multiwindow as well, though they backported it to work on Android 7.1 (which is what Chrome OS is using for Android as of when I am writing this).
What's the difference in difficulty and complexity of developing an Android app that supports one as opposed to the other?
In terms of window management, they will be fairly similar.
In terms of Android basics, they will be fairly similar.
However, both have their own distinct differences from stock Android (and each other). For example, with DeX, devices move in and out of DeX mode — a Chrome OS device is always a Chrome OS device. Right now, DeX devices are phones and tablets, possibly using an accessory to enable DeX mode and allow for connecting keyboards, mice, and monitors — Chrome OS runs on notebook/netbook and desktop ("Chromebox") form factors, as well as tablets. And so on.

Is there a minimum Android version for supporting inappbrowser?

Our Phonegap app using inappbrowser works really well on every device tested except one using Android version 4.3 where the CSS seems unresponsive and the onscreen keyboard doesn't pop up when you tap in text fields. I can't seem to find any documentation on minimum versions of Android for supporting the various Phonegap plugins.
From my experience, I've used phonegap a far as Android 2.1 . The problem you could have on such older versions is the phonegap version.
You should provide further information such as phonegap version.
But I can assure you that Android 4.3 has a very broad support for all Phonegap/Cordova 5+ plugins.
If I were you I wolud try updating phonegap version according to your desire of minimum Android version you want your app to be executed on.
For example, until Android 2.3 on inappbrowser apps it wasn't able to use overflow scroll, so you had to use an external plugin to get that effect, which was really annoying.
Hope this helps.
Without any code it's hard to diagnose, but it might be a browser issue: Android 4.3 does not necessarily ship with Chrome, so it might be still running the old "Android Browser", which does not support all (CSS-)features Chrome supports. Caniuse helps to find out if a browser supports a certain feature.
If it's indeed a browser issue and you have to support older browsers like the Android Browser, you might want to check out Crosswalk. It provides a recent version of Chrome as a WebView and as InAppBrowser with consistent behaviour on all Android 4.x devices. Downside: Your app's size will increase...
If it's not the browser you might need to show us some of your code.

Android browser compatibility and fragmentation

We have an iOS html5-based app. One of the questions that's coming up a lot is if and when we are going to port to Android.
Because it's mostly html5, a port should be relatively easy. However, the HTML looks different on my Moto G than it does on iOS, even though Chrome on my mac does render it correctly. Now, I have some experience with cross-browser html development from back in the netscape/ie6 days, so I can probably figure out what's going on.
What worries me more though, is the fragmentation. If I get it to render correctly on my Android device, how do I know it works correctly devices with an older version of the OS too? On iOS, we simply require iOS6, as most iPhone users upgrade their OS. On Android, this is a lot more difficult, as users don't tend to update (or the manufacturers don't even provide updates).
Do I need to get my hands on a ton of different devices to test on? Any easier ways to test this? I'm new to Android development, so any advice would be greatly appreciated!
This is a common issue across Android Development. Device Fragmentation... our nemesis. What will make it even more difficult, as I have experienced, is that Android ditched the old WebView in favor of a Chromium based WebView in KitKat. So even the APIs are no longer the same from your Moto G to previous devices.
That said, there are a fair amount of resources available in helping assist with creating a Web App that will work with your site and the native device. Quite a few examples too.
I would begin here: https://developer.android.com/guide/webapps/index.html which includes a subsection devoted entirely to the Chromium changes incorporated in KitKat (https://developer.android.com/guide/webapps/migrating.html)
Additionally, there is this Pixel Perfect information site as well: https://developer.chrome.com/multidevice/webview/pixelperfect
Now you can set your minimum accepted and targeted API levels on Android, just as you would on iOS. For instance, if the minimum is 15 and it is targeted for 19, then you are specifying that your app will work for KitKat (4.4) devices, but support as old as Ice Cream Sandwich (4.0.3). There's really no reason to target an API lower than 15 anymore, unless something is very specific business reason to target a device that low. By specific, I mean more distinct than "we want to reach as many as possible."
Finally, there are emulators that you can create through the AVD (Android Virtual Device) manager that can replicate various OS levels and hardware configurations. A very popular emulator company called Genymotion (http://www.genymotion.com/) is also frequently used, however it is not free for commercial use.

Android Worklight App UI Performance Bad vs. Browsers

In our project we are using JQuery Mobile 1.3.1, WL 5.0.6 and Knockout 2.2.1.
The UI performance of the compiled, bundled and installed Worklight App is in pretty much every aspect - slide transitions, page transitions, button click responsiveness, etc. - quite bad on high-end Android Galaxy 3, Galaxy 4 and LG Optimus G phones.
When we tested the Applications straight from the Consumer Version Tomcat Worklight Server using /worklight/apps/services/preview/App/android/1.0/default/App.html the performance in all browsers on all Android phones - Built-In, Chrome, Firefox, Opera was great. Was very comparable to iOS, even better in some cases. Of course you have the load times of the web resources from the server, but once it is loaded it is fast!
We looked for some solutions and only found the proposal of:
<application android:hardwareAccelerated="true" ...>
... but since this should be default from Android API Version 14 we do not expect any real performance increases.
Are there any suggestions how to get a Worklight App to the same performance as the App in the Android browsers?
Known and on our radar...
Please see Ishai's answer in this question: IBM Worklight: UI Performance.
The suggested tweaks to the AndroidManifest.xml file should help in increasing UI performance when using jQuery Mobile in a Hybrid application with the Android environment.

Categories

Resources