How do I replace PhoneGap's default splash screen?

0 favourites
  • 6 posts
From the Asset Store
Is a circular loading screen with code ready to use. No Animation.
  • How can I get my own custom splash screens and icons to show up when using PhoneGap? I assumed this was done by editing the config.xml file of an exported C2 project, prior to zipping it for a PhoneGap build, but adding the following code to my config.xml hasn't worked...

       <icon src="icon.png" />
    	<gap:splash src="splash.png" />
    	
    	<!-- iPhone 6 / 6+ -->
    	<icon src="icon-60@3x.png" gap:platform="ios" width="180" height="180" />
    
    	<!-- iPhone / iPod Touch  -->
    	<icon src="icon-60.png" gap:platform="ios" width="60" height="60" />
    	<icon src="icon-60@2x.png" gap:platform="ios" width="120" height="120" />
    
    	<!-- iPad -->
    	<icon src="icon-76.png" gap:platform="ios" width="76" height="76" />
    	<icon src="icon-76@2x.png" gap:platform="ios" width="152" height="152" />
    
    	<!-- Settings Icon -->
    	<icon src="icon-small.png" gap:platform="ios" width="29" height="29" />
    	<icon src="icon-small@2x.png" gap:platform="ios" width="58" height="58" />
    
    	<!-- Spotlight Icon -->
    	<icon src="icon-40.png" gap:platform="ios" width="40" height="40" />
    	<icon src="icon-40@2x.png" gap:platform="ios" width="80" height="80" />
    
    	<!-- iPhone and iPod touch -->
    	<gap:splash src="Default.png" gap:platform="ios" width="320" height="480" />
    	<gap:splash src="Default@2x.png" gap:platform="ios" width="640" height="960" />
    
    	<!-- iPhone 5 / iPod Touch (5th Generation) -->
    	<gap:splash src="Default-568h@2x.png" gap:platform="ios" width="640" height="1136" />
    
    	<!-- iPhone 6 -->
    	<gap:splash src="Default-667h@2x.png" gap:platform="ios" width="750" height="1334" />
    	<gap:splash src="Default-Portrait-736h@3x.png" gap:platform="ios" width="1242" height="2208" />
    	<gap:splash src="Default-Landscape-736h@3x.png" gap:platform="ios" width="2208" height="1242" />
    
    	<!-- iPad -->
    	<gap:splash src="Default-Portrait.png" gap:platform="ios" width="768" height="1024" />
    	<gap:splash src="Default-Landscape.png" gap:platform="ios" width="1024" height="768" />
    
    	<!-- Retina iPad -->
    	<gap:splash src="Default-Portrait@2x.png" gap:platform="ios" width="1536" height="2048" />
    	<gap:splash src="Default-Landscape@2x.png" gap:platform="ios" width="2048" height="1536" />[/code:2s1wzmjn]
    
    I included all iOS 7.0+ icons, iOS 6.1 icons, and all splash screen files (properly named and sized) in the exported C2 project folder prior to zipping it for a PhoneGap build. However, none of my icons or splash screens show up after installing the .ipa file through iTunes and running the app on a test phone. Instead I get PhoneGap's default splash screen and missing icons.
    
    PhoneGap provides some documentation on how to include iOS icons and splash screens here ([url=http://docs.build.phonegap.com/en_US/configuring_icons_and_splash.md.html#Icons%20and%20Splash%20Screens]http://docs.build.phonegap.com/en_US/co ... %20Screens[/url]), but perhaps I'm going about this the wrong way.
  • Hello Incid,

    I (think?) I've asked the same questions just a few days ago.

    It just so turns out that you can look in your ejecta-master > Resources directory and replace the icons in there.

    Hope that is what you are after,

    V

  • Try Construct 3

    Develop games in your browser. Powerful, performant & highly capable.

    Try Now Construct 3 users don't see these ads
  • I'm exporting to PhoneGap, not Ejecta.

    Ejecta doesn't seem to support 64-bit architectures, which Apple will require for all iOS apps in February and going forward. Ejecta's documentation on GitHub claims you can set Architectures in the Project Settings of Xcode to "Standard architectures (including 64-bit)", but doing so breaks the Ejecta build and gives me a huge list of errors. Leaving the Architectures as "ARMv7" removes all errors, but then I get a warning from Apple when validating the project that they are switching to 64-bit architectures in February so I don't want to bother uploading a version of my app that will quickly become non-functional.

    Regardless, non-browser wrappers (Ejecta and CocoonJS) don't offer a performance boost anymore nor do they offer much in the way of feature support. PhoneGap seems to be the way to go for getting C2 games on iOS natively.

    I just haven't figured out how to get the PhoneGap build to recognize all my iOS icons and replace its default splash screen with my own.

  • Did you add the files to your construct 2 project? With names matching those you typed in the config.xm?

    I've just spent the better part of the day figuring out the correct settings to upload a phonegap project and I'll happily share (so that hopefully I'll remember it better).

    I'll paste the contents of my config.xml file below and attatch an image showing the images so that you can see how I've set it up in construct 2.

    Good luck!

    [attachment=0:dmvw0moa][/attachment:dmvw0moa]

    <?xml version="1.0" encoding="UTF-8"?>
    <widget xmlns="http://www.w3.org/ns/widgets" xmlns:gap="http://phonegap.com/ns/1.0" id="se.onemuppet.draw" version="1.0.0">
    
      <name>myDraw</name>
      <description>Drawing</description>
      <author href="http://onemuppet.se/" email="borgenvik.david@gmail.com">David Borgenvik</author>
    
      <preference name="permissions" value="none"/>
      <preference name="android-targetSdkVersion" value="21" />
    
      <feature name="http://api.phonegap.com/1.0/network"/>
    
      <preference name="orientation" value="landscape" />
      <preference name="fullscreen" value="true" />
      <gap:config-file platform="ios" parent="UIStatusBarHidden">
        <true/>
      </gap:config-file>
      <gap:config-file platform="ios" parent="UIViewControllerBasedStatusBarAppearance">
        <false/>
      </gap:config-file>
    
      <preference name="deployment-target" value="8.0" />
      <preference name="android-minSdkVersion" value="14" />
      <preference name="target-device" value="universal" />
    
      <!-- iPhone / iPod Touch  -->
      <icon src="icon-57.png" gap:platform="ios" width="57" height="57" />
      <icon src="icon-60.png" gap:platform="ios" width="60" height="60" />
      <icon src="icon-120.png" gap:platform="ios" width="120" height="120" />
      <icon src="icon-114.png" gap:platform="ios" width="114" height="114" />
    
      <!-- iPad -->
      <icon src="icon-72.png" gap:platform="ios" width="72" height="72" />
      <icon src="icon-144.png" gap:platform="ios" width="144" height="144" />
      <icon src="icon-76.png" gap:platform="ios" width="76" height="76" />
      <icon src="icon-152.png" gap:platform="ios" width="152" height="152" />
    
      <!-- Settings Icon -->
      <icon src="icon-29.png" gap:platform="ios" width="29" height="29" />
      <icon src="icon-58.png" gap:platform="ios" width="58" height="58" />
      <icon src="icon-50.png" gap:platform="ios" width="50" height="50" />
      <icon src="icon-100.png" gap:platform="ios" width="100" height="100" />
    
      <!-- Spotlight Icon -->
      <icon src="icon-40.png" gap:platform="ios" width="40" height="40" />
      <icon src="icon-80.png" gap:platform="ios" width="80" height="80" />
      
      <!-- Optional splash screen image, e.g.: -->
      <gap:splash src="splash480.png" gap:platform="ios" width="480" height="320" />
      <gap:splash src="splash320x480.png" gap:platform="ios" width="320" height="480" />
      
      <gap:splash src="splash960.png" gap:platform="ios" width="960" height="640" />
      <gap:splash src="splash640x960.png" gap:platform="ios" width="640" height="960" />
      
      <gap:splash src="splash_iphone5.png" gap:platform="ios" width="1136" height="640" />
      <gap:splash src="splash640x1136.png" gap:platform="ios" width="640" height="1136" />
      
      <gap:splash src="splash.png" gap:platform="ios" width="1024" height="768" />
      <gap:splash src="splash768x1024.png" gap:platform="ios" width="768" height="1024" />
      
      <gap:splash src="splash568.png" gap:platform="ios" width="568" height="320" />
      <gap:splash src="splash320.png" gap:platform="ios" width="320" height="568" />
      
      <gap:splash src="splash1334.png" gap:platform="ios" width="1334" height="750" />
      <gap:splash src="splash750x1334.png" gap:platform="ios" width="750" height="1334" />
      
      <gap:splash src="splash2208.png" gap:platform="ios" width="2208" height="1242" />
      <gap:splash src="splash1242x2208.png" gap:platform="ios" width="1242" height="2208" />
      
      <gap:splash src="splash2048x1536.png" gap:platform="ios" width="2048" height="1536" />
      <gap:splash src="splash1536x2048.png" gap:platform="ios" width="1536" height="2048" />
    
    </widget>[/code:dmvw0moa]
  • Thank you very much for sharing! I will give this a try later today.

  • That worked perfectly! My problem was that I didn't import the icon/splash screen files into C2 prior to exporting. I was just zipping them with the project.

    I'm new to using PhoneGap so I have a few other questions about it that you might be able to answer.

    Can I have more than 1 app uploaded to PhoneGap without paying a subscription? I think they limit you to 1 "private" app, but is there a danger in having public apps uploaded to PhoneGap? The files are run through C2's script minifier and then zipped before uploading so can anyone really access the code anyway?

    Also, what features are ONLY available in PhoneGap by using third-party plugins? Things like in-app purchases and ads, I imagine. Do you recommend any plugins in particular? And can updates to C2, changes to PhoneGap, or iOS updates break these plugins at all? I'd hate to rely on one only to have it periodically stop working.

    Thanks to anyone who has some insight on this.

Jump to:
Active Users
There are 1 visitors browsing this topic (0 users and 1 guests)