专栏首页吴小龙同學Android 8.0 自适应图标

Android 8.0 自适应图标

项目中遇到一个问题,Android 8.0 系统上 APP 的 icon 显示的是默认的机器人的 icon,这是什么回事?原来 Android 8.0(API 级别 26)引入了自适应启动器图标,可以在不同设备模型中显示各种形状。下面看下官方酷炫动态图:

图1. 自适应图标支持各种设备之间不同的掩码。

可以通过定义 2 层来控制自适应启动器图标的外观,包括背景和前景。您必须提供图标图层作为可绘图,图标轮廓周围不能有蒙版或背景阴影。

图2. 自适应图标使用 2 个图层和 1 个蒙版进行定义。

在 Android 7.1(API级别25)及更早版本中,启动器图标大小为 48 x 48 dp。必须使用以下准则来调整图标图层的大小:

  • 两层的尺寸必须为 108 x 108 dp。
  • 图标的内部 72 x 72 dp 出现在蒙版视口内。
  • 系统会在四面各留出 18 dp,以产生有趣的视觉效果,如视差或脉冲。

我验证了,不是这些尺寸也是可以的,但我们还是严格按照这个准则来吧。

图3. 自适应图标支持各种视觉效果。

注意: 如果您没有使用必要的图层更新启动器图标,则该图标与系统 UI 显示的其他图标看起来不一致,并且不支持视觉效果。

用 XML 创建自适应图标

我们首先创建一个 Sample 项目,如图:

比以往多一个 res/mipmap-anydpi-v26 文件,打开,有背景和前景。

ic_launcher_background.xml

<?xml version="1.0" encoding="utf-8"?>
<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="108dp"
    android:height="108dp"
    android:viewportHeight="108"
    android:viewportWidth="108">
    <path
        android:fillColor="#26A69A"
        android:pathData="M0,0h108v108h-108z" />
    <path
        android:fillColor="#00000000"
        android:pathData="M9,0L9,108"
        android:strokeColor="#33FFFFFF"
        android:strokeWidth="0.8" />
    <!--省略部分代码-->
</vector>

ic_launcher_foreground.xml

<vector xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:aapt="http://schemas.android.com/aapt"
    android:width="108dp"
    android:height="108dp"
    android:viewportHeight="108"
    android:viewportWidth="108">
    <path
        android:fillType="evenOdd"
        android:pathData="M32,64C32,64 38.39,52.99 44.13,50.95C51.37,48.37 70.14,49.57 70.14,49.57L108.26,87.69L108,109.01L75.97,107.97L32,64Z"
        android:strokeColor="#00000000"
        android:strokeWidth="1">
        <aapt:attr name="android:fillColor">
            <gradient
                android:endX="78.5885"
                android:endY="90.9159"
                android:startX="48.7653"
                android:startY="61.0927"
                android:type="linear">
                <item
                    android:color="#44000000"
                    android:offset="0.0" />
                <item
                    android:color="#00000000"
                    android:offset="1.0" />
            </gradient>
        </aapt:attr>
    </path>
    <!--省略部分代码-->
</vector>

它们都是 vector,<foreground><background> 是支持android:drawable属性,我直接换成 ic_launcher_background.png 和 ic_launcher_foreground.png,<foreground><background>也支持@color/资源名

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

然后清单使用android:icon 属性以指定可绘制资源,还可以使用该android:roundIcon 属性定义图标可绘制资源。

<application
    …
    android:icon="@mipmap/ic_launcher"
    android:roundIcon="@mipmap/ic_launcher_round"
    …>
</application>

如果要将常规自适应启动器图标应用于快捷方式的相同蒙版和视觉效果,使用以下:

  • 对于静态快捷方式,请使用该<adaptive-icon>元素。
  • 对于动态快捷方式,请在createWithAdaptiveBitmap() 创建方法时调用该 方法。

大功告成,Android 8.0 上能自适应,以下是默认的图标。

注意:Android Studio 3.0 以下的编译器无法找到 adaptive-icon 标签,这点未验证。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • Android 9.0 SystemUI 主要视图 SystemBars

    SystemBars 是 SystemUI 主要视图,接下来看看它是如何呈现?基于 AOSP 9.0 分析。

    吴小龙同學
  • Android 9.0 SystemUI NavigationBar

    导航栏有返回(back),桌面(home),最近任务(recent),本篇主要学习这三个是如何加载的,点击事件在哪里写的?基于 AOSP 9.0 分析。

    吴小龙同學
  • Android 9.0 SystemUI Notification

    本文主要分享 SystemUI Notification 具体如何呈现的?基于 AOSP 9.0 分析。

    吴小龙同學
  • Android 入门程序 Kotlin版(1)

    4个组件 TextView,Button,TextEdit,ImageView依次纵向线性布局。

    用户6021899
  • Android自定义Dialog对话框

    sr
  • Android动画基础 | 概述、逐帧动画、视图动画

    或者给<animation-list>添加android:oneshot="true"属性,也可实现:

    凌川江雪
  • Android 自定义Seekbar样式

    Xiaolei123
  • Android UI 设计技巧

    <merge/>标签帮助你排除把一个布局插入到另一个布局时产生的多余的View Group.如,你的被复用布局是一个垂直的线性布局,包含两个子视图,当它作为一个...

    提莫队长
  • android的AsyncTask的应用

    AsyncTask,是android提供的轻量级的异步类,可以直接继承AsyncTask,在类中实现异步操作

    提莫队长
  • android图形美化

    引用:android:textColor=”@color/button_selector”

    提莫队长

扫码关注云+社区

领取腾讯云代金券