一個豐富的UI控件
使用方式:
1.導(dǎo)入依賴:
implementation 'com.google.android.material:material:1.2.0'
MaterialButton
日常開發(fā)中,我們寫布局,寫圓角,通常會在drawable下自己新建一個xml.然后在布局中@drawwable/xxx這樣去引用自定義的xml,但這樣就會遇到一個問題,UI為了美觀給出了很多不同的邊角,不同dp的描邊,這樣導(dǎo)致我們要自定義諸多的xml,如果項目處于一期還比較好維護(hù),但如果后期項目越做越大,不停更新迭代,項目就不好維護(hù)了,由此看來我們需要一個強(qiáng)大的組件來支撐.讓開發(fā)者直接在xml中設(shè)置圓角啊邊框啊描邊呀這些很美(zhuang)觀(bi)的高大上的形狀.
Google官方在SDK28的時候推出了一個強(qiáng)大的新控件-----MaterialButton.
我們首先看下效果圖.
支持圓角,雙重變色,圓形,描邊,按壓水波紋等多種不同的設(shè)置,真是一個強(qiáng)大的組件奧.
MaterialButton繼承AppCompatButton，支持圓角、描邊、前置和后置icon（icon支持設(shè)置Size、Tint、Padding、Gravity等）损合，還支持按壓水波紋并且設(shè)置color.
他的公共屬性如下:
關(guān)于background在1.2版本以前，MaterialButton只能通過app:backgroundTint屬性設(shè)置背景色娘纷，該屬性接收color state list嫁审。不能通過android:background設(shè)置自定義drawable。
1.2版本后赖晶，官方已修復(fù)此問題律适。如果未設(shè)置自定義背景辐烂，則 MaterialShapeDrawable 仍將用作默認(rèn)背景。
也就是說捂贿，如果按鈕背景是純色纠修，可以通過app:backgroundTint指定；如果按鈕背景是漸變色厂僧，則需要自己定義drawable扣草，然后通過android:background設(shè)置。
注意：如果要使用android:background設(shè)置背景颜屠，則需要將backgroundTint設(shè)置為@empty辰妙，否則background不會生效。
<com.google.android.material.button.MaterialButton
android:background=”@drawable/custom_background”
app:backgroundTint=”@empty” />
指定@empty后甫窟，Android Studio會出現(xiàn)紅色警告密浑，可以正常運(yùn)行，忽略就好粗井。不過既然已經(jīng)自定義drawable尔破，就沒必要使用MaterialButton，直接用普通的Button甚至用TextView就好了浇衬。
關(guān)于insetTop懒构、insetBottom
看下面的代碼：
<com.google.android.material.button.MaterialButton
android:id="@+id/btn1"
android:layout_width="150dp"
android:layout_height="50dp"
android:textColor="@android:color/white"
android:textSize="18sp"
/>
xml預(yù)覽圖：
看源碼發(fā)現(xiàn)，MaterialButton默認(rèn)在style指定了insetTop和insetBottom為6dp耘擂，使得height看起來并沒有Button實際設(shè)置值一樣高痴脾，可以在xml將MaterialButton的insetTop和insetBottom都設(shè)置為0dp，這樣MaterialButton的高度就和實際設(shè)置的高度一致了梳星。
關(guān)于陰影
MD組件默認(rèn)都是自帶陰影的赞赖，MaterialButton也不例外。但是有時候我們并不想要按鈕有陰影冤灾，那么這時候可以指定style為
style="@style/Widget.MaterialComponents.Button.UnelevatedButton"前域，這樣就能去掉陰影，讓視圖看起來扁平化韵吨。
關(guān)于theme
在MDC1.1.0以后匿垄，使用MaterialButton可能會出現(xiàn)閃退的問題，原因就是使用了MD控件归粉，但是未將them設(shè)置為MaterialComponents椿疗。解決方法可以有幾種：
先在style.xml自定義MaterialComponents_Theme
<style name="MaterialComponents_Theme" parent="Theme.MaterialComponents.Light.NoActionBar">
<!-- Customize your theme here. -->
...
</style>
方法一： AndroidManifest里application節(jié)點下配置，作用域為整個應(yīng)用
<application
...
android:theme="@style/MaterialComponents_Theme"
方法二： 只在當(dāng)前activity配置糠悼，作用域為當(dāng)前activity
<activity
...
android:theme="@style/MaterialComponents_Theme"
方法三： 為每個在使用到MD控件的地方配置届榄，作用域只針對當(dāng)前控件
<com.google.android.material.button.MaterialButton
...
android:theme="@style/Theme.MaterialComponents.Light.NoActionBar" />
關(guān)于在Android Studio中預(yù)覽
如下代碼
<com.google.android.material.button.MaterialButton
android:id="@+id/btn_send"
style="@style/Widget.MaterialComponents.Button.UnelevatedButton"
android:layout_width="@dimen/dp_80"
android:layout_height="@dimen/dp_30"
android:layout_marginStart="@dimen/dp_12"
android:insetTop="0dp"
android:insetBottom="0dp"
android:padding="0dp"
android:text="@string/dispatch_room_text_upper_mic"
android:textColor="@color/white"
android:textSize="@dimen/font_12"
app:backgroundTint="@color/c_6D56FF"
app:cornerRadius="@dimen/dp_15"
app:layout_constraintBottom_toBottomOf="@id/iv_head"
app:layout_constraintStart_toEndOf="@id/iv_head" />
xml預(yù)覽
可以看到xml預(yù)覽效果和代碼是不匹配的，這時候可以將預(yù)覽的主題指定為MaterialComponents
這樣效果就和xml代碼一致了
/ ShapeableImageView /
來波效果圖：
以往我們實現(xiàn)圖片圓角倔喂、描邊等需求铝条，多數(shù)時候是使用第三方或者自定義靖苇，Glide也有個擴(kuò)展庫，能很輕松幫我們實現(xiàn)班缰。不過在MDC1.2.0中贤壁，已經(jīng)有了一套官方的實現(xiàn)方案。那就是ShapeableImageView埠忘。
ShapeableImageView繼承自ImageView脾拆，可以為image添加描邊大小、顏色莹妒，以及圓角蒜哀、裁切等岩喷，這得益于它新增了一個屬性shapeAppearance吓揪，具體實現(xiàn)在ShapeAppearanceModel镣典，可以通過style來配置渔期，也可以通過代碼實現(xiàn)运吓。
style配置：
<style name="StyleShapeAppearanceImage" parent="">
<item name="cornerFamily">rounded</item>
<item name="cornerSize">16dp</item>
<item name="cornerSizeTopRight">10dp</item>
<item name="cornerSizeBottomRight">0dp</item>
</style>
...
<com.google.android.material.imageview.ShapeableImageView
app:shapeAppearance="@style/StyleShapeAppearanceImage"
...
/>
代碼設(shè)置：
imageView?.shapeAppearanceModel = ShapeAppearanceModel.builder()
.setAllCorners(CornerFamily.ROUNDED,20f)
.setTopLeftCorner(CornerFamily.CUT,RelativeCornerSize(0.3f))
.setTopRightCorner(CornerFamily.CUT,RelativeCornerSize(0.3f))
.setBottomRightCorner(CornerFamily.CUT,RelativeCornerSize(0.3f))
.setBottomLeftCorner(CornerFamily.CUT,RelativeCornerSize(0.3f))
.setAllCornerSizes(ShapeAppearanceModel.PILL)
.setTopLeftCornerSize(20f)
.setTopRightCornerSize(RelativeCornerSize(0.5f))
.setBottomLeftCornerSize(10f)
.setBottomRightCornerSize(AbsoluteCornerSize(30f))
.build()
代碼接收一個ShapeAppearanceModel，通過構(gòu)建者模式實現(xiàn)疯趟，setTopLeft表示處理左上角拘哨，其他同理。
cornerSize表示設(shè)置的大小信峻，有RelativeCornerSize和AbsoluteCornerSize倦青，RelativeCornerSize構(gòu)造方法接收一個百分比，范圍0-1盹舞；AbsoluteCornerSize構(gòu)造方法接收一個具體數(shù)值产镐，這個數(shù)值就是圓角的數(shù)值。
這里還有個CornerFamily踢步，它表示處理的方式癣亚，有ROUNDED和CUT兩種，ROUNDED是圓角获印，CUT是直接將圓角部分裁切掉述雾。setAllCornerSizes(ShapeAppearanceModel.PILL)可以直接實現(xiàn)圓形效果。
關(guān)于Stroke
ShapeableImageView指定strokeWidth描邊的時候兼丰，其描邊會被覆蓋掉一半玻孟，如strokeWidth=4dp，上下左右會被覆蓋鳍征，實際的效果是只有2dp被顯示黍翎。如圖，
github有人反饋了類似問題(https://github.com/material-components/material-components-android/issues/1489)艳丛，我的處理方法是在設(shè)置了strokeWidth的同時玩敏，設(shè)置相應(yīng)的pading斗忌，這樣描邊就不會被覆蓋了。
<com.google.android.material.imageview.ShapeableImageView
...
app:strokeWidth="4dp"
android:padding="4dp"
/ Slider(加強(qiáng)版的SeekBar) /
Slider的父類BaseSlider旺聚，直接繼承View织阳，重新實現(xiàn)邏輯。此外BaseSlider還有個子類RangeSlider砰粹，用它來實現(xiàn)圖1效果2
Slider可以實現(xiàn)滑塊頭部數(shù)字變化效果唧躲，還可以實現(xiàn)類似刻度尺效果，比原生的SeekBar加強(qiáng)了不少碱璃。
常用屬性如下：
其他屬性還有haloColor弄痹、haloRadius、thumbColor等嵌器，用來配置一些外觀
/ BottomNavigationView /
BottomNavigationView相比之前要完善了很多肛真，可以設(shè)置icon大小，添加紅點和未讀消息數(shù)爽航，以及超過3個item蚓让，切換效果也不會出現(xiàn)問題，通過LabelVisibilityMode.LABEL_VISIBILITY_LABELED指定讥珍。
