5 Replies Latest reply on May 26, 2017 1:38 PM by vangroover

    Help With Splash Screen and Icon on IOS Devices

    briand1345367

      Ok, after 3 solid days of trying to get:

       

      1. My custom icon on the IOS Ipad Desktop

      2. See my Custom Splash screen,

       

      I have decided this has been the most expensive part of building this first phone app, and while I believe PhoneGap is a great service, it is also hijacking my icons and placing its own Icon and Splash screen into the config.xml file.  Do I need to give someone money to prevent this override from happening?

       

      I have place all the icons in the right folders with respect to the index.html file and many different combinations.  When the install begins, I see my icon on the IOS Install page that has been built.  When it is installing, "it looks like" it is going to use my icon and then "poof" changes to the PhoneGap icon.

       

      I have seen some say ""do this" and "do that", both contradictory and yet both "work."   I have used the simple icon.png and splash.png to the create a graphic for every resolution and place in:  1) the root, 2) a Subfolder, etc.

       

       

      Any insights on what should seem to be the most simple aspect of mobile app development and how to use Phonegap Build online and see one's own icon and splash would be most appreciated.

        • 1. Re: Help With Splash Screen and Icon on IOS Devices
          vangroover Adobe Employee

          i notice the splahes and icons have www/ and www/ doesnt exist.

           

          in fact none of those splashes or icons exist in your zip except for /icons/ios/icon-60@3x.png

          • 2. Re: Help With Splash Screen and Icon on IOS Devices
            briand1345367 Level 1

            Correct.  I just opened my .ipa file and noticed the only file that get copied over is that one for an icon.  And when I am at an installation screen on the iPad, I see it no problems.  As it installs, I can see my icon60@ muted and in the background, but as soon as the installation is complete, "poof" the PhoneGap icon takes over. 

             

            I need to know what I need to do to prevent this from happening. 

            • 3. Re: Help With Splash Screen and Icon on IOS Devices
              briand1345367 Level 1

              Or rather, I have all of the images for the various resolutions in the same place as the icon-60@3x.png.  It seems when the PhoneGap build happens, that particular file get copied over into the .ipa zip file, but none of the rest.   I have all of the icons specified in my Config.xml (Prior to build):

               

              <platform name = 'ios'>

                  <icon src='icon-40.png' platform='ios' width='40' height='40' />

                  <icon src='icon-40@2x.png' platform='ios' width='80' height='80' />

                  <icon src='icon-50.png' platform='ios' width='50' height='50' />

                  <icon src='icon-50@2x.png' platform='ios' width='100' height='100' />

                  <icon src='icon-60.png' platform='ios' width='60' height='60' />

                  <icon src='icon-60@2x.png' platform='ios' width='120' height='120' />

                  <icon src='icon-60@3x.png' platform='ios' width='180' height='180' />

                  <icon src='icon-72@.png' platform='ios' width='72' height='72' />

                  <icon src='icon-72@2x.png' platform='ios' width='144' height='144' />

                  <icon src='icon-72@3x.png' platform='ios' width='216' height='216' />

                  <icon src='icon-76.png' platform='ios' width='76' height='76' />

                  <icon src='icon-76@2x.png' platform='ios' width='152' height='152' />

                  <icon src='icon-small.png' platform='ios' width='29' height='29' />

                  <icon src='icon-small@2x.png' platform='ios' width='58' height='58' />

                  <icon src='icon.png' platform='ios' width='57' height='57' />

                  <icon src='icon@2x.png' platform='ios' width='114' height='114' />

                  <icon src='icon-87.png' platform='ios' width='87' height="87" />

                  <icon src='icon-58.png' platform='ios' width='58' height="58" />

              </platform>

              • 4. Re: Help With Splash Screen and Icon on IOS Devices
                briand1345367 Level 1

                Ok, after looking in the .ipa which is the final build, I see all of the icons listed in the root, like "AppIcon60x60@3x.png" etc... Do I need to use this naming convention in my Config.xml file instead of what I have posted above? And, rebuild all of the graphics with this naming convention and put them into the root prior to my PhoneGap build?

                • 5. Re: Help With Splash Screen and Icon on IOS Devices
                  vangroover Adobe Employee

                  how is your app structured? all splashes and icons have to be specified relative to the config.xml.

                   

                  maybe move the config.xml up next to the www directory instead of next to the index.html