官網(wǎng)地址:https://material.io/guidelines/material-design/environment.html
Material design is a three-dimensional environment containing light, material, and cast shadows.
Material design是一個包含了光,材質(zhì),以及投影的三維環(huán)境。
All material objects have x, y, and z dimensions.
所有的material對象都有x,y,和z值。
All material objects have a single z-axis position.
所有的material對象都有一個唯一的z軸位置。
Key lights create directional shadows, and ambient light creates soft shadows.
主光線生成了定向陰影,背景光則生成了軟陰影。
Material thickness
Material的密度
1dp
Shadows
陰影
Shadows are created by the elevation difference between overlapping material.
兩個不同材料之間的高度生成了陰影。

Contents
目錄
3D world
Light and shadow
- 3D world
The material environment is a 3D space, which means all objects have x, y, and z dimensions. The z-axis is perpendicularly aligned to the plane of the display, with the positive z-axis extending towards the viewer. Every sheet of material occupies a single position along the z-axis and has a standard 1dp thickness, equivalent toone pixel of thicknesson screens with a pixel density of 160.
material環(huán)境是一個3D空間,這意味著所有的對象都有x,y和z值。z軸垂直于顯示的屏幕,正z軸的方向朝向用戶。每片材料沿z軸占據(jù)一個1dp厚度標準的單獨位置,相當于像素密度為160的厚度屏幕的像素。
On the web, the z-axis is used for layering and not for perspective. The 3D world is emulated by manipulating the y-axis.
在網(wǎng)頁上,z軸用于分層,而不用于透視。通過操縱y軸來模擬3D世界。
3D space with x, y, and z axes
3D空間擁有x,y和z

- Light and shadow
Within the material environment, virtual lights illuminate the scene. Key lights create directional shadows, while ambient light creates soft shadows from all angles.
在material環(huán)境中,虛擬光線照亮了屏幕。主光線生成了方向陰影,而周圍的光則從各個角度生成了軟陰影。
Shadows in the material environment are cast by these two light sources. In Android development, shadows occur when light sources are blocked by sheets of material at various positions along the z-axis. On the web, shadows are depicted by manipulating the y-axis only. The following example shows the card with a height of 6dp.
material環(huán)境中的陰影有這兩種光源產(chǎn)生。在Android的發(fā)展中,當沿著z軸的各個位置的光源受到材料片的阻擋時,就會產(chǎn)生陰影。在網(wǎng)絡上,僅通過操縱y軸來描繪陰影。下面的例子展示了6 dp高度時的卡片。

Shadow cast by key light
主光源生成的陰影

Shadow cast by ambient light
周圍光源生成的陰影

Combined shadow from key and ambient lights
聯(lián)合主光源和周圍光線生成的陰影