千叶主题工作室
MAML 教程【总】2015.01.01
From http://www.miui.com/thread-2196783-1-1.html
By-MI-谢
整理-千叶
千叶
2015/3/29
MAML 教程【总】2015.01.01 目录
MAML 之【前(tu)言(cao)】 ..................................................................................................... 0
[制作教程] MAML 之【MORE 渲染引擎】........................................................................... 0
MAML 之【百变锁屏 Lockscreen】....................................................................................... 2
MAML 之【百变壁纸 MiWallpaper】....................................................................................2
MAML 之【百变图标 Icon】 ..................................................................................................2
MAML 之【自由桌面 scene】*TODO.................................................................................... 3
MAML 之【所有元素】*TODO................................................................................................5
MAML 之【全局变量 #】....................................................................................................... 5
MAML 之【表达式】 ............................................................................................................... 8
MAML 之【变量 Var VarArray】 .............................................................................................9
MAML 之【壁纸 Wallpaper】.............................................................................................. 10
MAML 之【文本 Text】.........................................................................................................10
MAML 之【时间 Time DateTime】 ...................................................................................... 11
MAML 之【图片 Image ImageNumber Mask】 ...................................................................13
MAML 之【按钮 Button】....................................................................................................14
MAML 之【音乐 MusicControl 】....................................................................................... 15
MAML 之【滑块 Slider】......................................................................................................16
MAML 之【组 Group】.........................................................................................................19
MAML 之【绑定变量源 VariableBinders】......................................................................... 19
MAML 之【传感器 SensorBinder】 ..................................................................................... 21
MAML 之【内容提供 ContentProviderBinder】................................................................. 22
MAML 之【网络服务 WebServiceBinder】 .........................................................................24
MAML 之【广播 BroadcastBinder】.................................................................................... 25
MAML 之【自定义 Config】.................................................................................................26
MAML 之【动态帧率 FramerateController】......................................................................28
MAML 之【动画 Animation】 .............................................................................................. 29
如何“快速”制作一款 MIUI 锁屏?(forBeginner).............................................................30
如何看待“盗用原作”提交到市场的收费主题?.................................................................. 31
如何正确地添加文字到 MIUI 锁屏?....................................................................................31
如何正确地添加图片到 MIUI 锁屏?....................................................................................32
如何正确地使用 Command 在 MIUI 锁屏?.........................................................................34
如何正确地控制动画在 MIUI 锁屏?....................................................................................37
如何正确地实现动画在 MIUI 锁屏 2?.................................................................................40
做好一款 WP8 锁屏,需要的是坚持。.............................................................................. 44
MAML 与 【动效设计】的思考 *TODO............................................................................. 45
MAML 与 【乐高积木】 的思考 *todo............................................................................. 46
1
MAML 之【前(tu)言(cao)】
写在前面
为什么官方没有系统整理主题制作的"完整"教程?
不知道!
为什么官方没有提供一份"规范"的 MAML 脚本帮助文档?
不知道
为什么目前的主题大部分“好看却不好用”?
写代码,没好文献。做主题,没好工具。永远停留在变脸的时代!
为什么学习 MIUI 主题制作门槛比较高?
设计师不喜欢写代码!
为什么人们接受付费主题,却不接受付费软件?
视觉优先原则的生物。
动效设计在百变框架下面的实现,必要么?
必要,要不然很难用。只可惜 maml 要达成 framer.js 一样的高度,还有很远的距离啊。
百变框架下,我们究竟能最大限度的做多少事?
官方把控,可怜的情报都是仅凭网友经验。
…………………………………………………………
对于绝大多数的主题设计师来说,编码绝对是他们的痛。何况官方还没有给一份像样子的帮
助文档,只有论坛里一堆经验帖和 wiki 上排版让人着急的文档。另外,主题编辑器目前仍
处于简单替换图片或某些参数功能的阶段。压根就没有代码编辑功能,因此也就出现了“好
看却不好用”的现状。
对设计师而言,一需要编码,学习曲线陡峭。二没有好工具,制作周期长。三参考文献少,
创作受限。ps.我想这也是自由桌面一直没能像百变锁屏推出时那样受人欢迎吧。
…………………………………………………………
so.那么问题来了,该不该学 maml 脚本语言呢?当然啦!
总之,重新整理文档原因有下:
规范排版,以便查阅
发帖交流,挖掘坑爹的情报!ps.谁叫官方从来都不出一份正经的完整参数文档。
求关注,求完善,求官方开发组可怜可怜我们一群设计师吧π_π
[制作教程] MAML 之【MORE 渲染引擎】
简单地来说:
MORE 就是基于“标记语言”的渲染引擎,MAML 就是 MIUI MORE 渲染引擎的脚本语言。
使用了 MORE 渲染引擎,MIUI 主题模块:(MAML 脚本编写)
•百变锁屏 com.android.internal.policy.impl.AwesomeLockScreen
•桌面时钟 com.miui.home.launcher.gadget.AwesomeClock
1
•相框小工具 com.miui.home.launcher.gadget.PhotoFrame
•闹钟响铃界面 com.android.deskclock.AlarmAlertFullScreen
•自由桌面动态小部件 com.miui.home.launcher.gadget.AwesomeGadget
•百变壁纸 com.miui.home.launcher.MiWallpaper (基于 SurfaceView)
•动态图标
•天气小工具 com.miui.home.launcher.gadget.Weather_2x4_custom (v4)
在这个渲染框架下,我们能干些什么?
•展示信息(图片、文字、声音)
•添加动画(大小、位置、透明、旋转、源)
•简单交互(拖拽、点击、按键)(接收来自用户、系统的动作或参数,触发执行命令)
•自制控件*
学会 MAML 脚本,我们在哪写代码?
百变锁屏:主题包文件夹/lockscreen/advance/manifest.xml 中,
...
百变壁纸:主题包文件夹/miwallpaper/manifest.xml 中,
...
百变图标:主题包文件夹/icons/fancy_icons/应用对应的文件夹/manifest.xml 中,
...
百变时钟:主题包文件夹/clock_2x4 或 clock_2x2 或 clock_1x2/manifest.xml 中,
...
百变相框:主题包文件夹/photoframe_2x2 或 photoframe_2x4 或 photoframe_4x4/manifest.xml,
百变闹钟:主题包文件夹/alarmscreen/manifest.xml 中,
...
自由桌面:主题包文件夹/com.miui.home.freestyle/description.xml 中,
...
statusbar_clock:主题包文件夹/com.android.systemui/res/raw/statusbar_clock.maml •
statusbar_clock.maml 改后缀 .zip 解压,编辑 manifest.xml 中,
...
•多个文件以 zip 压缩方式打包成.maml 文件 (不是压缩 statusbar_clock 文件夹,而是里面
多个文件)
statusbar_music:主题包文件夹/com.android.systemui/res/raw/statusbar_music.maml 同上
powermenu:/system/media/theme/default/powermenu
•powermenu 加后缀.zip 解压,编辑 manifest.xml 中,
...
•多个文件以 zip 压缩方式打包成 powermenu 文件 (去掉后缀即可)
•重启手机应用才能成功*
1
useVariableUpdater = "Battery, DateTime.Hour,DateTime.Minute,DateTime.Second"
或"none"指定不更新。
如果需要显示系统电量并且每小时更换图片,
useVariableUpdater="Battery,DateTime.Hour"。
如果需要每秒进行多次刷新,可以直接使用 frameRate
// 图标大小
width
height
screenWidth="720"
hideApplicationMessage="false" (默认)
// 指定屏幕宽度
// 屏蔽右上角的通知标志
MAML 之【自由桌面 scene】*TODO
自由桌面 scene
基本框架:com.miui.home.freestyle/文件夹下:
/skins
/stage_images
/tools
文件夹主要存放自由部件(png 切图)
文件夹主要存放场景图(壁纸)
文件夹主要存放小工具(音乐插件等)
/description.xml
描述文件,对自由桌面的宽高、类型的定义
description.xml 文件配置:
1.
2.
3.
4.
5.
6.
7.
- 自由桌面分为 drift、background、foreground、dock 四层。
可以将部件添加在:
drift 层 可随意移动,可点击;
background 层 不可移动,不可点击;
foreground 层 不可移动,可点击;
dock 层
通常会选择 drift 层。
跟随屏幕移动而移动,例如桌面底部拨号联系人图标。
- 添加 部件功能:
无功能:用户可以在自由桌面中为它添加功能。
打开 APP:为部件预设打开指定的应用,但用户在自由桌面内也可以自由更改。
抽屉:打开所有应用列表。
快捷开关:与桌面快捷开关相同。
文件夹:将部件设置为文件夹功能。
3
16.
17.
18.
19.
20.
21.
22.
MAML 之【所有元素】*TODO
根据“坑爹的官方提供 alpha 版文档”可以得到以下情报:
---------------------------------------------------
0.壁纸......
1.文本......
2.时间......
、
3.图片......
、
4.变量......
5.按钮......
6.滑块......
7.组........
8.音乐......
9.帧率......
10.变量绑定.
---------------------------------------------------
不可见
不可见
不可见
不可见
不可见
不可见
11.oneMoreThing...待补充!
y="60" w="120"
sweep="-360*(1-#progress)"
x="60"
h="120"
startAngle="-90"
MAML 之【全局变量 #】
Unlocker:(Slider)
5