Software Archive
Read-only legacy content
Announcements
FPGA community forums and blogs on community.intel.com are migrating to the new Altera Community and are read-only. For urgent support needs during this transition, please visit the FPGA Design Resources page or contact an Altera Authorized Distributor.
17060 Discussions

Splashscreen not showing on iOS

David_K_6
Beginner
1,349 Views

I have created a couple of splashscreen PNG files and added them to the appropriate place in the projects tab.

The splashscreen plugin is safely installed. 

But my splashscreen isn't showing: when I deploy the project to a real iPhone 6, my launch icons are showing correctly, but the splashscreen shown is the standard Cordova graphic, not the graphic I uploaded.

I assume there's some configuration option somewhere that I haven't set - any ideas?

Here is the resulting intelxdk.config.ios.xml

<?xml version='1.0' encoding='UTF-8'?>
<widget xmlns="http://www.w3.org/ns/widgets" xmlns:intelxdk="http://xdk.intel.com/ns/v1" id="com.bachtrack.mbtk" version="0.0.1" ios-CFBundleVersion="0.0.1">
<!--This file is generated by the Intel XDK. Do not edit this file as your edits will be lost.           -->
<!--To change the contents of this file, see the documentation on the intelxdk.config.additions.xml file.-->
<intelxdk:version value="1.0"/>
<intelxdk:cordova-cli version="4.1.2"/>
<name>mbtk</name>
<description>Test run for My Bachtrack</description>
<author>Bachtrack Ltd</author>
<content src="index.html"/>
<access origin="*"/>
<icon platform="ios" src="launch/Bachtrack logo 180x180.png" width="180" height="180"/>
<icon platform="ios" src="launch/Bachtrack logo 120x120.png" width="120" height="120"/>
<icon platform="ios" src="launch/Bachtrack logo 60x60.png" width="60" height="60"/>
<icon platform="ios" src="launch/Bachtrack logo 152x152.png" width="152" height="152"/>
<icon platform="ios" src="launch/Bachtrack logo 76x76.png" width="76" height="76"/>
<splash platform="ios" src="launch/Splash 640x960.png" width="640" height="960" orientation="portrait"/>
<splash platform="ios" src="launch/Splash 320x480.png" width="320" height="480" orientation="portrait"/>
<intelxdk:plugin intelxdk:name="Device" intelxdk:value="org.apache.cordova.device" intelxdk:version="0.2.13" intelxdk:checksum="87180a02" intelxdk:type="file"/>
<intelxdk:plugin intelxdk:name="Splashscreen" intelxdk:value="org.apache.cordova.splashscreen" intelxdk:version="0.3.5" intelxdk:checksum="16b3d7e3" intelxdk:type="file"/>
<intelxdk:plugin intelxdk:name="Calendar" intelxdk:value="nl.x-services.plugins.calendar" intelxdk:version="4.3.4" intelxdk:checksum="458a86a7" intelxdk:type="file"/>
<intelxdk:plugin intelxdk:name="Globalization" intelxdk:value="org.apache.cordova.globalization" intelxdk:version="0.3.3" intelxdk:checksum="748f62a1" intelxdk:type="file"/>
<intelxdk:plugin intelxdk:name="StatusBar" intelxdk:value="org.apache.cordova.statusbar" intelxdk:version="0.1.9" intelxdk:checksum="4df73e02" intelxdk:type="file"/>
<preference name="ios-target" value="6"/>
<preference name="ios-configuration" value="adhoc"/>
<intelxdk:provisioning intelxdk:src="profileDevWildcardXDK.mobileprovision" intelxdk:type="adhoc"/>
<!--creationInfo:{"src":"https://appcenter.html5tools-software.intel.com/api/v2.0/redirect/projectrenderers/release-2015-ww32/jsapp/templates-blank-cordova-project/sample.zip","projectTypeName":"com.intel.xdk.projecttype.jsapp"}-->
<preference name="debuggable" value="false"/></widget>

And here is the code in app.js, unmodified from the sample code:

    // Using a splash screen is optional. This function will not fail if none is present.
    // This is also a simple study in the art of multi-platform device API detection.
    this.hideSplashScreen = function() {
        "use strict" ;
        var fName = "App.hideSplashScreen():" ;
        plib.consoleLog(fName, "entry") ;

        // see https://github.com/01org/appframework/blob/master/documentation/detail/%24.ui.launch.md
        // Do the following if you disabled App Framework autolaunch (in index.html, for example)
        // $.ui.launch() ;

        if( navigator.splashscreen && navigator.splashscreen.hide ) {   // Cordova API detected
            navigator.splashscreen.hide() ;
        }
        if( window.intel && intel.xdk && intel.xdk.device ) {           // Intel XDK device API detected, but...
            if( intel.xdk.device.hideSplashScreen )                     // ...hideSplashScreen() is inside the base plugin
                intel.xdk.device.hideSplashScreen() ;
        }

        plib.consoleLog(fName, "exit") ;
    };

 

0 Kudos
3 Replies
PaulF_IntelCorp
Employee
1,349 Views

See the hello-cordova sample and the intelxdk.config.additions.xml file. In particular, the

    <preference name="AutoHideSplashScreen" value="false" />

line... Don't recall if this needs to be true or false, but I think that's the key...

0 Kudos
David_K_6
Beginner
1,349 Views

Paul: so far, this hasn't helped. I made sure that my project is configured exactly the way it is in the Hello, Cordova sample, and ran it up: the splash screen works just fine on an Android phone, but not on the iPhone.

Next thing to check is whether it works in the Hello, Cordova sample in the first place - since the sample doesn't specify any splash screen files. So I added some splashscreen files there using the XDK GUI. This gives exactly the same result as my own project: I see the default Cordova splashscreen image.

Any other ideas definitely welcome...

0 Kudos
David_K_6
Beginner
1,349 Views

OK, I got there, by process of downloading the .ipa and inspecting it to see what configuration Cordova created. This one is self-inflicted but fairly obscure.

What's happening is that if you don't specify a resolution, Cordova is filling in its own default image. Therefore, for your app to show a splashscreen reliably, you must provide one for all 11 resolutions.

What's happening is that I had "Display zoom" set on my iPhone 6. This meant that the screen resolution being used was the "Rendered pixels" size of 640x1136, not the "Physical pixels" size of 750x1334. As a result, nothing I did with the 750x1344 image (or the smaller "default iPhone" sizes) had any effect whatsoever.

 

0 Kudos
Reply