Android?MaterialButton使用實(shí)例詳解(告別shape、selector)
效果
前言
先來(lái)看一下MaterialButton是什么
由上圖可以看到MaterialButton也沒(méi)有什么神秘的，不過(guò)是Button的一個(gè)子類(lèi)而已，但是經(jīng)過(guò)谷歌的封裝之后，在符合Material Design的基礎(chǔ)上，使用起來(lái)更加方便了，且容易實(shí)現(xiàn)預(yù)期效果。
使用
引入material包
implementation 'com.google.android.material:material:1.2.1'
常規(guī)
<com.google.android.material.button.MaterialButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/app_name"
android:textAllCaps="false" />
與Button使用無(wú)異，textAllCaps是取消全部大小寫(xiě)。
圖標(biāo)
<com.google.android.material.button.MaterialButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:text="@string/app_name"
android:textAllCaps="false"
app:icon="@mipmap/ic_launcher" />
app:icon屬性指定圖標(biāo)。
圓角
<com.google.android.material.button.MaterialButton
android:id="@+id/btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:text="@string/app_name"
android:textAllCaps="false"
app:cornerRadius="25dp"
app:icon="@mipmap/ic_launcher"
app:iconGravity="end" />
app:cornerRadius屬性指定圓角大小。
Button描邊
<com.google.android.material.button.MaterialButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:text="@string/app_name"
android:textAllCaps="false"
app:cornerRadius="25dp"
app:strokeColor="@color/black"
app:strokeWidth="3dp" />
app:strokeColor描邊顏色app:strokeWidth描邊寬度
文字描邊
<com.google.android.material.button.MaterialButton
style="@style/Widget.MaterialComponents.Button.OutlinedButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:text="@string/app_name"
android:textAllCaps="false"
app:cornerRadius="5dp"
app:rippleColor="@color/red"
app:strokeColor="@color/red"
app:strokeWidth="3dp" />
- 與上面不同的是，這里用了
style，區(qū)別在于上面的是常規(guī)Button狀態(tài)下的描邊，這個(gè)是文字Button狀態(tài)下的描邊。 app:rippleColor點(diǎn)擊波紋顏色
文字按鈕
<com.google.android.material.button.MaterialButton
style="@style/Widget.MaterialComponents.Button.TextButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:text="@string/app_name"
android:textAllCaps="false" />
與常規(guī)使用方法一樣，但是加了style，這個(gè)style在未選中的情況下，對(duì)背景色設(shè)置了透明。
圓形Button
<com.google.android.material.button.MaterialButton
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_marginTop="20dp"
android:insetTop="0dp"
android:insetBottom="0dp"
android:text="@string/login"
android:textAllCaps="false"
android:textSize="20sp"
app:cornerRadius="999dp"
app:strokeColor="@color/orange"
app:strokeWidth="5dp" />
這里為什么來(lái)個(gè)圓形Button呢，是因?yàn)樯婕暗絻蓚€(gè)屬性
android:insetTop上邊距android:insetBottom下邊距
這兩個(gè)參數(shù)默認(rèn)是6dp，不設(shè)置為0dp的話，就不是一個(gè)規(guī)則的圓。
關(guān)于其他屬性的默認(rèn)參數(shù)，可以在xml文件的右上角，選中Design面板，選擇要查看的View即可。
源碼分析icon
唯一不足的是MaterialButton不能像chip一樣給icon設(shè)置事件。
來(lái)看看源碼中 icon具體是什么實(shí)現(xiàn)的：
public void setIcon(@Nullable Drawable icon) {
if (this.icon != icon) {
this.icon = icon;
updateIcon(/* needsIconUpdate = */ true);
}
}
這里比較簡(jiǎn)單，繼續(xù)看調(diào)用的updateIcon方法
private void updateIcon(boolean needsIconUpdate) {
// Forced icon update
if (needsIconUpdate) {
resetIconDrawable(isIconStart);
return;
}
...
if (hasIconChanged) {
resetIconDrawable(isIconStart);
}
}
有省略，看關(guān)鍵兩段代碼都調(diào)用了resetIconDrawable方法，繼續(xù)
private void resetIconDrawable(boolean isIconStart) {
if (isIconStart) {
TextViewCompat.setCompoundDrawablesRelative(this, icon, null, null, null);
} else {
TextViewCompat.setCompoundDrawablesRelative(this, null, null, icon, null);
}
}
相信到這里很多人就明白了，icon的實(shí)現(xiàn)等同于drawableStart。
只不過(guò)在MaterialButton中drawableStart是沒(méi)有效果的，而是icon和iconGravity配合使用來(lái)達(dá)到效果。
屬性
關(guān)于xml屬性，我做了一個(gè)整理
| 屬性 | 含義 |
|---|---|
| insetBottom | 下邊距，默認(rèn)6dp |
| insetTop | 上邊距，默認(rèn)6dp |
| cornerRadius | 圓角大小 |
| icon | 圖標(biāo) |
| iconGravity | 圖標(biāo)位置，只能前后 |
| iconPadding | 圖標(biāo)距文字距離，默認(rèn)8dp |
| iconSize | 圖標(biāo)大小 |
| iconTint | 圖標(biāo)著色 |
| iconTintMode | 圖標(biāo)著色模式 |
| rippleColor | 點(diǎn)擊波紋顏色 |
| strokeColor | 描邊顏色 |
| strokeWidth | 描邊寬度 |
| app:backgroundTint | 背景色（注意命名空間） |
Github
https://github.com/yechaoa/MaterialDesign
感謝
最后
到此這篇關(guān)于Android MaterialButton使用實(shí)例詳解的文章就介紹到這了,更多相關(guān)Android MaterialButton使用內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
Android入門(mén)之ListView應(yīng)用解析(二)
這篇文章主要介紹了Android入門(mén)之ListView應(yīng)用,繼上一篇之后將對(duì)Android的ListView用法做更深入的剖析,需要的朋友可以參考下2014-08-08
Android自定義scrollView實(shí)現(xiàn)頂部圖片下拉放大
這篇文章主要為大家詳細(xì)介紹了Android自定義scrollView實(shí)現(xiàn)頂部圖片下拉放大，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-12-12
Android?Navigation重建Fragment問(wèn)題分析及解決
這篇文章主要介紹了Android?Navigation重建Fragment問(wèn)題分析及解決，文章通過(guò)圍繞主題展開(kāi)詳細(xì)的內(nèi)容介紹，具有一定的參考價(jià)值，需要的小伙伴可以參考一下2022-09-09
Android編程實(shí)現(xiàn)設(shè)置TabHost當(dāng)中字體的方法
這篇文章主要介紹了Android編程實(shí)現(xiàn)設(shè)置TabHost當(dāng)中字體的方法,涉及Android針對(duì)TabHost屬性操作的相關(guān)技巧,非常簡(jiǎn)單實(shí)用,需要的朋友可以參考下2015-12-12
這篇文章主要幫助大家輕松實(shí)現(xiàn)Android鎖屏功能,具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2016-11-11
Android Studio 3.5版本JNI生成SO文件詳解
這篇文章主要介紹了Android Studio 3.5版本JNI生成SO文件詳解，想了解JNI的同學(xué)，可以參考下2021-04-04
這篇文章主要為大家詳細(xì)總結(jié)了Tablayout的簡(jiǎn)單使用方法，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-12-12
實(shí)例講解Android中ContentProvider組件的使用方法
這篇文章主要介紹了Android中ContentProvider組件的使用方法,包括ContentProvider使用單元測(cè)試的步驟,需要的朋友可以參考下2016-04-04
這篇文章主要介紹了使用Android造了個(gè)滾輪控件輪子示例，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2018-02-02
StringBuffer類(lèi)和String一樣，也用來(lái)代表字符串，只是由于StringBuffer的內(nèi)部實(shí)現(xiàn)方式和String不同，所以StringBuffer在進(jìn)行字符串處理時(shí)，不生成新的對(duì)象，在內(nèi)存使用上要優(yōu)于String類(lèi)2017-07-07