简体   繁体   English

Android 图标:避免白边

[英]Android icons: avoiding white margins

My app's icon is already basically a circle.我的应用程序的图标已经基本上是一个圆圈。 Android's insistence on putting it inside another circle makes for a very ugly result, so I'm trying to figure out how to tell it to behave. Android 坚持把它放在另一个圈子里会导致一个非常丑陋的结果,所以我试图弄清楚如何告诉它表现。

For example, if my icon is (and this isn't my actual icon, but that doesn't matter):例如,如果我的图标是(这不是我的实际图标,但这并不重要):

图标

Then Android renders it like this:然后 Android 渲染它是这样的:

在此处输入图片说明

NOTE : the content outside the circle is very important.注意:圆圈的内容非常重要。 Without this, Android seems to understand that my icon is already circular and shouldn't be wrapped in another circle.没有这个,Android 似乎明白我的图标已经是圆形的,不应该被包裹在另一个圆圈中。

I've seen this question and answer , but I am confused by both the behavior and the fact that the proposed fix has not worked for me.我已经看过这个问题和答案,但我对行为和提议的修复对我不起作用的事实感到困惑。

When I run the Image Asset Studio tool to generate icons, I go through the process of selecting legacy and getting it looking exactly how I want, then I click Finish and....nothing happens.当我运行 Image Asset Studio 工具来生成图标时,我会经历选择旧版的过程,并让它看起来完全符合我的要求,然后我单击“完成”,然后......没有任何反应。 No images are generated, nothing.没有图像生成,什么都没有。 I know this because I see no changes detected by git, nor do my app's icon images seem any different.我知道这一点是因为我没有看到 git 检测到任何变化,我的应用程序的图标图像也没有任何不同。

My gradle includes:我的毕业证书包括:

compileSdkVersion 27 minSdkVersion 16 targetSdkVersion 27

Can anyone tell me how to get Android to understand that my icon is still fundamentally a circle?谁能告诉我如何让 Android 理解我的图标基本上仍然是一个圆圈? Sure, it has a bit of content outside the circle, but it's still within the bounds of the square that encompasses the circle...当然,它在圆圈之外有一些内容,但它仍然在包围圆圈的正方形的范围内......

Solution: As of my understanding from the docs解决方案:根据我对文档的理解

Android 8.0 Oreo (API level 26) introduced adaptive launcher icons, which has two layers, a foreground and a background. Android 8.0 Oreo(API 级别 26)引入了自适应启动器图标,它有两层,一个前景和一个背景。 The material design guidelines state that the background layer must be opaque in Android O and beyond . Material Design 指南规定背景层在 Android O 及更高版本中必须是不透明的 And here is another link to a Guideline from Material Design.这是 Material Design 指南的另一个链接。

https://material.io/guidelines/style/icons.html#icons-icons-for-android https://material.io/guidelines/style/icons.html#icons-icons-for-android

So the white circle which you want to remove will not be removed and will always be there.因此,您要删除的白色圆圈不会被删除,并且会一直存在。 If you still want to remove the white circle then probably you have to change the icon to full view or else your icon will be tampered.如果您仍然想删除白色圆圈,那么您可能必须将图标更改为全视图,否则您的图标将被篡改。

PS: If you observe the "Round Icons" on your phone's launcher then all are occupying full space and do not have any extra image as in your green icon. PS:如果您在手机的启动器上观察到“圆形图标”,那么所有图标都占用了全部空间,并且没有绿色图标中的任何额外图像。 So, have an icon which can fill-up the entire icon image.所以,有一个可以填满整个图标图像的图标。

As a workaround, you can reduce the white color to something to semi-transparent by decreasing the background size of the icon.作为一种解决方法,您可以通过减小图标的背景大小将白色减少到半透明。 To do that, please follow the steps below:为此,请按照以下步骤操作:

Step1: Right-click on the app and then New then Image Asset :步骤 1:右键单击app ,然后单击“ New然后单击New Image Asset

截屏

Step2: In the foreground layer, select your icon: Step2:在前景层,选择你的图标:

a.一种。 Select your image from the path.从路径中选择您的图像。

b.In Scaling below, Give Trim to Yes.在下面的缩放中,将Trim为 Yes。 and Resize to 80%Resize80%

截屏

Step3: Navigate to Background Layer :第3步:导航到Background Layer

a.一种。 Select your image from the path.从路径中选择您的图像。

b.In Scaling below, Give Trim to Yes.在下面的缩放中,将Trim为 Yes。 and Resize to less than or equal to 5%并将Resize为小于或等于5%

截屏

Finally: Click Next and Finish最后:单击NextFinish

After following the steps you will be able to see your icon with a semi-transparent black background.按照这些步骤操作后,您将能够看到带有半透明黑色背景的图标。 Please try and see if it comes close to what you need.请尝试看看它是否接近您的需要。

Please comment if any doubts or issues regarding the same, and I'll do my best to solve it.如果有任何疑问或问题,请发表评论,我会尽力解决。

In Addition with @Ümañg ßürmån Answer :除了@Ümañg ßürmån 答案:

To remove white spaces around the launcher icon I do the following :要删除启动器图标周围的空格,我执行以下操作:

Step1: Right-click on the app and then New then Image Asset .步骤 1:右键单击app ,然后单击New然后单击Image Asset Select : Launcher Icon (Adaptive and Legacy)选择: Launcher Icon (Adaptive and Legacy)
then Select your image from the path .然后从path选择您的图像。

In Foreground : Step 2 : In Scaling below, Give Trim to Yes.在前景中:第 2 步:在下面的缩放中,将Trim为是。 and Resize to 128 % .并调整到128 % 。

In Background: Step3: I have choosed Asset Type : Color , and select white color.在背景中: Step3:我选择了Asset Type : Color ,并选择了白色。

Thats All.就这样。 Then my launcher Image fit to the whole Icon.然后我的启动器图像适合整个图标。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM