先看效果
平移 | 放大 | 裁剪原理 |
---|---|---|
1 | 2 | 示意图 |
官方文档
范例
测试工具
直接理解就是,通过一张 前景图 +一张 背景图 +(系统的遮罩裁剪+对前景图做动画 )最后实现app图标的动画效果
最最最关键,要看效果必须launcher支持,一般launcher都没这些个功能,所以,这里可以通过上面提供的测试工具来看效果。
创建步骤
1. 创建2张图,一个前景,一个背景
2. 创建adaptive-icon,指定上面创建的图
<?xml version="1.0" encoding="utf-8"?>
<adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android">
<background android:drawable="@drawable/ic_launcher_background" />
<foreground android:drawable="@drawable/ic_launcher_foreground" />
</adaptive-icon>
由于是Android8之后才有的所以,文件路径如下。为了能兼容低版本最好在默认的文件中放一个同名。不然launcher识别不到图标。
res/mipmap-anydpi-v26/ic_launcher.xml
3.在Manifest的android:icon中使用你创建的这个adaptive-icon
<application
…
android:icon="@mipmap/ic_launcher"
android:roundIcon="@mipmap/ic_launcher_round"
…>
</application>
图片要求
imag1.png1.两张图大小都是108dpX108dp的
2.内容区域为72dpX72dp,多的部分会被系统遮盖了,也就动画的时候可能漏一下
3. 关键icon的区域最好在那个66dp直径的圆中,不然动画会超出
最后,动画实际上是通过两张图差(一般是前景放大移动,背景图不动)动来完成的,只要2个图配合好就行。
前景作为镂空 效果
网友评论