Android 布 局 翻 译 器
标签（空格分隔）： 2020
0x1、引言
2333，看这标题就知道不是什么正经技术文章，花了点时间，写了个「无用良品」，以后请叫我「Android界爱迪生——樊少皇」，蟹蟹~
最近公司APP版本迭代，一个人写界面，写到我真的想吐：
有些路人可能会说：不喜欢写，你不会拖拉控件吗，憨憨。
可能各位都是：i9 9900K，850 PRO，64G DDR4，拖拽控件丝滑流畅，不知人间疾苦...
如果您像小弟一样用着公司配的：i3家用台式机，你也会秒变「祖安人」
拖拽卡顿不灵活不说，拖拽完还得进代码调来调去，有时效率还不如手敲。
Google很久以前出的ConstraintLayout约束布局是挺好用的，就是要写多一堆属性，比如每个控件必不可少的：
虽说AS自动补全，但是写起来，效率并不是很高。作为一个「具有4点多堆砌布局经验的Android开发仔」一个重要的标准就是：看到一个设计图，立马在心中解析出「页面布局的层次结构」比如这样的个人中心的页面：
直接解析：
约束布局
相对布局
回退- Button
标题-TextView
卡片视图
约束布局
头像-ImageView
登陆提示-TextView
更多箭头-ImageView
卡片视图
约束布局
订单图标-ImageView
订单文本-TextView
订单更多-ImageView
兑换图标-ImageView
兑换文本-TextView
兑换更多-ImageView
...略
解析倒是挺简单，不顾敲起来，大部分是机器式重复，。前不久在逼乎上看到这段话：
觉得还挺有道理，着实需要一种智识和能力去改进，从这样的「时间泥潭」中跳出。
脑海中萌生了「模板代码」思路：
和AS自带新建布局模板的方式有点不一样，精确到控件级别，用 关键字匹配 控件对应的模板代码。
当我输入tv的时候，导入对应的一大串代码，输入tvc的时候导入另一串代码。
不过这个思路在我写完一个TextView后就放弃了，TM的那么多控件，要写多少套，而且很多属性是多余的...
这种思路妥妥滴不行，于是又萌生了另一种思路：
「定义一套自己的语法规则，写少量，用脚本翻译成AS里的XML文件」
啧啧啧，这样也意味着可以
「可以脱离Android Studio写布局文件，而且比一个个字母手敲xml高效！」
想想，你可以「在地铁上用便签写布局，然后到公司用脚本直接翻译成XML布局」太酷了吧！
0x2、规律 => 规则
定义这套语法规则之前，我们先要了解一下xml布局的规律：
# XML由一个个标签(结点)构成，分为：单标签 和 双标签(可嵌套)，如：
综上，不难得出两个规律：
① 标签其实有三种：开标签，关标签，闭合标签，要进行区分
② 标签 = <控件名 若干属性:值>
另外，Android是建议，每个控件都设置一个id属性的，不难定义一个类来代表一个标签：
class Node:
def __init__(self, widget=None, id=None, kv=None):
self.widget = widget
self.id = id
self.kv = kv
1、标签的区分
上面也说了，标签由三种，这里引入三个符号来进行标记(+-*)，比如：
+ 线性布局
* 文本视图
- 线性布局
新建配置文件config.ini用于保存「自定义简称 与 控件的映射关系」
注意：这里的简称可以定义成你自己喜欢的，中文也行！
接着写个读取配置文件的脚本config_getter.py，读取下：
再接着新建一个输入源test.txt文件，内容如下：
最后写脚本读取txt文件，按行读取，过滤空格和换行，根据字符串第一个字符进行过滤：
运行后可以看到输出的xml文件：
堆一起，看不出什么，格式化看看效果：
啧啧啧，有内味了。
2、属性
一个控件可以有多个属性，多个属性怎么进行分割呢？笔者用的是「>」
然后属性和值又怎么分割呢？本来是想用 :或| 的，后面发现都用到了，最后决定用「-」来分割。
一个简单的示例如下：
* bt > bt_back > w-56 > h-56 > t-返回
上述的代码代表：
定义一个按钮，id为bt_back，宽56dp，高56dp，文本为返回
另外，有些常用的属性-值，可以简化下，比如：
android:layout_width="wrap_content"
# 可以写成
w-wrap_content
# 简化
w-w
# 再简化
ww
用 ww 就可以代替：android:layout_width="wrap_content"
程序处理的时候需要对：w-w 和 ww进行区分，区分方法也很简单：
len(split("-")) == 1，说明是后者，否则是前者
啧啧啧，可以，继续~
3、值
值的情形稍微复杂一点，常见的有下面这些：
android:gravity="center|start"
android:layout_width="match_parent"
android:background="@drawable/ic_back_white"
android:layout_marginStart="60dp"
app:layout_constraintDimensionRatio="16:9"
其实划分下，笔者需要只需区分三种类型
- ① 直接填充 -> 属性="xxx"
- ② 数字dp -> 属性="xdp"
- ③ @资源引用 -> 属性="@x/y"
所以处理的流程：
Step 1：判断是否为数字，是的话加上dp，否则跳Step 2
Step 2：利用正则判断是否为@类型，是的话提取下类型与值，否则跳Step3
Step 3: 判断是否包含此属性，是填充模板，否则直接填充
也很简单，接下来就是写代码来组装我们的「老八秘制小汉堡」了！！！
0x3、组装老八秘制小汉堡
先是完善配置文件：config.ini
这里可以根据自己的习惯自定义在对应的区域，增加或者减少，动态配置~
在翻译脚本 AutoTranslate.py 的开头读取一波配置信息：
接着定义一个读取节点列表的方法：
再接着定义一个解析翻译结点内容的方法：
最后定义一个写入文件的方法：
接着花几分钟写个布局txt文件：
转换脚本调用下相关方法：
运行一波，可以看到生成了一个test.xml的布局文件，打开瞅瞅：
啧啧，格式化？
把xml复制到项目中，看看效果？
此处应该有掌声！啪啪啪！
0x4、奥利给，吃粑粑
脚本的大概雏形完成了，后面可以优化下交互和小细节，不过感觉没技术含量？巧了，最近在 刷题，加个算法耍耍？来个LeetCode原题「有效的括号」，题目描述如下：
就是 匹配符号开闭，跟我们这个场景非常相似哇，匹配开闭节点：
# 开闭节点需要一一对应，比如：
+ cly
- cly
# 多了少了，都不行(如下两种都是错误的)
+ cly
+ cly
- cly
+ cly
+ ly
- cly
- ly
怎么解决？最标准解法就是用 栈 了，比较简单，直接撸代码：
接着调用下：
故意写错结点，运行看看：
可以，大功告成~
0x5、小结
久违的摸鱼闲暇时光，给大家做了一个老八秘制作小，呸...
「Android布局翻译器」
有了它，你可以在上用文本编辑器，便签等来完成Android布局的编写。
当然，目前只是雏形，你可以根据自己需要，进行动态配置，优化等，以此提高你的效率~
此时我突然想起：曾扬言收购苹果，如今直播带货的老罗，当初提出的TNT系统，结合下这个脚本，
写布局完全可以靠喊：
文本框 > 居中 > 变黑 > 变大 > 加粗...
啧啧啧，有点意思，本节的一本正经的胡说八道到此结束，感谢阅读~
- Github仓库：https://github.com/coder-pig/AndroidLayoutTranslate