1厦滤、Material Design概述
我們挑戰(zhàn)自我箱舞,為用戶創(chuàng)造了嶄新的視覺設(shè)計(jì)語(yǔ)言。與此同時(shí)裤翩,新的設(shè)計(jì)語(yǔ)言除了遵循經(jīng)典設(shè)計(jì)定則资盅,還汲取了最新的科技,秉承了創(chuàng)新的設(shè)計(jì)理念踊赠。這就是原質(zhì)化設(shè)計(jì)(Material Design)呵扛。這份文檔是動(dòng)態(tài)更新的,將會(huì)隨著我們對(duì) Material Design 的探索而不斷迭代筐带、升級(jí)今穿。
目標(biāo)
我們希冀創(chuàng)造一種新的視覺設(shè)計(jì)語(yǔ)言,能夠遵循優(yōu)秀設(shè)計(jì)的經(jīng)典定則伦籍,同時(shí)還伴有創(chuàng)新理念和新的科技蓝晒。
我們希望創(chuàng)造一種獨(dú)一無二的底層系統(tǒng),在這個(gè)系統(tǒng)的基礎(chǔ)之上帖鸦,構(gòu)建跨平臺(tái)和超越設(shè)備尺寸的統(tǒng)一體驗(yàn)芝薇。遵循基本的移動(dòng)設(shè)計(jì)定則,同時(shí)支持觸摸富蓄、語(yǔ)音剩燥、鼠標(biāo)、鍵盤等輸入方式立倍。
設(shè)計(jì)原則
實(shí)體感就是(通過設(shè)計(jì)方式來表達(dá))隱喻
通過構(gòu)建系統(tǒng)化的動(dòng)效和空間合理化利用,并將兩個(gè)理念合二為一侣滩,構(gòu)成了實(shí)體隱喻口注。與眾不同的觸感是實(shí)體的基礎(chǔ),這一靈感來自我們對(duì)紙墨的研究君珠,但是我們相信寝志,隨著科技的進(jìn)步,應(yīng)用前景將不可估量。
實(shí)體的表面和邊緣提供基于真實(shí)效果的視覺體驗(yàn)材部,熟悉的觸感讓用戶可以快速地理解和認(rèn)知毫缆。實(shí)體的多樣性可以讓我們呈現(xiàn)出更多反映真實(shí)世界的設(shè)計(jì)效果,但同時(shí)又絕不會(huì)脫離客觀的物理規(guī)律乐导。
光效苦丁、表面質(zhì)感、運(yùn)動(dòng)感這三點(diǎn)是解釋物體運(yùn)動(dòng)規(guī)律物臂、交互方式旺拉、空間關(guān)系的關(guān)鍵。真實(shí)的光效可以解釋物體之間的交合關(guān)系棵磷、空間關(guān)系蛾狗,以及單個(gè)物體的運(yùn)動(dòng)。
鮮明仪媒、形象沉桌、深思熟慮
新的視覺語(yǔ)言,在基本元素的處理上算吩,借鑒了傳統(tǒng)的印刷設(shè)計(jì)——排版蒲牧、網(wǎng)格、空間赌莺、比例冰抢、配色、圖像使用——這些基礎(chǔ)的平面設(shè)計(jì)規(guī)范艘狭。在這些設(shè)計(jì)基礎(chǔ)上下功夫挎扰,不但可以愉悅用戶,而且能夠構(gòu)建出視覺層級(jí)巢音、視覺意義以及視覺聚焦遵倦。精心選擇色彩、圖像官撼、選擇合乎比例的字體梧躺、留白,力求構(gòu)建出鮮明傲绣、形象的用戶界面掠哥,讓用戶沉浸其中。
Material Design設(shè)計(jì)語(yǔ)言強(qiáng)調(diào)根據(jù)用戶行為凸顯核心功能秃诵,進(jìn)而為用戶提供操作指引续搀。
有意義的動(dòng)畫效果
動(dòng)畫效果(簡(jiǎn)稱動(dòng)效)可以有效地暗示、指引用戶菠净。動(dòng)效的設(shè)計(jì)要根據(jù)用戶行為而定禁舷,能夠改變整體設(shè)計(jì)的觸感彪杉。
動(dòng)效應(yīng)當(dāng)在獨(dú)立的場(chǎng)景呈現(xiàn)。通過動(dòng)效牵咙,讓物體的變化以更連續(xù)派近、更平滑的方式呈現(xiàn)給用戶,讓用戶能夠充分知曉所發(fā)生的變化洁桌。
動(dòng)效應(yīng)該是有意義的渴丸、合理的,動(dòng)效的目的是為了吸引用戶的注意力战坤,以及維持整個(gè)系統(tǒng)的連續(xù)性體驗(yàn)曙强。動(dòng)效反饋需細(xì)
2、MaterialDesign的使用及開發(fā)
谷歌開放以及收集了一些最新的開源的項(xiàng)目(很多是自己開發(fā)的)途茫,匯集到最新的support兼容支持包以及最新的5.X API里面碟嘴。
(preference:設(shè)置頁(yè)面,可以通過配置文件達(dá)到界面設(shè)計(jì)的效果囊卜。)
1)android-support-v4:最低兼容到Android 1.6系統(tǒng)娜扇,里面有類似ViewPager等控件。
2)android-support-v7:appcompat栅组、CardView雀瓢、gridlayout、mediarouter玉掸、
palette刃麸、preference、recyclerView(最低兼容到3.0)
最低兼容到Android 2.1的系統(tǒng)司浪,這個(gè)工程可以讓開發(fā)人員統(tǒng)一開發(fā)標(biāo)準(zhǔn)泊业,在任何的系統(tǒng)版本下保證兼容性。
(比如:Theme,value,布局啊易,新的控件吁伺,新的動(dòng)畫特效實(shí)現(xiàn))
所以現(xiàn)在ADT、AndrodStudio一般都會(huì)直接創(chuàng)建項(xiàng)目的時(shí)候就直接幫你新建或者引入了一個(gè)叫做appcompat的項(xiàng)目租谈。
這里可能會(huì)碰到很多問題:
1.自動(dòng)導(dǎo)入的appcompat-v7項(xiàng)目自身就是報(bào)錯(cuò)的篮奄,什么原因?build的版本太低了,要么是SDK很新但是兼容包沒有更新割去。
2.appcompat-v7好不容易沒報(bào)錯(cuò)窟却,但是項(xiàng)目報(bào)錯(cuò),一看控制臺(tái):報(bào)appcompat里面的某個(gè)res/values/theme/xxx屬性不存在 等等問題劫拗。
什么原因间校?因?yàn)槟阋氲氖呛苄碌腶ppcompat-v7項(xiàng)目,它要求必須很高的版本編譯页慷,然而Eclipse很蛋疼憔足,在引入該項(xiàng)目的主項(xiàng)目編譯的時(shí)候也必須要達(dá)到這個(gè)很高的版本---直接使用最高版本編譯
現(xiàn)在一般做開發(fā)都是最低兼容到4.0。
SDK升級(jí):API升級(jí)酒繁、兼容包的升級(jí)滓彰、工具升級(jí)。
3州袒、MaterialDesign控制項(xiàng)目全局樣式
1.引入appcompat-v7項(xiàng)目(包括了android-support-v7-appcompat.jar和資源文件)
AS中Module中build.gradle配置
dependencies {
implementation 'com.android.support:appcompat-v7:26.1.0'
}
2.寫自己的全局樣式:
<!--
Base application theme, dependent on API level. This theme is replaced
by AppBaseTheme from res/values-vXX/styles.xml on newer devices.
-->
<style name="AppBaseTheme" parent="Theme.AppCompat.Light">
<!--
Theme customizations available in newer API levels can go in
res/values-vXX/styles.xml, while customizations related to
backward-compatibility can go here.
-->
</style>
<!-- Application theme. -->
<style name="AppTheme" parent="AppBaseTheme">
<!-- All customizations that are NOT specific to a particular API-level can go here. -->
<item name="colorPrimary">@color/colorPrimary_pink</item>
<item name="colorPrimaryDark">@color/colorPrimary_pinkDark</item>
<item name="android:windowBackground">@color/background</item>
<item name="colorAccent">@color/accent_material_dark</item>
</style>
colorPrimary:主色揭绑,
colorPrimaryDark:主色--深色,一般可以用于狀態(tài)欄顏色郎哭、底部導(dǎo)航欄
colorAccent:(代表各個(gè)空間的基調(diào)顏色--CheckBox他匪、RadioButton、ProgressBar等等)
特別感謝:
極客學(xué)院