環(huán)境

Material design 是一個包含光線、材料和投射陰影的三維環(huán)境。

所有的材料對象都包含 x、y、z 三個維度。

所有的材料對象都有一個 Z 軸厚度。

主光源投射出一個定向的陰影，而環(huán)境光從各個角度投射出連貫又柔和的陰影。

材料的厚度

1dp

陰影

陰影是不同高度的材料相互疊加所產(chǎn)生的。

3D 世界

材料所處的環(huán)境是一個 3D 空間，這意味著每個對象都有 x、y、z 三維坐標(biāo)屬性，z 軸垂直于顯示平面，并延伸向用戶視角，每個材料都有 z 軸厚度，標(biāo)準(zhǔn)是 1dp，相當(dāng)于一個屏幕密度為 160 的設(shè)備上的一像素。

在網(wǎng)頁上，z 軸被用來分層而不是為了視角。3D 空間通過操縱 y 軸進(jìn)行仿真。

光線和陰影

在材料環(huán)境中，虛擬的光線照射使場景中的對象投射出陰影，直射光投射出一個定向的陰影，而環(huán)境光從各個角度投射出連貫又柔和的陰影。

材料環(huán)境中的所有陰影都是由這兩種光投射產(chǎn)生的，陰影是光線照射不到的地方，因為各個元素在 z 軸上占據(jù)了不同大小的位置，遮住了這些光線。在網(wǎng)頁上，陰影的實現(xiàn)是在 y 軸上使用多重陰影。下面的案例中，卡片的高度是 6dp。

直射光投射的陰影

環(huán)境光投射的陰影

直射光和環(huán)境光混合投影