Android?MaterialButton使用實例詳解(告別shape、selector)
更新時間：2022年09月03日 08:35:43 作者：yechaoa
我們平時寫布局,當(dāng)遇到按鈕需要圓角、或者描邊等,通常的方法是新建一個xml文件,在shape標(biāo)簽下寫,然后通過android:background或setBackground(drawable)設(shè)置,這篇文章主要給大家介紹了關(guān)于Android?MaterialButton使用詳解的相關(guān)資料,需要的朋友可以參考下
效果
前言
先來看一下MaterialButton是什么
由上圖可以看到MaterialButton也沒有什么神秘的，不過是Button的一個子類而已，但是經(jīng)過谷歌的封裝之后，在符合Material Design的基礎(chǔ)上，使用起來更加方便了，且容易實現(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使用無異，textAllCaps是取消全部大小寫。
圖標(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)下的描邊，這個是文字Button狀態(tài)下的描邊。 app:rippleColor點擊波紋顏色
文字按鈕
<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，這個style在未選中的情況下，對背景色設(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" />
這里為什么來個圓形Button呢，是因為涉及到兩個屬性
android:insetTop上邊距android:insetBottom下邊距
這兩個參數(shù)默認(rèn)是6dp，不設(shè)置為0dp的話，就不是一個規(guī)則的圓。
關(guān)于其他屬性的默認(rèn)參數(shù)，可以在xml文件的右上角，選中Design面板，選擇要查看的View即可。
源碼分析icon
唯一不足的是MaterialButton不能像chip一樣給icon設(shè)置事件。
來看看源碼中 icon具體是什么實現(xiàn)的：
public void setIcon(@Nullable Drawable icon) {
if (this.icon != icon) {
this.icon = icon;
updateIcon(/* needsIconUpdate = */ true);
}
}
這里比較簡單，繼續(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的實現(xiàn)等同于drawableStart。
只不過在MaterialButton中drawableStart是沒有效果的，而是icon和iconGravity配合使用來達(dá)到效果。
屬性
關(guān)于xml屬性，我做了一個整理
| 屬性 | 含義 |
|---|---|
| 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 | 點擊波紋顏色 |
| strokeColor | 描邊顏色 |
| strokeWidth | 描邊寬度 |
| app:backgroundTint | 背景色（注意命名空間） |
Github
https://github.com/yechaoa/MaterialDesign
感謝
最后
到此這篇關(guān)于Android MaterialButton使用實例詳解的文章就介紹到這了,更多相關(guān)Android MaterialButton使用內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
Android入門之ListView應(yīng)用解析(二)
這篇文章主要介紹了Android入門之ListView應(yīng)用,繼上一篇之后將對Android的ListView用法做更深入的剖析,需要的朋友可以參考下2014-08-08
Android自定義scrollView實現(xiàn)頂部圖片下拉放大
這篇文章主要為大家詳細(xì)介紹了Android自定義scrollView實現(xiàn)頂部圖片下拉放大，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-12-12
Android?Navigation重建Fragment問題分析及解決
這篇文章主要介紹了Android?Navigation重建Fragment問題分析及解決，文章通過圍繞主題展開詳細(xì)的內(nèi)容介紹，具有一定的參考價值，需要的小伙伴可以參考一下2022-09-09
Android編程實現(xiàn)設(shè)置TabHost當(dāng)中字體的方法
這篇文章主要介紹了Android編程實現(xiàn)設(shè)置TabHost當(dāng)中字體的方法,涉及Android針對TabHost屬性操作的相關(guān)技巧,非常簡單實用,需要的朋友可以參考下2015-12-12
這篇文章主要幫助大家輕松實現(xiàn)Android鎖屏功能,具有一定的參考價值，感興趣的小伙伴們可以參考一下2016-11-11
Android Studio 3.5版本JNI生成SO文件詳解
這篇文章主要介紹了Android Studio 3.5版本JNI生成SO文件詳解，想了解JNI的同學(xué)，可以參考下2021-04-04
這篇文章主要為大家詳細(xì)總結(jié)了Tablayout的簡單使用方法，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-12-12
實例講解Android中ContentProvider組件的使用方法
這篇文章主要介紹了Android中ContentProvider組件的使用方法,包括ContentProvider使用單元測試的步驟,需要的朋友可以參考下2016-04-04
這篇文章主要介紹了使用Android造了個滾輪控件輪子示例，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-02-02
StringBuffer類和String一樣，也用來代表字符串，只是由于StringBuffer的內(nèi)部實現(xiàn)方式和String不同，所以StringBuffer在進(jìn)行字符串處理時，不生成新的對象，在內(nèi)存使用上要優(yōu)于String類2017-07-07