- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
So it seems like I can close the splash screen with
navigator.splashscreen.hide();
But AutoHideSplashScreen needs to be set to false.
I am not really sure where to put this line, but I put this code in intelxdk.config.additions.xml and intelxdk.config/android.xml:
<platform name="android"> <!-- below requires the splash screen plugin --> <!-- docs: https://github.com/apache/cordova-plugin-splashscreen --> <preference name="SplashMaintainAspectRatio" value="true" /> <preference name="AutoHideSplashScreen" value="false" /> </platform>
Is there something I'm missing? It still disappears after a couple seconds.
Also for some reason the splash screen started showing a spinning loading animation on top, is there a way to get rid of that?
- Tags:
- HTML5
- Intel® XDK
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
Make sure you have added the splash screen plugin to your project and using plugin version 3.2.0.
I tried with CLI version 5.4.1 and splashscreen plugin version 3.2.0, it worked. The plugin had an issue with older version of plugin, here is release notes for splashscreen plugin, it was fixed in 3.2.0: https://github.com/apache/cordova-plugin-splashscreen/blob/master/RELEASENOTES.md
To remove the spinner, add this:
<preference name="ShowSplashScreenSpinner" value="false"/>
You only need to add this to intelxdk.config.additions.xml file:
<platform name="android"> <!-- below requires the splash screen plugin --> <!-- docs: https://github.com/apache/cordova-plugin-splashscreen --> <preference name="SplashMaintainAspectRatio" value="true" /> <preference name="AutoHideSplashScreen" value="false" /> <preference name="ShowSplashScreenSpinner" value="false"/> </platform>
Link Copied
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
Make sure you have added the splash screen plugin to your project and using plugin version 3.2.0.
I tried with CLI version 5.4.1 and splashscreen plugin version 3.2.0, it worked. The plugin had an issue with older version of plugin, here is release notes for splashscreen plugin, it was fixed in 3.2.0: https://github.com/apache/cordova-plugin-splashscreen/blob/master/RELEASENOTES.md
To remove the spinner, add this:
<preference name="ShowSplashScreenSpinner" value="false"/>
You only need to add this to intelxdk.config.additions.xml file:
<platform name="android"> <!-- below requires the splash screen plugin --> <!-- docs: https://github.com/apache/cordova-plugin-splashscreen --> <preference name="SplashMaintainAspectRatio" value="true" /> <preference name="AutoHideSplashScreen" value="false" /> <preference name="ShowSplashScreenSpinner" value="false"/> </platform>
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
I was using the correct version of the plugin. I tested it out with a new project and it worked. I finally realized it was because I had left this:
if( navigator.splashscreen && navigator.splashscreen.hide ) { // Cordova API detected navigator.splashscreen.hide() ; }
In the onAppReady() function. It's working fine now. The spinner is gone now too.
Thanks for all your help.
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
So my splash screen is staying longer now, but I think it introduced a new issue.
While the splash screen is up, the status bar is shown. I initialize my game by resizing it to the window height, but this happens before I close the splash screen. So my game is starting at a size of the fullscreenheight - statusbarheight (which happens to be 30 pixels on my phone).
Is there a way to display the status bar in full screen mode? Or some other way to overcome this issue?
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
You can add statusbar Cordova plugin and play with these preferences:
<preference name="StatusBarOverlaysWebView" value="false" />
<preference name="StatusBarBackgroundColor" value="#000000" />
<preference name="StatusBarStyle" value="lightcontent" />
this should be added in intelxdk.config.additions.xml file.
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
Still not having any luck. Also I looked up the status bar page and it looks like those three lines are only for ios, I'm testing on android at the moment.
There is also a hiding at startup section, but it says you need to edit the Info.plist file, and it sounds like you can't do that within XDK.
Here a more detailed write up of my issue:
When the game loads while the splash screen is up, it calculates the height without including the area the statusbar is covering. This makes the end result shorter than it should be. I made a demo which resizes the canvas to the screen size and draws a red border around it. It also alerts the window.innerHeight.
When launching from Intel App Viewer (which doesn't include a splash screen):
alert message, loaded game window
When launching the app which was built and installed (has the splash screen):
alert message, loaded game window
You can see in the second one it's 30 pixels shorter.
App.js
function onAppReady() { if( navigator.splashscreen && navigator.splashscreen.hide ) { // Cordova API detected alert(window.innerHeight) //get resolution dpi = window.devicePixelRatio || 1; windowWidth = window.innerWidth * dpi; windowHeight = window.innerHeight * dpi; //identify canvas canvas = document.getElementById('main'); context = canvas.getContext('2d'); //resize canvas to fit zoom canvas.width = windowWidth; canvas.height = windowHeight; //shrink down to correct width with css styles canvas.style.width = (windowWidth / dpi) + 'px'; canvas.style.height = (windowHeight / dpi) + 'px'; //draw border context.beginPath(); context.moveTo(0,0); context.lineTo(0,windowHeight); context.lineTo(windowWidth,windowHeight); context.lineTo(windowWidth,0); context.lineTo(0,0); context.strokeStyle="red"; context.stroke(); setTimeout(function(){ navigator.splashscreen.hide(); }, 5000); } } document.addEventListener("app.Ready", onAppReady, false) ;
intelxdk.config.additions.xml
<preference name="debuggable" value="false" /> <platform name="ios"> <preference name="AutoHideSplashScreen" value="true" /> <preference name="FadeSplashScreen" value="false"/> <preference name="FadeSplashScreenDuration" value="2"/> <preference name="ShowSplashScreenSpinner" value="false"/> <preference name="StatusBarOverlaysWebView" value="false" /> <preference name="StatusBarBackgroundColor" value="#000000" /> <preference name="StatusBarStyle" value="lightcontent" /> </platform> <platform name="android"> <preference name="SplashMaintainAspectRatio" value="true" /> <preference name="AutoHideSplashScreen" value="false" /> <preference name="ShowSplashScreenSpinner" value="false"/> <preference name="SplashScreenDelay" value="100" /> <preference name="StatusBarOverlaysWebView" value="false" /> <preference name="StatusBarBackgroundColor" value="#000000" /> <preference name="StatusBarStyle" value="lightcontent" /> </platform> <intelxdk:crosswalk xwalk-command-line="--disable-pull-to-refresh-effect" /> <intelxdk:crosswalk xwalk-command-line="--ignore-gpu-blacklist" />
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
try: <
preference
name
=
"StatusBarOverlaysWebView"
value
=
"true"
/>
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
Rakshith Krishnappa (Intel) wrote:
try: <preference name="StatusBarOverlaysWebView" value="true" />
Doesn't seem to help, I still get 615 as the window height
- Subscribe to RSS Feed
- Mark Topic as New
- Mark Topic as Read
- Float this Topic for Current User
- Bookmark
- Subscribe
- Printer Friendly Page