Android Studio Image Asset Launcher Icon Background Color

Asked 7/5, 2016 at 7:24 Answered 18/11, 2022 at 11:48

143

I have a .png logo for my app which doesn't have a background, when I add it to android studio as an Image Asset I am forced to have a background. The hex field doesn't accept 8 digit color codes, 6 digits only. Is there anyway to keep the background invisible?

Shwalb answered 7/5, 2016 at 7:24 Comment(1)

romannurik.github.io/AndroidAssetStudio Great tool for any type of icons you want to generate – Hosanna 13/9, 2019 at 5:31

214

To make background transparent, set shape as None. See the image below:

EDIT:

For Android Studio 3.0, you can set it from Legacy Tab

Tshirt answered 7/5, 2016 at 7:33 Comment(10)

Thank you very much, I didn't notice that I needed to scroll down to see shape :) – Shwalb 7/5, 2016 at 7:35

just select image radio button and scroll down...thanks worked for me – Bors 10/11, 2016 at 13:35

How do you get to the above window from android studio – Marlie 24/1, 2017 at 12:28

@gikarasojokinene Follow this path: res->new->Image Asset – Tshirt 24/1, 2017 at 13:13

Yet another example of the poor UX in Studio – Bellinger 31/5, 2017 at 13:49

How to make the background layer transparent? – Devotion 4/4, 2018 at 6:37

It seems you need to use Patrick's answer below for Android Studio 3+. – Birnbaum 11/7, 2018 at 23:14

after creating app icon has empty borders to remove that @ElYeante – Romanist 13/11, 2018 at 12:20

On newer Android Studio versions the tab is called "Options". – Sailer 4/7, 2021 at 16:59

The Legacy option is not available in the latest Android Studio: Android Studio Dolphin | 2021.3.1 Patch 1 Build #AI-213.7172.25.2113.9123335, built on September 30, 2022 – Nari 8/11, 2022 at 12:24

I'm using Android Studio 3.0.1 and if the above answer doesn't work for you, try to change the icon type into Legacy and select Shape to None, the default one is Adaptive and Legacy.

Note: Some device has installed a launcher with automatically adding white background in icon, that's normal.

Wyckoff answered 28/12, 2017 at 13:8 Comment(6)

You select legacy only when your targetSdkVersion is less than 26. If your targetSdkVersion is 26, then your icon type should be adaptive and legacy. – Bluegill 1/3, 2018 at 20:16

How to make the background layer transparent? – Devotion 4/4, 2018 at 6:37

@zulkarnainshah if you choose to shape none with the legacy mode, then it will show transparent colour. – Arabel 10/5, 2018 at 12:23

Does not seem to work in Android Studio 3+. However, Patrick's answer below does seem to work, at least in Android Studio 3.1.2. – Birnbaum 11/7, 2018 at 23:13

@StephenM - which Android version your running? Remember that things become different specially from icon starting from Lollipop to the latest Android version, so I would not be surprise if people seing different background icon in the latest Android version. the fix is to try to use the lower version of Android and use a launcher that doesn't add any background in icons just for development to see the real design of your icon or stick on using the latest Android and just follow what they want. – Wyckoff 12/7, 2018 at 0:17

@Wyckoff - I'm using Android Studio 3.1.2 and building with target and compile SDK versions set at 26 and min SDK version at 23. What do you mean by lower version of Android? Android Studio or target/compile/min SDK version? – Birnbaum 12/7, 2018 at 14:3

You have two ways:

1) In Background Layer > Scaling, reduce the Resize to 1

and then in Legacy > Legacy Icon set Shape as None

2) in Background Layer > Scaling > Source Asset, you can set an image as a 1x1 pixel (or any size) transparent.png image (you've already created).

and then in Legacy > Legacy Icon set Shape as None

Triadelphous answered 12/8, 2018 at 13:31 Comment(1)

what did you do about Full Bleed Layers? – Trident 22/9, 2018 at 20:56

This is just another workaround.

For the 'Foreground Layer', select 'Asset type' as text and delete the default text in the text field.

For the 'Background Layer', select 'Asset type' as image and now choose the path of the image you want as an icon.

And you are good to go.

Eviscerate answered 29/5, 2019 at 12:59 Comment(3)

Very simple solution. Big Thanks! I've tested it on Android Studio 3.6 and one thing to add is that it was giving me the error upon having Foreground text null. So what I had done is just adding a space there and it's working. And adding some more! after that I got one problem that when I finished adding mipmap and ran my project, there was an Android logo overriding my logo and I fixed that by modifying mipmap icon xml files by removing there foreground tag line. Hope it will help someone. – Frail 20/3, 2020 at 19:29

This is brilliant! – Starfish 29/6, 2020 at 21:3

and set shape to none too.. working on android studio 4.1.1 – Perrault 29/11, 2020 at 10:21

the above approach didn't work for me on Android Studio 3.0. It still shows the background. I just made an empty background file

<?xml version="1.0" encoding="utf-8"?>
<vector
android:height="108dp"
android:width="108dp"
android:viewportHeight="108"
android:viewportWidth="108"
xmlns:android="http://schemas.android.com/apk/res/android">
</vector>

This worked except the full bleed layers

Prognosis answered 15/12, 2017 at 4:6 Comment(5)

I'm also using Android Studio 3.0, I do the same to make it work. Looks like we are no longer allow to make an icon base on what we want. – Wyckoff 27/12, 2017 at 12:49

This is not working. Android Studio 3.0.1, You can't set a transparent background. – Bluegill 1/3, 2018 at 20:29

Worked for me in Android Studio 3.1.2. It showed up in the Image Asset generator as black, but it is transparent when I deploy my app. – Birnbaum 11/7, 2018 at 23:12

I get a rendering error when I try using this vector as the background, anyone else? – Saraann 20/11, 2019 at 0:32

I think you should add path inside the vector. – Costar 15/10, 2020 at 6:2

Android Studio 3.5.3 It works with this configuration.

Waste answered 23/1, 2020 at 17:25 Comment(0)

I Just put my view background (color code) as ClipArt or Image background, and it looks like transparent or no background where both have the same color as background.

Azeria answered 30/9, 2020 at 15:21 Comment(0)

These are the steps I took to make an image transparent:

1- I used an online website which makes the image transparent, there are a lot of them. For me, I use this https://www241.lunapic.com/editor/?action=transparent and sometimes this https://www.online-image-editor.com/help/transparency

2- In Android Studio (I'm using version 3.1.3), open Image Asset from app > res (right click) > New > Image Asset

3- In the Path, choose the location of the transparent image which you downloaded from the online website, and make the other options as shown, then Next, then Finish. The five different sizes of image mdpi(48×48), hdpi(72×72), xhdpi(96×96), xxhdpi(144×144), and xxxhdpi(192×192) will be created in the res/mipmap-density folders.

4- If you need sizes (dimensions) different from above, you can use this website https://nsimage.brosteins.com/ to upload your PNG image of biggest size that will be used in xxxhdpi. After uploading, you can download a zip file containing the five different sizes of image in the res/drawable-density folders.

Infighting answered 7/12, 2018 at 20:55 Comment(0)

First, create a launcher icon (Adaptive and Legacy) from Image Asset:

Select an image for background layer and resize it to 0% or 1% and In legacy tab set shape to none.

Then, delete folder res/mipmap/ic_laucher_round in the project window and Open AndroidManifest.xml and remove attribute android:roundIcon="@mipmap/ic_launcher_round" from the application element.

In the end, delete ic_launcher.xml from mipmap-anydpi-v26.

Notice that: Some devices like Nexus 5X (Android 8.1) adding a white background automatically and can't do anything.

Elsaelsbeth answered 7/4, 2019 at 7:23 Comment(0)

With "Asset Type" set to "Image", try setting the same image for the foreground and background layers, keeping the same "Resize" percentage.

Glynas answered 27/12, 2020 at 10:54 Comment(0)

I just added the icon as a normal icon: New -> Vector Asset

and then change the app icon in the Manifest file.

Tobacco answered 20/9, 2021 at 4:0 Comment(1)

I'm afraid this didn't work for me. The emulator and a samsung galaxy both still show white backgrounds. The svg file definitely used clear background (or none at all). – Rangy 21/2 at 5:41

For Foreground Layer choose "Text" and then delete the content text Finaly choose the path of the image you want as an icon.

enter image description here

Truck answered 18/11, 2022 at 11:48 Comment(5)

Hi, your answer is fairly recent and lately I cannot find my way to the Asset Image Studio. Does it still exist, and how do I get there if "yes" please? – Official 17/9, 2023 at 11:48

Hi, yes it still exist – Truck 15/10, 2023 at 13:52

Thank you for your response. I can't remember the source now but I followed instructions and found it. – Official 15/10, 2023 at 14:26

You need to select the image option (Asset type) first and you will see the field to select the icon image path. – Truck 15/10, 2023 at 15:17

OK, You're welcome mathems32. – Truck 15/10, 2023 at 15:21

-1

Using android 3.0.1 I noticed this weird behavior(solution), First: in background layer in the source_asset change the asset_type from image to color and than change it back to image. second: enable trim in scaling and then resize it to a small percentage and it will work perfectly. PS: If u didn't do the first step the scaling wont take affect. and if anyone have an explanation for this please provide. steps

Ailsa answered 5/3, 2019 at 20:18 Comment(0)

Hot tags

Godot Unity Godot Help Programming Godot 4.X GUI GDScript 3D 2D Physics CSharp Godot 3.X VR XR Projects C++

Recommended topics

Hot tags