Android webview blackscreen

[madson_g_]

I cannot find a way to remove the black screen (with the app´s name at the top) displayed just before the splashscreen appears in android webview (with or without crosswalk).

Is there a solution for that?

[PaulF_IntelCorp]

I've never seen that happen in any app I've put on a device. I suspect it has something to do with one of your plugins. Some plugins can take a long time to initialize, which can cause a delay before the splashscreen plugin is able to publish your splashscreen, especially if that problem plugin is trying to init something over a network connection. I would try an experiment where you remove plugins, one-by-one, and test to see which one might be causing such a delay.

[madson_g_]

Paul F. (Intel) wrote:

I've never seen that happen in any app I've put on a device. I suspect it has something to do with one of your plugins. Some plugins can take a long time to initialize, which can cause a delay before the splashscreen plugin is able to publish your splashscreen, especially if that problem plugin is trying to init something over a network connection. I would try an experiment where you remove plugins, one-by-one, and test to see which one might be causing such a delay.

I don't think so. I have built with only the standard plugings added when you create a new project in xdk. It seems to be the android webview "container" waiting for the splash screen to start as some posts in the web say. And its color could be changed to be more like the app theme.

I don't know how to make this works. It should be done in android.xml file? The changes I make in config.xml don't take effect. The file goes back to the original code after creating the package.

[PaulF_IntelCorp]

Sorry, but I've never seen what you are describing. Perhaps you have a very slow phone with limited memory? Can you provide an image that shows what you mean? Preferably, a movie that shows what's happening and how long this lasts.

It might be related to the instructions here > https://github.com/gomobile/sample-hello-cordova/blob/master/intelxdk.config.additions.xml#L75 <

Otherwise, it would help if you provided the details regarding the instructions you are trying to implement in the config.xml file.

[madson_g_]

Paul F. (Intel) wrote:

Sorry, but I've never seen what you are describing. Perhaps you have a very slow phone with limited memory? Can you provide an image that shows what you mean? Preferably, a movie that shows what's happening and how long this lasts.

It might be related to the instructions here > https://github.com/gomobile/sample-hello-cordova/blob/master/intelxdk.co... <

Otherwise, it would help if you provided the details regarding the instructions you are trying to implement in the config.xml file.

My phone is good.

This questions is one of the examples I have found to fix it but nothing has worked. https://stackoverflow.com/questions/36955355/cordova-app-displays-a-black-screen-before-splash-screen-displays

Maybe I should add not only in config.xml but in intelxdk.config.android.xml and in intelxdk.config.ios.xml to take effect?!

This image illustrates what is happening. After that the splashscreen is displayed.

[PaulF_IntelCorp]

Those solutions all point to increasing the time of the Cordova splashscreen image. I wonder if you are referring to a different splashscreen. Some people have a web splashscreen they throw up for their app. That web splashscreen will not show as soon as the app starts, it will not show until the Cordova framework and plugins have initialized. the Cordova splashscreen plugin is special, it inserts a splashscreen into a native view as soon as it can (during the Cordova framework init sequence). This action precedes the readiness of the webview in which your Cordova app runs.

My suspicion is you are not actually using the Cordova splashscreen but have your own HTML5-based web splashscreen.

Can you share an example project with me that illustrates this problem? I can confirm if this is what is going on. Create a sample app that does what you claim and ZIP the ENTIRE project folder and attach it to a post using the "attach files to post" button below the forum post edit window. Make sure that your sample app does this by building it and installing it on your test device before you sent it to me, and please ZIP the ENTIRE project folder.

[madson_g_]

I created a new project in XDK to test it. So I didn´t do any changes in any code. Just added png´s images according to their sizes in Launch Icons and Splash Screens tab.

After uploading to build.phonegap.com and downloaded the apk, the same thing happened to this new project. And my phone is ok. It´s a Moto G2.

[PaulF_IntelCorp]

Paul F. (Intel) wrote:

...Create a sample app that does what you claim and ZIP the ENTIRE project folder and attach it to a post using the "attach files to post" button below the forum post edit window. Make sure that your sample app does this by building it and installing it on your test device before you sent it to me, and please ZIP the ENTIRE project folder.

[madson_g_]

Ok, File attached.

[PaulF_IntelCorp · Accepted solution]

This is something that is being added by PhoneGap Build, probably as part of the template project they are assembling before they populate it with your project files. When I performed the build with Cordova CLI I did not see this.

I've attached three builds that you can install on your test machine to see the differences. The only changes I made to the two modified projects was to the name (TesteWebCLI and TesteWebv2) and to the App ID (xdk.intel.template.cli and xdk.intel.template.v2), so you can install all three on your phone at the same time. Otherwise, all three are identical, they were all built with CLI 6.5 using identical plugins and source code.

PhoneGap Build did make reference to some changes in their build system for their 7.0 release > https://blog.phonegap.com/phonegap-7-0-1-now-on-build-and-it-includes-some-important-changes-89087fe465f5 < which talks about using the default Cordova templates when constructing the build project. So by adding the following line into the config.xml file (which you can add into your intelxdk.config.additions.xml file):

<preference name='pgb-builder-version' value='2' />

I was able to make the PGB splash behave like the CLI splash. I've attached the three resulting APKs in a ZIP so you can try them yourself.

[madson_g_]

I agree. Before I read your answer I built the apk with CLI in my desktop. It worked fine too. But it was not a xdk project. So, assuming I want to build with PGB I´ll have to add 

<preference name='pgb-builder-version' value='2' /> 

everytime right?! Even to iOS? I have made no test yet with iOS.

[PaulF_IntelCorp]

Adobe does not provide details regarding their iOS builds and how, if at all, they change with their CLI 7.x release. If you include that line it will be provided to all builders, unless you encapsulate it in a platform-specific tag. For more information on that change you really need to talk to Adobe, we are not privy to the details of their systems.
 

[madson_g_]

I´m working with Ionic Creator projects, I am copying and pasting the whole ionic www folder over xdk new project www folder so it replaces app.js.  Is there a special method to integrate it with a XDK project?

[PaulF_IntelCorp]

Ionic normally also includes a complete Cordova CLI installation. You might want to just use that for your build process. However, if you are using the XDK for things like the Simulate tab and to manage your build settings (and then export a buildable ZIP), and prefer to build using PhoneGap Build, then that process should work. In that case, be sure to manually add the plugins you are using in your Ionics project via the Plugin Management tool. You might also do a quick compare of their config.xml file with the one generated by the XDK to be sure everything is captured in the XDK generated config.xml file. If they are adding any special config.xml directives you should be able to add them to your intelxdk.config.additions.xml file.