Enviroment

官網(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是一個(gè)包含了光破停,材質(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對象都有一個(gè)唯一的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.
兩個(gè)不同材料之間的高度生成了陰影。

what_is_material_environment.png

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)境是一個(gè)3D空間托享,這意味著所有的對象都有x,y和z值骚烧。z軸垂直于顯示的屏幕,正z軸的方向朝向用戶闰围。每片材料沿z軸占據(jù)一個(gè)1dp厚度標(biāo)準(zhǔn)的單獨(dú)位置赃绊,相當(dāng)于像素密度為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
whatismaterial_environment_3d.png
  • 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)境中,虛擬光線照亮了屏幕者冤。主光線生成了方向陰影肤视,而周圍的光則從各個(gè)角度生成了軟陰影。
    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ā)展中邢滑,當(dāng)沿著z軸的各個(gè)位置的光源受到材料片的阻擋時(shí),就會(huì)產(chǎn)生陰影愿汰。在網(wǎng)絡(luò)上困后,僅通過操縱y軸來描繪陰影。下面的例子展示了6 dp高度時(shí)的卡片衬廷。
whatismaterial_environment_shadow1.png

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

whatismaterial_environment_shadow2.png

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

whatismaterial_environment_shadow3.png

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

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末摇予,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子吗跋,更是在濱河造成了極大的恐慌侧戴,老刑警劉巖宁昭,帶你破解...
    沈念sama閱讀 222,378評論 6 516
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異酗宋,居然都是意外死亡积仗,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 94,970評論 3 399
  • 文/潘曉璐 我一進(jìn)店門蜕猫,熙熙樓的掌柜王于貴愁眉苦臉地迎上來寂曹,“玉大人,你說我怎么就攤上這事回右÷≡玻” “怎么了?”我有些...
    開封第一講書人閱讀 168,983評論 0 362
  • 文/不壞的土叔 我叫張陵楣黍,是天一觀的道長匾灶。 經(jīng)常有香客問我,道長租漂,這世上最難降的妖魔是什么阶女? 我笑而不...
    開封第一講書人閱讀 59,938評論 1 299
  • 正文 為了忘掉前任,我火速辦了婚禮哩治,結(jié)果婚禮上秃踩,老公的妹妹穿的比我還像新娘。我一直安慰自己业筏,他們只是感情好憔杨,可當(dāng)我...
    茶點(diǎn)故事閱讀 68,955評論 6 398
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著蒜胖,像睡著了一般消别。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上台谢,一...
    開封第一講書人閱讀 52,549評論 1 312
  • 那天寻狂,我揣著相機(jī)與錄音,去河邊找鬼朋沮。 笑死蛇券,一個(gè)胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的樊拓。 我是一名探鬼主播纠亚,決...
    沈念sama閱讀 41,063評論 3 422
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼筋夏!你這毒婦竟也來了蒂胞?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 39,991評論 0 277
  • 序言:老撾萬榮一對情侶失蹤条篷,失蹤者是張志新(化名)和其女友劉穎啤誊,沒想到半個(gè)月后岳瞭,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 46,522評論 1 319
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡蚊锹,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 38,604評論 3 342
  • 正文 我和宋清朗相戀三年瞳筏,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片牡昆。...
    茶點(diǎn)故事閱讀 40,742評論 1 353
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡姚炕,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出丢烘,到底是詐尸還是另有隱情柱宦,我是刑警寧澤,帶...
    沈念sama閱讀 36,413評論 5 351
  • 正文 年R本政府宣布播瞳,位于F島的核電站掸刊,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏赢乓。R本人自食惡果不足惜忧侧,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 42,094評論 3 335
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望牌芋。 院中可真熱鬧蚓炬,春花似錦、人聲如沸躺屁。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,572評論 0 25
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽犀暑。三九已至驯击,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間耐亏,已是汗流浹背徊都。 一陣腳步聲響...
    開封第一講書人閱讀 33,671評論 1 274
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留苹熏,地道東北人碟贾。 一個(gè)月前我還...
    沈念sama閱讀 49,159評論 3 378
  • 正文 我出身青樓币喧,卻偏偏與公主長得像轨域,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個(gè)殘疾皇子杀餐,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,747評論 2 361

推薦閱讀更多精彩內(nèi)容

  • 1.Introduction - 介紹 We challenged ourselves to create a v...
    兩個(gè)朋友指甲閱讀 1,354評論 0 5
  • MD干发,視覺語言,它所設(shè)計(jì)的世界史翘,來源于真實(shí)的物理現(xiàn)實(shí)(降低用戶的學(xué)習(xí)成本枉长,使其快速上手)冀续,但又高于現(xiàn)實(shí)(大膽而理想...
    Rangethan閱讀 1,980評論 0 2
  • 天下之事,分合交替必峰,分久必合洪唐,合久必分。 夏一統(tǒng)吼蚁,商周繼之凭需,春秋戰(zhàn)國亂之;秦一統(tǒng)肝匆,兩漢繼之粒蜈,三國魏晉南北朝亂之;隋...
    百家和鳴閱讀 336評論 0 0
  • 魯迅說: 男人兩大愛好:拉良家婦女下水旗国;勸風(fēng)塵女子從良枯怖。 女人兩大愛好:和窮人總是在談錢;和富人談的全是感情能曾! 而...
  • 攔截器是指通過統(tǒng)一攔截從瀏覽器發(fā)往服務(wù)器的請求來完成功能的增強(qiáng) 應(yīng)用場景:解決一些共性問題度硝,比如權(quán)限驗(yàn)證、亂碼等 ...
    fangzy0723閱讀 868評論 1 1