Material Design – 环境

环境

Meterial Design是一个包含光,实体以及投影的三维环境。

所有实体对象均包含x,y,z三个维度。
所有实体对象均有一个唯一的z轴位置。
主光源产生定向阴影,环境光源产生柔和阴影。

实体厚度
1dp

阴影
阴影由实体重叠区域的不同高度产生

三维空间

物质世界是一个三维空间,换句话说其意味着所有的对象包含x,y,z三个维度。z轴垂直于显示平面,正向z轴向着观察者进行延伸。实体的每一个单元在z轴均占据着唯一的且标准的1dp厚度,相当于在每英寸160点的显示器上的1px。

在网页上,z轴通常用来进行分层而不是透视。而在三维空间则通过y轴来进行模拟。

x,y,z轴三维空间

光和阴影

在实体环境下,虚拟光源照亮整个场景。主光源产生定向的阴影,环境光源则从所有的角度产生柔和阴影。

实体环境中的阴影由两种光源共同投射产生。在Android开发中,当光源沿z轴被实体对象不同位置阻挡时便会产生阴影。在网页中,阴影则仅通过操作z轴加以控制。下面便是一个6dp高的卡片阴影示例。

主光源直射产生的阴影

散光源照射产生的阴影

主光源和散光源共同作用产生的阴影