CODEWITHSUNDEEP
androidandroid-studio
AlanSTACK
AlanSTACK

Reputation: 6065

How do I make a launcher icon with a gradient background?

The standard Android Image Studio only allows me to select a single color as the background for my icon. Is there a method for selecting two colors and creating a linear gradient effect?

enter image description here

Upvotes: 11

Views: 7556

Answers (2)

Ajeet Kumar
Ajeet Kumar

Reputation: 1

As mentioned in the Change the app icon example doc:

the Android platform introduced support for adaptive icons (as of API level 26). By implementing an adaptive icon for your app, your app is able to accommodate a large range of devices by tailoring the launcher icon based on a device's display

In res folder, create a mipmap-anydpi-v26 folder, create ic_launcher.xml file and add the following:

<?xml version="1.0" encoding="utf-8"?>
<adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android">
  <background android:drawable="@mipmap/ic_launcher_background"/>
  <foreground android:drawable="@mipmap/ic_launcher_foreground"/>
  <monochrome android:drawable="@mipmap/ic_launcher_monochrome"/>
</adaptive-icon>

Here as you see, above we need three drawable that we need to put in all other mipmap folders

  1. ic_launcher_background.png is the gradient background image
  2. ic_launcher_foreground.png is the main icon/logo with transparent background.
  3. ic_launcher_monochrome.png is the monochrome version of ic_launcher_foreground to support monochrome ui adaptation in android.

It is done. You can use websites like IconKitchen to generate everything mentioned above and copy paste in your res folder.

Upvotes: 0

Jacky
Jacky

Reputation: 3239

Create an color_gradient.xml in drawable: 

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape>
            <gradient
                android:startColor="@color/start_gradient" <!--Start color of the gradient-->
                android:endColor="@color/end_gradient" <!--End color of the gradient-->
                android:angle="45" /> <!--Change this to see the combination of gradient color-->
        </shape>
    </item>
</selector>

When using for your image:

 android:backgroundTint="@drawable/color_gradient

EDIT:

In case of using Android Image Asset, you still can link the background color to this xml file, to create a gradient background

Upvotes: 17

Related Questions