0

I am having Angular SPA and service workers are enabled. I have included manifest.json file on my index page.

Now I want to use two different icons

  1. When users say Add to Home Screen (Home screen added icon).
  2. Splash Screen icon/image (the image that is displayed from the time the app is loaded to the time the page is displayed)

Refer to my code below:

manifest.json

{
  "name": "myApp",
  "short_name": "myApp",
  "theme_color": "#1c4cc3",
  "background_color": "#ffffff",
  "display": "standalone",
  "scope": "/",
  "start_url": "/",
  "icons": [
    {
      "src": "assets/icons/logo-192x192.png",
      "sizes": "192x192",
      "type": "image/png"
    }
  ]
}

Included this in index.html page

<link rel="manifest" href="manifest.json">
8
  • Please read here, how to ask a good question: stackoverflow.com/help/how-to-ask
    – Dan Stef
    Sep 5, 2018 at 12:21
  • @Dan Stef: So you didn't get what my question is??
    – Teja
    Sep 5, 2018 at 12:26
  • I have an idea what your question is, but you do not explain what you tried already, or what errors you get.. Did you read the link I've posted?
    – Dan Stef
    Sep 5, 2018 at 12:36
  • I have edited the entire question now. Please comment
    – Teja
    Sep 5, 2018 at 13:05
  • From my (limited understanding) it looks good. Did you check that the file exists in the right path? Did you restart your webserver? Does the problem exist locally?
    – Dan Stef
    Sep 5, 2018 at 13:31

1 Answer 1

-2

First, create a drawable resource file:

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android"
    android:opacity="opaque">
    <item android:drawable="@color/colorPrimary"/>
    <item>
        <bitmap
            android:gravity="center"
            android:src="@drawable/icon"/>
    </item>
</layer-list>

Then apply it to your activity theme in styles(The theme must be assigned to the Main activity):

<item name="android:windowBackground">@drawable/splash</item>

Finally, apply it to y our activity on the manifest:

android:theme="@style/yourTheme"

There you go...

4
  • If you are willing to change the icon tho, you must include it in your res directory before publishing, then prompt the user to select one..
    – Aksh
    Sep 5, 2018 at 6:35
  • 2
    This answer is related to native apps. The author asked for a PWA (progressive web app) solution.
    – Denis Loh
    Sep 5, 2018 at 11:23
  • @teja Is this solution not compatible? As your question is pretty confusing! I don't think my answer helped...I'll delete if you say so..
    – Aksh
    Sep 5, 2018 at 12:35
  • I have edited the entire question now. Please comment
    – Teja
    Sep 5, 2018 at 13:04

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.