3

I am using PhoneGap for creating iOS application for iOS9+. As per guide line I have added following code in Config.xml to set the splash screen.

// set the cordova plugin 
 <plugin name="cordova-plugin-splashscreen" source="npm" spec="&gt;1.0.0" />

 // set splash screen for iPad only
 <platform name="ios">
    <gap:splash gap:platform="ios" height="2048" src="res/screen/ios/Default-Portrait@2x~ipad.png" width="1536" />
    <gap:splash gap:platform="ios" height="2048" src="res/screen/ios/Default-Portrait@2x~ipad.png" width="1536" />
    <gap:splash gap:platform="ios" height="768" src="res/screen/ios/Default-Landscape~ipad.png" width="1024" />
    <gap:splash gap:platform="ios" height="1536" src="res/screen/ios/Default-Landscape@2x~ipad.png" width="2048" />
</platform>

Then I used following command in 'Terminal' to generate iOS platform

phonegap build ios --device

It copies all the splash images in iOS platform.

But it show default Phonegap splash screens image when I launch the app. I checked in iOS project 'Images.xcassets'-> 'LaunchImage, it is showing default PhoneGap images. It is not showing splash Image which I mentioned in Config.xml file. How do I set the splash images using config.xml for iOS?

Sanoj Kashyap
  • 5,020
  • 4
  • 49
  • 75
RohitK
  • 1,444
  • 1
  • 14
  • 37
  • Show or hide the Splash Screen using ngCordova plugin `$cordovaSplashscreen` – Mable John Dec 02 '16 at 05:09
  • Check this http://ngcordova.com/docs/plugins/splashscreen/ – Mable John Dec 02 '16 at 05:09
  • check this too https://cordova.apache.org/docs/en/latest/reference/cordova-plugin-splashscreen/ – Mable John Dec 02 '16 at 05:12
  • I have checked link https://cordova.apache.org/docs/en/latest/reference/cordova-plugin-splashscreen/ , I tried both ways i.e. 'Legacy launch images' and 'Launch storyboard images' as mentioned in doc, still it is showing default Phonegap splash screen. – RohitK Dec 02 '16 at 05:30

2 Answers2

5

First add the Splash screen plugin

cordova plugin add cordova-plugin-splashscreen

Then in config.xml add these lines.

<!-- iOS splash screen -->
<!-- iPad -->
<splash src="www/res/screen/ios/Default-Portrait.png" platform="ios" width="768" height="1024" />
<splash src="www/res/screen/ios/Default-Landscape.png" platform="ios" width="1024" height="768" />
<!-- Retina iPad -->
<splash src="www/res/screen/ios/Default-Portrait@2x.png" platform="ios" width="1536" height="2048" />
<splash src="www/res/screen/ios/Default-Landscape@2x.png" platform="ios" width="2048" height="1536" />

<!-- Default splash screen -->
<splash src="splash.png" />

Make sure of the image width and height should be same as it is defined in config.xml.

or try default splashscreen.

Just keep full size splash screen image where your config.xml is located it will copy the splash.png file for all platform it is not recommended this will increase the app size but you can check if that works.

Cheers.

Anuj.T
  • 1,598
  • 16
  • 31
  • I have already installed 'cordova-plugin-splashscreen' plugin in project. Also I have crosschecked the image size, it is correct as expected. Still showing the default phonegap splash screen image – RohitK Dec 02 '16 at 06:10
  • write the lines exactly i have written in the config.xml and then try it. – Anuj.T Dec 02 '16 at 06:12
  • I am developing application for iPad only. Can you please provide me detail for iPad? – RohitK Dec 02 '16 at 06:17
  • solution works for me, but need to remove the iOS platform first using command 'phonegap platform remove ios' and then add it using command 'phoengap build ios --device' – RohitK Dec 02 '16 at 10:45
0

You need to change/replace the image files in splash screen directory (www/res/screen/ios/). By default it contains images of phone gap

Anvesh Tokala
  • 403
  • 4
  • 12