最近在讀谷歌的material design設(shè)計(jì)指南查库，根據(jù)自己的理解將其整理下來，方便之后查閱骡和。
material design，可稱為材質(zhì)化設(shè)計(jì)相寇，是谷歌創(chuàng)造的一種新的視覺語言慰于，主要目標(biāo)有兩個(gè)，一是希望將科技創(chuàng)新與傳統(tǒng)設(shè)計(jì)進(jìn)行融合唤衫，從而打通物理世界和虛擬世界东囚；二是希望能在不同的平臺(tái)和設(shè)備之間構(gòu)造一致的體驗(yàn)。這兩點(diǎn)在整個(gè)設(shè)計(jì)規(guī)范中得到了很好的體現(xiàn)战授。
基本構(gòu)成：
材質(zhì)是核心页藻，傳統(tǒng)的設(shè)計(jì)準(zhǔn)則是框架，動(dòng)畫是靈魂
1植兰、 材質(zhì)：
材質(zhì)份帐，是真實(shí)世界的隱喻￠沟迹基于物理世界的觸感废境，啟發(fā)于紙張和墨水的表現(xiàn)形式，發(fā)展于科技以及想象力。
基于物理世界能讓用戶快速地理解其功能可用性噩凹，當(dāng)然巴元，除了物理世界的簡(jiǎn)單映射外，還創(chuàng)造了一些新的功能可用性驮宴，巧妙地取代了物理世界但是又沒有打破其基本的規(guī)律逮刨。下面會(huì)對(duì)材質(zhì)做詳細(xì)的介紹。
2堵泽、設(shè)計(jì)：
傳統(tǒng)印刷設(shè)計(jì)中的文字排版修己、網(wǎng)格、尺寸迎罗、顏色睬愤、圖像等，搭建了材質(zhì)化設(shè)計(jì)的基本框架纹安。這些不只是為了好看尤辱，更重要的是能夠組織信息并對(duì)用戶做出引導(dǎo)。通過創(chuàng)造層級(jí)關(guān)系厢岂，獲取視覺焦點(diǎn)啥刻，有意識(shí)地突出某些元素等，提高用戶體驗(yàn)咪笑。
3可帽、運(yùn)動(dòng)：
動(dòng)態(tài)能夠賦予設(shè)計(jì)更多的意義，更好地表現(xiàn)元素自身以及元素之間的關(guān)系窗怒，更好地提高用戶的關(guān)注度映跟，從而提升用戶體驗(yàn)。
運(yùn)動(dòng)多數(shù)是由用戶發(fā)起的扬虚，能夠提高用戶對(duì)應(yīng)用的掌控感努隙。
運(yùn)動(dòng)的前提是盡量不打斷用戶體驗(yàn)的持續(xù)性，特別是在變換和重新組織內(nèi)容時(shí)辜昵。
材質(zhì)詳細(xì)介紹
從三個(gè)方面介紹：環(huán)境荸镊、物理屬性、運(yùn)動(dòng)屬性
下面的物體或者材質(zhì)都是同一個(gè)意思堪置。
1躬存、環(huán)境
這是一個(gè)三維的空間，材質(zhì)舀锨、光線岭洲、投影是這個(gè)空間最基本的東西。
在這個(gè)三維空間中坎匿，X軸水平盾剩，Y軸豎直向上雷激，Z軸是垂直于屏幕。
光源分為兩種告私，主光源和環(huán)境光屎暇。
主光源有一定的方向，會(huì)在物體上產(chǎn)生定向的陰影驻粟，環(huán)境光沒有方向根悼，會(huì)在物體四周造成較為柔和的陰影。
2格嗅、物理屬性（基礎(chǔ)的番挺、高度唠帝、陰影屯掖、相對(duì)關(guān)系）
- 材質(zhì)的長寬可以任意設(shè)置，但是厚度不變襟衰，都為1dp贴铜。
- 材質(zhì)的形狀和顏色都可以改變，以承載不同的內(nèi)容瀑晒，這些內(nèi)容不會(huì)對(duì)材質(zhì)的厚度造成影響绍坝。內(nèi)容可以在材質(zhì)內(nèi)自由變換，行為獨(dú)立于材質(zhì)苔悦。
- 材質(zhì)是固體的轩褐，意味著不能穿過其他材質(zhì)，不能與其他材質(zhì)發(fā)生重疊玖详，輸入事件不能穿過材質(zhì)把介，比如各種手勢(shì)，只能影響位于前面的材質(zhì)蟋座。
- 高度：
指兩個(gè)物體在z軸上的距離拗踢，單位是dp，因?yàn)椴馁|(zhì)是有厚度的向臀，所以測(cè)量是從一個(gè)材質(zhì)的頂部到另一個(gè)材質(zhì)的頂部巢墅。
1）靜止高度：
或者稱為默認(rèn)高度。所有的物體都有靜止高度券膀。當(dāng)高度發(fā)生變化后君纫，應(yīng)盡快回到靜止高度。桌面端的靜止高度比表格中列出的要低2dp芹彬，這樣更適用于鼠標(biāo)以及其他非觸摸式環(huán)境庵芭。
2）控件高度：
控件在不同的app之間有一致的靜止高度，在不同的平臺(tái)和設(shè)備之間會(huì)有所不同雀监。組件有動(dòng)態(tài)補(bǔ)償高度双吆，指的是當(dāng)組件響應(yīng)用戶的輸入時(shí)眨唬，發(fā)生的高度上的改變，同樣的好乐，每種組件的動(dòng)態(tài)補(bǔ)償高度也是一致的匾竿。
在輸入事件完成或者取消之后，組件要回到原來的靜止高度蔚万。
3）避免干擾：
由于動(dòng)態(tài)補(bǔ)償高度的存在岭妖，組件會(huì)離開原來的位置，有時(shí)會(huì)與其他組件相互干擾反璃。這是需要避免的昵慌，思路如下：1、在組件層面上淮蜈，在發(fā)生干擾之前斋攀，相應(yīng)的組件移開進(jìn)行避讓，在事件完成后回到原位梧田。2淳蔼、在框架層面上，盡量將有可能產(chǎn)生干擾的組件分開裁眯，避免干擾的發(fā)生鹉梨。
- 陰影
陰影取決于物體的高度，物體越高穿稳，陰影越大存皂。反之，陰影也可以反映物體的高度逢艘，除此之外旦袋，還能表示物體之間的關(guān)系，區(qū)分不同的物體埋虹，也可以用來辨別同個(gè)物體前后的變化猜憎。需要注意一點(diǎn)的是，陰影是與位置緊密聯(lián)系了搔课，不要單純?yōu)榱烁淖冴幱岸淖儭?br> 因?yàn)楦叨葲Q定了陰影胰柑，而且控件都有默認(rèn)的高度，因此也有了默認(rèn)的陰影爬泥〖硖郑控件也有動(dòng)態(tài)補(bǔ)償高度，相應(yīng)的也有對(duì)應(yīng)的陰影大小袍啡。下面是一些例子踩官，具體可以在官方文檔中查看。https://material.google.com/what-is-material/elevation-shadows.html#elevation-shadows-shadows
- 物體關(guān)系
1境输、父子關(guān)系：每個(gè)物體都有一個(gè)父級(jí)蔗牡，每個(gè)物體都有多個(gè)子級(jí)颖系，子級(jí)從父級(jí)繼承了其變換屬性，就是說子級(jí)會(huì)跟父級(jí)一起運(yùn)動(dòng)辩越。
2嘁扼、同胞關(guān)系：擁有同一個(gè)父級(jí)的稱為同胞關(guān)系。
子級(jí)在的位移受到父級(jí)的限制黔攒。物體不能插入別的父子級(jí)之中
3趁啸、運(yùn)動(dòng)屬性（變換屬性加移動(dòng)屬性）
- 物體可以動(dòng)態(tài)地改變形狀，可以在所處的平面上放大縮小督惰，甚至憑空地消失和出現(xiàn)不傅。
- 物體不能彎曲和折疊
- 多個(gè)物體可以連接在一起，也可以拆分開來形成多個(gè)獨(dú)立的物體赏胚。
- 材質(zhì)可以同時(shí)沿多個(gè)軸移動(dòng)访娶，不用局限于簡(jiǎn)單的單向移動(dòng)。
（這里好像不能附gif圖栅哀，有興趣的可以直接到官網(wǎng)上看相應(yīng)的演示）https://material.google.com/what-is-material/material-properties.html#material-properties-transforming-material
