MIUI论坛 下载APP

官方团队

Rank: 8Rank: 8

积分
2014
机型
未知设备
签到次数
176
MIUI版本
9.5.29
私信

[制作教程] 官方秘籍】如何完成MAML动态图标 百变插件 完美适配全机型

[复制链接]
7714 24 |
2015-8-18 14:48 | 来自PC
| |
|
跳转
本帖最后由 天使使planB 于 2016-6-7 16:14 编辑

一份manifest文件,可以同时运行在多个设备,只需要设置好在不同尺寸或密度的设备上使用的资源和缩放比例就可以了。

资源适配
extraResources="sw1000-den320:den320:1.2,sw1000-den320::1.2,sw1000-den320-large:den320:1.2"
每一项用逗号隔开,即不同的机型之间用逗号隔开,每一项内部通常用两个冒号隔开,第一个冒号之前是对机型的描述,两个冒号之间是对所用资源的描述,第二个冒号之后描述的是对所用资源的缩放比。这里说的资源就是图片,对资源的缩放就是在不同的机型上缩小放大图片。
sw1000-den320:den320:1.2这一项的意思是在屏宽是1000密度是320的机型上,使用的是den320文件夹下的资源,并且放大1.2倍;
sw1000-den320::1.2这一项中两个冒号之间是空白,意思是在屏宽1000密度320的机型上,使用的是默认的资源,并且放大1.2倍。

extraResources="sw1440-den480:1.8,sw1000-den320-large:1.8"
上面这两项内部都只有一个冒号,意思是sw1440-den480的机型使用的资源就是在sw1440-den480这一同名文件夹下的资源,并且放大1.8倍。
在资源适配的描述中,对机型的描述格式必须是swXXX-denXXX,否则无法生效。

布局适配
布局适配是对XML中的所有的坐标和尺寸的适配,每一项依然用逗号隔开,但是每一项内部都只用一个冒号分割,因为布局适配无需指定资源,所以冒号之前是对机型的描述,冒号之后是缩放比,这里的缩放比通常是和资源的缩放比一致的。
extraScaleByDensity="320:1.2,480:1.8"
extraScaleByDensity的意思是根据密度缩放,第一项的意思是在密度是320的机型上对布局的缩放是1.2,即所有的坐标和尺寸都要放大1.2倍。
extraScaleByScreenWidth="720:1.2,1280:1.8"这是根据屏宽缩放。
extraScales="sw1000-den320:1.2,sw2000-den480-large:1.8",这是根据屏宽和密度缩放。

适配原理
首先把你所有自定义中出现的den和sw做一个列表 (比如这里extraResources="sw1440-den440::0.916, sw720-den320::0.667, sw480-den240::0.444",涉及到的den有440, 320, 240, 再加上一个默认的480; sw有1440, 720, 480, 再加一个默认的1080(与den480对应) )
然后当你的主题放到一个设备上时,首先拿你的设备密度去上面的den列表中找,找到最贴近的一个,然后如果同样den有多个sw,那么再拿设备的屏宽去这几个sw中找最贴近的一个,这样就找到了最合适的swXXX-denXXX
最后,资源就取这个sw-den对应的目录下的资源,及缩放比例Sr。代码中数字的缩放比例就使用sw-den对应的Ss.
最最后,就是缩放比例
a) 如果按密度缩放(即scaleByDensity="true"):资源真正的缩放比例是Sr * 设备den (找到的den),代码中的数字缩放比例是Ss * 设备den(找到的den)
b) 如果按屏宽缩放(即scaleByDensity="false"):资源真正的缩放比例是Sr * 设备sw (找到的sw)  ,代码中的数字缩放比例是Ss * 设备sw(找到的sw)​


下面用一个动态图标举例:
<Icon version="1" frameRate="0" width="192" height="192" useVariableUpdater="DateTime.Second" resDensity="480" extraResources="sw720-den320::0.705,sw1080-den440::0.882,sw1440-den640::1.176" extraScales="sw720-den320:0.705,sw1080-den440:0.882,sw1440-den640:1.176">//这里所用的资源都是默认资源,默认资源的意思是在com.android.calendar这个动态日历的文件夹下只有一套资源,并且是直接放在这个文件夹下的。resDensity="480"的意思是下面的代码都是根据密度是480的机型写的,即屏宽是1080的机型,所以这句话也可以换成screenWidth="1080"。
     <VariableBinders>
        <BroadcastBinder action="android.intent.action.TIME_SET" />
        <BroadcastBinder action="android.intent.action.DATE_CHANGED" />
     </VariableBinders>
     <Group pivotX="96" pivotY="96">
         <Image x="96" y="96" align="center" alignV="center" src="calendar_icon.png" srcid="#date" />
     </Group>//如果在密度是640的设备上,pivotX,pivotY,X和Y都会放大成原来的1.176倍来适配设备,这就是布局适配。
</Icon>

再举一个例子:
<Icon version="1" frameRate="18" width="192" height="192" resDensity="480" extraResources="sw720-den320:den320:1,sw1080-den440:den480:0.882,sw1080-den480:den480:1,sw2000-den640:den480:1.176" extraScales="sw720-den320:1,sw1080-den440:0.882,sw1080-den480:1,sw2000-den640:1.176">//这里所用的资源都是来自den320文件夹和den480文件夹,即在com.android.deskclock​这个动态时钟文件夹下建两个文件夹,分别叫den320和den480,里面放相应资源。
     <Image name="hand_hour" x="96" y="53" align="center" pivotX="4" pivotY="43" src="hour.png" rotation="#hour_angle_raw" antiAlias="true"/>
    <Image name="hand_minute" x="96" y="49" align="center" pivotX="8" pivotY="47" src="minute.png" rotation="#minute_angle_raw" antiAlias="true"/>
</Icon>





icons.zip

98.42 KB, 下载次数: 168

收藏37 分享  

玩机之皇

Rank: 6Rank: 6

积分
14792
机型
未知设备
签到次数
55
MIUI版本
9.3.14
私信

MIUI七周年MIUI 7MIUI五周年关注微信极客勋章关注腾讯微博关注新浪微博

2015-8-18 15:08 | 来自PC
|
不明觉厉!!!!

玩机大师

Rank: 4

积分
1266
机型
未知设备
签到次数
96
MIUI版本
9.2.28
私信
2015-8-18 15:10 | 来自APP
|

玩机狂人

Rank: 3Rank: 3

积分
232
机型
未知设备
签到次数
32
MIUI版本
5.7.27
私信
2015-8-18 15:30 | 来自PC
|
感谢分享!

玩机之王

Rank: 5Rank: 5

积分
2257
机型
未知设备
签到次数
114
MIUI版本
7.2.16
私信
2015-8-18 20:35 | 来自PC
|
编辑器什么时候出哇

玩机之王

Rank: 5Rank: 5

积分
3159
机型
红米Note-4G版
签到次数
0
MIUI版本
0
私信

MIUI五周年关注微信极客勋章关注腾讯微博关注新浪微博

2015-8-18 22:01 | 通过手机发布
|
支持

玩机之王

Rank: 5Rank: 5

积分
3025
机型
未知设备
签到次数
12
MIUI版本
V8.0.1.0.KXCCNDG
私信

MIUI 7MIUI五周年极客勋章关注微信关注腾讯微博关注新浪微博

2015-8-21 12:47 | 通过手机发布
|
支持一个

内测粉丝组

Rank: 6Rank: 6

积分
4371
机型
未知设备
签到次数
149
MIUI版本
9.4.18
私信

“澎湃S1 ”芯片纪念勋章APP 1000万MIUI 3000万MIUI 2000万MIUI三周年关注微信极客勋章关注腾讯微博关注新浪微博发烧友俱乐部

2015-8-22 23:02 | 来自PC
|
816说的编辑器呢?

玩机狂人

Rank: 3Rank: 3

积分
248
机型
未知设备
签到次数
3
MIUI版本
9.5.23
私信
2015-8-24 23:56 | 通过手机发布
|
sfuufchkpfsx

玩机小白

Rank: 1

积分
40
机型
未知设备
签到次数
0
MIUI版本
5.10.22
私信
2015-8-27 10:03 | 来自PC
|
有个疑问,这些不同的分辨率是否一定需要使用不同分辨率的真机进行测试?
快速回复 返回顶部 返回列表