Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Creating Adaptive Icons with <maskable-icon>

Tags:

I'm trying to implement with this guide:

https://developer.android.com/preview/features/adaptive-icons.html#Creating

for Android O Preview but the launcher shows me the default Android icon and not the two layers indicated in my ic_launcher.xml

ic_launcher.xml

<maskable-icon>
   <background android:drawable="@mipmap/layer0"/>
   <foreground android:drawable="@mipmap/layer1"/>
</maskable-icon>

Has anyone tried to implement this? Or is not still available?

(In my manifest I put the ic_launcher.xml in icon)

UPDATE: Google updates your website and put adaptive-icon instead maskable-icon

like image 861
HerberthObregon Avatar asked Mar 23 '17 06:03

HerberthObregon


People also ask

How do you make an adaptive icon?

Add your adaptive icon to your app xml , create alternative drawable resources in your app for backward-compatibility with Android 8.0 (API level 26). You can then use the <adaptive-icon> element to define the foreground, background, and monochromatic layer drawables for your icons.

How do you make a PWA maskable icon?

With your Progressive Web App open, launch DevTools and navigate to the Application panel. In the Icons section, you can choose to Show only the minimum safe area for maskable icons. Your icons will be trimmed so that only the safe area is visible. If your logo is visible within this safe area, you're good to go.

What should be the size of maskable icon?

Maskable icons can be any size, and you can continue to use the same sizes that you'd use for normal transparent icons. But when designing the icon, ensure that important information is within a “safe zone” circle with a radius equal to 40% of the image's size.


1 Answers

I found out an answer when I check the file below.

\android-sdk-windows\platforms\android-O\data\res\drawable\sym_def_app_icon.xml

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

I don't know which is eventually right. But for now(preview 1), adaptive-icon tag seems to work correctly.

like image 63
Chisato Avatar answered Oct 08 '22 08:10

Chisato