開頭先說說大家都知道的Material Design。
Material Design：
Material Design是Google推出的一個(gè)全新的設(shè)計(jì)語言，它的特點(diǎn)就是擬物扁平化。
Material Design包含了很多內(nèi)容，我大致把它分為四部分：
Material Theme
使用Material主題：
Material主題只能應(yīng)用在Android L版本。
應(yīng)用Material主題很簡單，只需要修改res/values/styles.xml文件，使其繼承android:Theme.Material。如下：
<!-- res/values/styles.xml --> <resources> <!-- your app's theme inherits from the Material theme --> <style name="AppTheme" parent="android:Theme.Material"> <!-- theme customizations --> </style> </resources>
或者在AndroidManifest.xml中直接設(shè)置主題：
android:theme="@android:style/Theme.Material.Light"
在最新的5.0中，google似乎不推薦使用Material Design主題了，而是由AppCompat代替。
<resources> <!-- Base application theme. --> <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar"> <!-- Customize your theme here. --> <item name="colorPrimary">@color/colorPrimary</item> <item name="colorPrimaryDark">@color/colorPrimaryDark</item> <item name="colorAccent">@color/colorAccent</item> </style> </resources>
自定義狀態(tài)條和導(dǎo)航條：
material還允許你輕松的自定義狀態(tài)條和導(dǎo)航條的顏色。
可以使用如下屬性（參考下方圖片）：
android:statusBarColor，Window.setStatusBarColor
兼容性：
由于Material Theme只可以在Android L Developer Preview中使用。
所以在低版本使用的話就需要為其另設(shè)一套主題：
在老版本使用一套主題 res/values/styles.xml，在新版本使用Material主題res/values-v21/styles.xml.
系統(tǒng)自帶點(diǎn)擊事件的控件一般都具有默認(rèn)的波紋效果，直接使用即可：
<RelativeLayout android:layout_width="match_parent" android:layout_height="wrap_content" > <Button android:id="@+id/myBtn" android:layout_width="match_parent" android:layout_height="wrap_content" android:drawablePadding="10dp" android:gravity="center_vertical" android:paddingBottom="15dip" android:paddingLeft="15dip" android:paddingRight="25dip" android:paddingTop="15dip" android:text="Click" android:textColor="@color/common_black_text" android:textSize="16sp" /> </RelativeLayout>
怎么為view添加點(diǎn)擊波紋效果呢，先了解下面的東西。
觸摸反饋：
在Android L5.0中加入了觸摸反饋動(dòng)畫。
其中最明顯，最具代表性的就是波紋動(dòng)畫，比如當(dāng)點(diǎn)擊按鈕時(shí)會(huì)從點(diǎn)擊的位置產(chǎn)生類似于波紋的擴(kuò)散效果。
波紋效果（Ripple）：
當(dāng)你使用了Material主題后，波紋動(dòng)畫會(huì)自動(dòng)應(yīng)用在所有的控件上，我們當(dāng)然可以來設(shè)置其屬性來調(diào)整到我們需要的效果。
可以通過如下代碼設(shè)置波紋的背景：
android:background="?android:attr/selectableItemBackground"波紋有邊界android:background="?android:attr/selectableItemBackgroundBorderless"波紋超出邊界
使用效果如下：
B1是不設(shè)任何背景的按鈕
B2設(shè)置了?android:attr/selectableItemBackground
B3設(shè)置了?android:attr/selectableItemBackgroundBorderless
設(shè)置顏色
我們也可以通過設(shè)置xml屬性來調(diào)節(jié)動(dòng)畫顏色，從而可以適應(yīng)不同的主題：
android:colorControlHighlight：設(shè)置波紋顏色
android:colorAccent：設(shè)置checkbox等控件的選中顏色
比如下面這個(gè)比較粉嫩的主題，就需要修改動(dòng)畫顏色來匹配(上面已經(jīng)有介紹)：
為view添加波紋效果：
<RelativeLayout android:id="@+id/user_info_layout" android:layout_width="match_parent" android:layout_height="wrap_content" android:clickable="true" android:background="?android:attr/selectableItemBackground" android:layout_marginTop="10dp" android:paddingBottom="15dip" android:paddingTop="15dip"> <TextView android:id="@+id/user_info_text" android:layout_width="wrap_content" android:layout_height="wrap_content" android:drawablePadding="10dp" android:gravity="center_vertical" android:paddingLeft="15dip" android:paddingRight="25dip" android:text="我的資料" android:textSize="16sp" /> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentRight="true" android:layout_centerInParent="true" android:contentDescription="@null" android:paddingRight="15dip" /> </RelativeLayout>
為Textview添加波紋效果：
<LinearLayout android:layout_width="match_parent" android:layout_height="68dp" android:weightSum="4" android:gravity="center_vertical"> <TextView android:id="@+id/user_unpaid" android:layout_width="0dp" android:layout_height="wrap_content" android:background="?android:attr/selectableItemBackgroundBorderless" android:drawableTop="@mipmap/ic_user_paid" android:drawablePadding="5dp" android:gravity="center" android:layout_weight="1" android:text="待付款" android:textSize="12sp" android:clickable="true"/> <TextView android:id="@+id/user_paid" android:layout_width="0dp" android:layout_height="wrap_content" android:background="?android:attr/selectableItemBackgroundBorderless" android:drawableTop="@mipmap/ic_user_paid" android:drawablePadding="5dp" android:layout_weight="1" android:gravity="center" android:text="待發(fā)貨" android:textColor="@color/common_black_text" android:textSize="12sp" android:clickable="true"/> <TextView android:id="@+id/user_unreceived" android:layout_width="0dp" android:layout_height="wrap_content" android:background="?android:attr/selectableItemBackgroundBorderless" android:drawableTop="@mipmap/ic_user_paid" android:drawablePadding="5dp" android:gravity="center" android:layout_weight="1" android:text="待收貨" android:textColor="@color/common_black_text" android:textSize="12sp" android:clickable="true"/> <TextView android:id="@+id/user_completed" android:layout_width="0dp" android:layout_height="wrap_content" android:background="?android:attr/selectableItemBackgroundBorderless" android:drawableTop="@mipmap/ic_user_paid" android:drawablePadding="5dp" android:gravity="center" android:layout_weight="1" android:text="已完成" android:textSize="12sp" android:clickable="true"/> </LinearLayout>
這樣就可以實(shí)現(xiàn)波紋效果啦！
以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持武林網(wǎng)。
新聞熱點(diǎn)
疑難解答
圖片精選
