7 Replies Latest reply on Sep 18, 2016 11:18 PM by nileshg93492880

    Icons & splash

    luigip73824447 Level 1

      Hello, I develop an app for IOS & Android, and I can't put the icons and splash to show in both platforms.

       

      I generate the resources with ionic resources CLI, and use this images like the phonegap build example.

       

      My config.xml file stay in the same directory as res folder. This is part of my config file.

       

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

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

        <preference name="DisallowOverscroll" value="true"/>

        <preference name="SplashScreenDelay" value="2000"/>

        <preference name="FadeSplashScreenDuration" value="2000"/>

        <preference name="android-minSdkVersion" value="16"/>

        <preference name="BackupWebStorage" value="none"/>

        <preference name="SplashScreen" value="screen"/>

        <feature name="StatusBar">

          <param name="ios-package" value="CDVStatusBar" onload="true"/>

        </feature>

       

        <platform name="android">

          <icon src="res/icon/android/drawable-ldpi-icon.png" qualifier="ldpi"/>

          <icon src="res/icon/android/drawable-mdpi-icon.png" qualifier="mdpi"/>

          <icon src="res/icon/android/drawable-hdpi-icon.png" qualifier="hdpi"/>

          <icon src="res/icon/android/drawable-xhdpi-icon.png" qualifier="xhdpi"/>

          <icon src="res/icon/android/drawable-xxhdpi-icon.png" qualifier="xxhdpi"/>

          <icon src="res/icon/android/drawable-xxxhdpi-icon.png" qualifier="xxxhdpi"/>

          <splash src="res/screen/android/drawable-land-ldpi-screen.png" qualifier="land-ldpi"/>

          <splash src="res/screen/android/drawable-land-mdpi-screen.png" qualifier="land-mdpi"/>

          <splash src="res/screen/android/drawable-land-hdpi-screen.png" qualifier="land-hdpi"/>

          <splash src="res/screen/android/drawable-land-xhdpi-screen.png" qualifier="land-xhdpi"/>

          <splash src="res/screen/android/drawable-land-xxhdpi-screen.png" qualifier="land-xxhdpi"/>

          <splash src="res/screen/android/drawable-land-xxxhdpi-screen.png" qualifier="land-xxxhdpi"/>

          <splash src="res/screen/android/drawable-port-ldpi-screen.png" qualifier="port-ldpi"/>

          <splash src="res/screen/android/drawable-port-mdpi-screen.png" qualifier="port-mdpi"/>

          <splash src="res/screen/android/drawable-port-hdpi-screen.png" qualifier="port-hdpi"/>

          <splash src="res/screen/android/drawable-port-xhdpi-screen.png" qualifier="port-xhdpi"/>

          <splash src="res/screen/android/drawable-port-xxhdpi-screen.png" qualifier="port-xxhdpi"/>

          <splash src="res/screen/android/drawable-port-xxxhdpi-screen.png" qualifier="port-xxxhdpi"/>

        </platform>

        <platform name="ios">

          <icon src="res/icon/ios/icon.png" width="57" height="57"/>

          <icon src="res/icon/ios/icon@2x.png" width="114" height="114"/>

          <icon src="res/icon/ios/icon-40.png" width="40" height="40"/>

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

          <icon src="res/icon/ios/icon-50.png" width="50" height="50"/>

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

          <icon src="res/icon/ios/icon-60.png" width="60" height="60"/>

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

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

          <icon src="res/icon/ios/icon-72.png" width="72" height="72"/>

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

          <icon src="res/icon/ios/icon-76.png" width="76" height="76"/>

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

          <icon src="res/icon/ios/icon-small.png" width="29" height="29"/>

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

          <icon src="res/icon/ios/icon-small@3x.png" width="87" height="87"/>

          <splash src="res/screen/ios/Default-568h@2x~iphone.png" width="640" height="1136"/>

          <splash src="res/screen/ios/Default-667h.png" width="750" height="1334"/>

          <splash src="res/screen/ios/Default-736h.png" width="1242" height="2208"/>

          <splash src="res/screen/ios/Default-Landscape-736h.png" width="2208" height="1242"/>

          <splash src="res/screen/ios/Default-Landscape@2x~ipad.png" width="2048" height="1536"/>

          <splash src="res/screen/ios/Default-Landscape~ipad.png" width="1024" height="768"/>

          <splash src="res/screen/ios/Default-Portrait@2x~ipad.png" width="1536" height="2048"/>

          <splash src="res/screen/ios/Default-Portrait~ipad.png" width="768" height="1024"/>

          <splash src="res/screen/ios/Default@2x~iphone.png" width="640" height="960"/>

          <splash src="res/screen/ios/Default~iphone.png" width="320" height="480"/>

        </platform>

       

        <plugin name="cordova-plugin-console"></plugin>

        <plugin name="cordova-plugin-device"></plugin>

        <plugin name="cordova-plugin-inappbrowser"></plugin>

        <plugin name="cordova-plugin-splashscreen"></plugin>

        <plugin name="cordova-plugin-statusbar"></plugin>

        <plugin name="cordova-plugin-whitelist"></plugin>

        <plugin name="ionic-plugin-keyboard"></plugin>

       

      Thaks for the time, hope somebody can help me. I tryed much things but cant generate the correct builds

        • 1. Re: Icons & splash
          hollyschinsky Adobe Employee

          Hi Luigi,

           

          Are you using PhoneGap Build or a CLI to build? Are the icons/splash screens working on either platform or failing on both? Can you describe what you are seeing more specifically? Are you seeing a default splash screen upon run or a blank white screen and then your app?

           

          Thanks in advance,
          Holly

          • 2. Re: Icons & splash
            kerrishotts Adobe Community Professional

            I'm not quite sure I understand: "My config.xml file stay in the same directory as res folder". I initially took this to mean that you had the following structure:

             

            Project-root/

                res/

                    config.xml

             

            But the statement is ambiguous. It could mean this:

             

            project-root/

                config.xml

                res/

             

            Which structure do you have. If the first, then config.xml should /not/ be in your /res folder. It should be in one of two places:

             

            • If using PhoneGap/Cordova-CLI: root of your project (index.html should be in a www subdirectory)
            • If using PhoneGap Build: root of your archive/repo (alongside index.html; no www subdirectory)

             

            If the second, please verify what tool you're using to build the app (CLI, Build) or if you're testing on Desktop/Developer app.

             

            A few other thoughts:

             

            • Paths are relative to config.xml location; so make sure you can get to the referenced images from where config.xml is located.
            • Verify that the images themselves are the same size as indicated in config.xml. I've seen mismatches in the past, and the result is typically a failure to load the image.

             

            ---

             

            Edited to ask about project structure, build tool being used, and additional thoughts.

            1 person found this helpful
            • 3. Re: Icons & splash
              luigip73824447 Level 1

              - this is a capture of the content of my zip I've upload in the phonegap build.captura A.jpg

               

              - And this is the structure of my res folder

               

              captura B.jpg

              - and  fragment of my config.xml file

               

                <platform name="android">

                  <icon src="res/icon/android/drawable-ldpi-icon.png" qualifier="ldpi"/>

                  <icon src="res/icon/android/drawable-mdpi-icon.png" qualifier="mdpi"/>

                  <icon src="res/icon/android/drawable-hdpi-icon.png" qualifier="hdpi"/>

                  <icon src="res/icon/android/drawable-xhdpi-icon.png" qualifier="xhdpi"/>

                  <icon src="res/icon/android/drawable-xxhdpi-icon.png" qualifier="xxhdpi"/>

                  <icon src="res/icon/android/drawable-xxxhdpi-icon.png" qualifier="xxxhdpi"/>

                  <splash src="res/screen/android/drawable-land-ldpi-screen.png" qualifier="land-ldpi"/>

                  <splash src="res/screen/android/drawable-land-mdpi-screen.png" qualifier="land-mdpi"/>

                  <splash src="res/screen/android/drawable-land-hdpi-screen.png" qualifier="land-hdpi"/>

                  <splash src="res/screen/android/drawable-land-xhdpi-screen.png" qualifier="land-xhdpi"/>

                  <splash src="res/screen/android/drawable-land-xxhdpi-screen.png" qualifier="land-xxhdpi"/>

                  <splash src="res/screen/android/drawable-land-xxxhdpi-screen.png" qualifier="land-xxxhdpi"/>

                  <splash src="res/screen/android/drawable-port-ldpi-screen.png" qualifier="port-ldpi"/>

                  <splash src="res/screen/android/drawable-port-mdpi-screen.png" qualifier="port-mdpi"/>

                  <splash src="res/screen/android/drawable-port-hdpi-screen.png" qualifier="port-hdpi"/>

                  <splash src="res/screen/android/drawable-port-xhdpi-screen.png" qualifier="port-xhdpi"/>

                  <splash src="res/screen/android/drawable-port-xxhdpi-screen.png" qualifier="port-xxhdpi"/>

                  <splash src="res/screen/android/drawable-port-xxxhdpi-screen.png" qualifier="port-xxxhdpi"/>

                </platform>

                <platform name="ios">

                  <icon src="res/icon/ios/icon.png" width="57" height="57"/>

                  <icon src="res/icon/ios/icon@2x.png" width="114" height="114"/>

                  <icon src="res/icon/ios/icon-40.png" width="40" height="40"/>

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

                  <icon src="res/icon/ios/icon-50.png" width="50" height="50"/>

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

                  <icon src="res/icon/ios/icon-60.png" width="60" height="60"/>

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

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

                  <icon src="res/icon/ios/icon-72.png" width="72" height="72"/>

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

                  <icon src="res/icon/ios/icon-76.png" width="76" height="76"/>

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

                  <icon src="res/icon/ios/icon-small.png" width="29" height="29"/>

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

                  <icon src="res/icon/ios/icon-small@3x.png" width="87" height="87"/>

                  <splash src="res/screen/ios/Default-568h@2x~iphone.png" width="640" height="1136"/>

                  <splash src="res/screen/ios/Default-667h.png" width="750" height="1334"/>

                  <splash src="res/screen/ios/Default-736h.png" width="1242" height="2208"/>

                  <splash src="res/screen/ios/Default-Landscape-736h.png" width="2208" height="1242"/>

                  <splash src="res/screen/ios/Default-Landscape@2x~ipad.png" width="2048" height="1536"/>

                  <splash src="res/screen/ios/Default-Landscape~ipad.png" width="1024" height="768"/>

                  <splash src="res/screen/ios/Default-Portrait@2x~ipad.png" width="1536" height="2048"/>

                  <splash src="res/screen/ios/Default-Portrait~ipad.png" width="768" height="1024"/>

                  <splash src="res/screen/ios/Default@2x~iphone.png" width="640" height="960"/>

                  <splash src="res/screen/ios/Default~iphone.png" width="320" height="480"/>

                </platform>

               

              Thanks to all, hope I can solve this to submit my app to the stores.

              • 4. Re: Icons & splash
                luigip73824447 Level 1

                NOTE: I am using phonegap build

                • 5. Re: Icons & splash
                  luigip73824447 Level 1

                  I am using a premium account of phonegap build and in splash screen only I see a white screen faster... only I can see icons in android version not on IOS

                  • 6. Re: Icons & splash
                    luigip73824447 Level 1

                    any solution?

                    • 7. Re: Icons & splash
                      nileshg93492880

                      hey, I have same problem, How you solve this problem.