Android: Add shadow to mipmap icon launcher

Question

Hello can someone show me how to add shadow to the icon launcher in android ? I have the following mipmap launcher icon:

anydpi.xml

<adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android">
    <background android:drawable="@color/ic_launcher_background"/>
    <foreground android:drawable="@drawable/ic_launcher_foreground"/>
</adaptive-icon>

ic_launcher_background.xml

<resources>
    <color name="ic_launcher_background">#448AFF</color>
</resources>

ic_launcher_foreground.xml

<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="108dp"
android:height="108dp"
android:viewportWidth="1347.3684"
android:viewportHeight="1347.3684">


<group android:translateX="417.6842"
      android:translateY="417.6842">
      <path android:fillColor="#424A60" android:pathData="M445.793,512H128V0h317.793c9.754,0 17.655,7.901 17.655,17.655v476.69C463.448,504.099 455.548,512 445.793,512"/>
      <path android:fillColor="#586789" android:pathData="M128,512H92.69c-9.754,0 -17.655,-7.901 -17.655,-17.655V17.655C75.034,7.901 82.935,0 92.69,0H128V512z"/>
      <path android:fillColor="#CCD0D2" android:pathData="M92.69,52.966h-35.31c-4.873,0 -8.828,-3.946 -8.828,-8.828s3.955,-8.828 8.828,-8.828h35.31c4.873,0 8.828,3.946 8.828,8.828S97.562,52.966 92.69,52.966"/>
      <path android:fillColor="#CCD0D2" android:pathData="M92.69,123.586h-35.31c-4.873,0 -8.828,-3.946 -8.828,-8.828s3.955,-8.828 8.828,-8.828h35.31c4.873,0 8.828,3.946 8.828,8.828S97.562,123.586 92.69,123.586"/>
      <path android:fillColor="#CCD0D2" android:pathData="M92.69,194.207h-35.31c-4.873,0 -8.828,-3.946 -8.828,-8.828c0,-4.882 3.955,-8.828 8.828,-8.828h35.31c4.873,0 8.828,3.946 8.828,8.828C101.517,190.261 97.562,194.207 92.69,194.207"/>
      <path android:fillColor="#CCD0D2" android:pathData="M92.69,264.828h-35.31c-4.873,0 -8.828,-3.946 -8.828,-8.828s3.955,-8.828 8.828,-8.828h35.31c4.873,0 8.828,3.946 8.828,8.828S97.562,264.828 92.69,264.828"/>
      <path android:fillColor="#CCD0D2" android:pathData="M92.69,335.448h-35.31c-4.873,0 -8.828,-3.946 -8.828,-8.828c0,-4.882 3.955,-8.828 8.828,-8.828h35.31c4.873,0 8.828,3.946 8.828,8.828C101.517,331.502 97.562,335.448 92.69,335.448"/>
      <path android:fillColor="#CCD0D2" android:pathData="M92.69,406.069h-35.31c-4.873,0 -8.828,-3.946 -8.828,-8.828c0,-4.882 3.955,-8.828 8.828,-8.828h35.31c4.873,0 8.828,3.946 8.828,8.828C101.517,402.123 97.562,406.069 92.69,406.069"/>
      <path android:fillColor="#CCD0D2" android:pathData="M92.69,476.69h-35.31c-4.873,0 -8.828,-3.946 -8.828,-8.828c0,-4.882 3.955,-8.828 8.828,-8.828h35.31c4.873,0 8.828,3.946 8.828,8.828C101.517,472.744 97.562,476.69 92.69,476.69"/>
      <path android:fillColor="#25AE88" android:pathData="M331.034,406.069c0,-29.255 -23.711,-52.966 -52.966,-52.966s-52.966,23.711 -52.966,52.966s23.711,52.966 52.966,52.966S331.034,435.324 331.034,406.069"/>
      <path android:fillColor="#CC4B4C" android:pathData="M348.69,344.276v35.31h-24.797c4.511,7.795 7.142,16.825 7.142,26.483c0,7.274 -1.474,14.204 -4.122,20.515c6.444,3.69 13.815,5.967 21.778,5.967c24.373,0 44.138,-19.765 44.138,-44.138S373.063,344.276 348.69,344.276"/>
      <path android:fillColor="#F0CE49" android:pathData="M260.414,291.31v23.499l19.897,7.239l-11.626,31.938c3.054,-0.547 6.179,-0.883 9.384,-0.883c19.597,0 36.661,10.664 45.824,26.483h24.797V291.31H260.414z"/>
      <path android:fillColor="#CC4B4C" android:pathData="M268.687,353.983l11.626,-31.929l-66.366,-24.152l-24.152,66.357l42.39,15.431C239.838,366.412 253.062,356.781 268.687,353.983"/>
      <path android:fillColor="#586789" android:pathData="M278.069,97.103h-88.276c-4.873,0 -8.828,-3.946 -8.828,-8.828s3.955,-8.828 8.828,-8.828h88.276c4.873,0 8.828,3.946 8.828,8.828S282.942,97.103 278.069,97.103"/>
      <path android:fillColor="#586789" android:pathData="M401.655,158.897h-61.793c-4.873,0 -8.828,-3.946 -8.828,-8.828s3.955,-8.828 8.828,-8.828h61.793c4.873,0 8.828,3.946 8.828,8.828S406.528,158.897 401.655,158.897"/>
      <path android:fillColor="#586789" android:pathData="M286.901,158.897h-61.793c-4.882,0 -8.828,-3.946 -8.828,-8.828s3.946,-8.828 8.828,-8.828h61.793c4.873,0 8.828,3.946 8.828,8.828S291.774,158.897 286.901,158.897"/>
      <path android:fillColor="#586789" android:pathData="M189.793,158.897h-17.655c-4.873,0 -8.828,-3.946 -8.828,-8.828s3.955,-8.828 8.828,-8.828h17.655c4.873,0 8.828,3.946 8.828,8.828S194.666,158.897 189.793,158.897"/>
      <path android:fillColor="#586789" android:pathData="M401.655,194.207H384c-4.873,0 -8.828,-3.946 -8.828,-8.828c0,-4.882 3.955,-8.828 8.828,-8.828h17.655c4.873,0 8.828,3.946 8.828,8.828C410.483,190.261 406.528,194.207 401.655,194.207"/>
      <path android:fillColor="#586789" android:pathData="M348.69,194.207h-88.276c-4.873,0 -8.828,-3.946 -8.828,-8.828c0,-4.882 3.955,-8.828 8.828,-8.828h88.276c4.873,0 8.828,3.946 8.828,8.828C357.517,190.261 353.562,194.207 348.69,194.207"/>
      <path android:fillColor="#586789" android:pathData="M207.453,194.207h-35.31c-4.882,0 -8.828,-3.946 -8.828,-8.828c0,-4.882 3.946,-8.828 8.828,-8.828h35.31c4.873,0 8.828,3.946 8.828,8.828C216.28,190.261 212.326,194.207 207.453,194.207"/>
      <path android:fillColor="#586789" android:pathData="M401.655,229.517h-88.276c-4.873,0 -8.828,-3.946 -8.828,-8.828s3.955,-8.828 8.828,-8.828h88.276c4.873,0 8.828,3.946 8.828,8.828S406.528,229.517 401.655,229.517"/>
      <path android:fillColor="#586789" android:pathData="M260.414,229.517h-35.31c-4.873,0 -8.828,-3.946 -8.828,-8.828s3.955,-8.828 8.828,-8.828h35.31c4.873,0 8.828,3.946 8.828,8.828S265.287,229.517 260.414,229.517"/>
      <path android:fillColor="#586789" android:pathData="M189.793,229.517h-17.655c-4.873,0 -8.828,-3.946 -8.828,-8.828s3.955,-8.828 8.828,-8.828h17.655c4.873,0 8.828,3.946 8.828,8.828S194.666,229.517 189.793,229.517"/>
  </group>
</vector>

The output of this code is this:

However, i want it to get a shadow like this:

Please don't advise me to use this link: Android Asset Launcher Icon because i've already tried it and i don't like it since it converts the icon to an image instead of vector drawables and it doesn't support adaptive icons. I want vector drawables answers only please.

Please help me.

Answer 1

Maybe this will help others.. I had the same problem, but I also couldn't find any tool to automate the process, so I ended up following a tutorial for the Inkscape software to manually create the shadow. Another alternative to Inkscape that I've heard of is Adobe Illustrator.

Some problems I ran into after creating the SVG icon:

• Android Studio Asset Studio was importing the SVG icon without a shadow. It was giving the error "Gradient has no stop info". I found a StackOverflow post which shared a tool for modifying the SVG icon to make it compatible with Android Studio, and that fixed it.
• One of my test devices was crashing when trying to display the SVG. Logcat showed the following error: java.lang.IllegalArgumentException: R is not a valid verb. Failure occurred at position 2 of path: STRING_TOO_LARGE. The problem was that the pathData for my shadow was too large. I was able to shorten the shadow's path in Inkscape using the "simplify" feature, which shortens the path while keeping the overall shape mostly the same.