简体中文
图层名称
现在表格结构已经规范,编译器也自动为单元格内容标识上了类型约束,接下来让我们把目光转到到设计稿的图层当中。
在设计稿开发过程中,我们通常会为每个图层单独命名,这样可以更好地理解设计稿结构,从而迅速的了解整体内容。
聪明的人是如此,笨笨的编译器亦是如此。
还记得唯一定位一个单元格所需要的条件吗?不记得的话,可以回顾一下上一节的内容。
在插入数据之前,编译器必须知道操作图层的单元格位置,这个位置由四个参数来确定:表名、页名、行号、列号
。
表名
在我们选中表格的时候已明确指定,剩余三个参数则是由每个图层的名称来告知编译器。
TIP
不必担心规则太多, 插件支持便捷的图层重命名操作,你只需要了解一下即可。
基本规则
其实非常简单, 基本三条规则如下
//
约定页名: 例如容器名//常用
表示从名称为常用
的页中获取单元格数据#
约定列名: 例如容器名#姓名
表示从名称为姓名
的列中获取单元格数据*
限制子容器同一行内数据取值: 例如容器名#姓名 *
表示从名称为姓名
的列中获取单元格数据,且其所有子容器都必须在此同一行单元格内取值
取值顺序
下面引入取值角标,代表不同的数据获取方式
.n
为默认值,不写也是可以的,表示每次后都是从当前行的下一行开始取值.i
表示每次都是从当前行的下一行开始取值,且会忽略空值.x
标识每次都是随机取值.r
表示每次都是随机取值,且会忽略空值.numeber
表示都是在第number
行取值
简单组合
角标主要与 #
约定列名一起使用,例如
#姓名
表示从名称为姓名
的列中获取单元格数据,且每次都是从当前行的下一行开始取值#姓名.n
(跟上面一样...) 表示从名称为姓名
的列中获取单元格数据,且每次都是从当前行的下一行开始取值#姓名.i
表示从名称为姓名
的列中获取单元格数据,且每次都是从当前行的下一行开始取值,且会忽略空值#姓名.x
表示从名称为姓名
的列中获取单元格数据,且每次都是随机取值#姓名.2
表示从名称为姓名
的列中获取单元格数据,且都是在第2
行取值#姓名.r
表示从名称为姓名
的列中获取单元格数据,且每次都是随机取值,且会忽略空值
角标.numeber
也可以和 *
一起使用
假设设计稿内图层结构如下
md
- *.2 #背景图
- #邮件内容
- #发件人
- #收件人
其表示的意思是,#背景图
从第 2
行开始取值,且其所有子容器都必须在第二行单元格内取值
TIP
此处的 *
限制子容器同一行内数据取值,是为了保证设计稿内的内容单元的完整匹配性质, 例如 #发件人
和 #收件人
必须在同一行单元格内取值, 这样就保证二者的内容是完整匹配的
原插件仅对instance容器实现此特性,这里通过引入 *
,实现了对所有容器的支持
复合特征
一个特征就对应一个(类型约束后的)单元格,一个图层又具备多种特征,例如:文本层具有文本内容,字体颜色,字体大小等等不同特征。
自然一个图层名中就允许包括对多个单元格的引用,例如:#字体 #字号 #颜色
,这样就可以从三个不同的单元格中获取数据,然后组合成一个文本样式, 例如 宋体 常规体 20px #333333
这里的 #字体 #字号 #颜色
就是一个复合特征,其对应的单元格数据会被组合成一个文本样式,然后赋值给图层的文本样式属性
注意:复合特征只能组合不同类型的单元格,例如:#字体 #字号 #颜色
是合法的,但是 #字体 #字号 #其他字体
就是非法的,因为 #字体
,#其他字体
都是在映射字体
如果真的遇到类型撞车,编译器会让后者会覆盖掉前者,上面例子最终的文本样式就是 #字号 #其他字体
取值继承
只有三条规则:
- 父容器名称中的
//
和*
会自动继承给子容器 - 子容器的
//
可以覆盖父容器的//
- 子容器的
*
无法覆盖父容器的*
还是举栗子吧
markdown
- *.2 #背景图 //常用
- #邮件内容
- #发件人
- #收件人
上述图层结构中,父容器的 *.2
和 //常用
会自动继承给其子容器,所以 #邮件内容
、#发件人
、#收件人
都会在常用
页面下第二行取值
markdown
- *.2 #背景图 //常用
- #邮件内容
- #发件人
- #收件人
- #其他 //特殊
- #其他1
- #其他2
上述图层结构中,子容器的 //特殊
会覆盖父容器的 //常用
,所以 其他
、#其他1
、#其他2
都会在特殊
页面下取值
markdown
- *.2 #背景图 //常用
- #邮件内容 *.3
- #开头
- #结尾
- #发件人
- #收件人
上述图层结构中,子容器的 *.3
无法覆盖父容器的 *.2
,所以 #邮件内容
、#开头
、#结尾
依旧会在常用
页面下第二行取值