版權(quán)聲明：本文來(lái)自 Crocutax 的博客 , 轉(zhuǎn)載請(qǐng)注明出處 http://www.crocutax.com
今天項(xiàng)目中又用到了RatingBar，于是翻出來(lái)之前踩坑的一篇筆記，快速解決問(wèn)題，順便把筆記內(nèi)容整理在此，方便以后查閱。
當(dāng)項(xiàng)目中遇到【評(píng)分】需求的時(shí)候，一般情況下都會(huì)使用RatingBar用于UI展示，而且很多時(shí)候都不會(huì)使用原生樣式。原因有兩個(gè)：
- Android和iOS樣式的統(tǒng)一
- 系統(tǒng)原生樣式的版本兼容性問(wèn)題
所以適當(dāng)?shù)淖远xRatingBar樣式就顯得很有必要了。
RatingBar基本使用
RatingBar的基本使用比較簡(jiǎn)單，這里只記錄一下幾個(gè)常用的屬性：
- isIndicator 是否是指示器，如果設(shè)置為true,則不可以通過(guò)點(diǎn)擊來(lái)改變進(jìn)度；如果設(shè)置為false，則可點(diǎn)擊
- numStars 一共有幾個(gè)星星，默認(rèn)是5個(gè)。
- rating 表示進(jìn)度
RatingBar 樣式展示
之前項(xiàng)目中一共碰到過(guò)四種RatingBar樣式，各自效果圖整理如下：
說(shuō)明：
- 第一個(gè)：原生普通樣式（隨著主題不同，樣式會(huì)變）
- 第二個(gè)：原生普通樣式-小icon
- 第三個(gè)：自定義RatingBar 顏色
- 第四個(gè)：自定義RatingBar Drawable
RatingBar 各樣式實(shí)現(xiàn)
原生樣式
原生樣式其實(shí)沒(méi)什么好說(shuō)的，使用系統(tǒng)提供的style 即可
<!--第一個(gè)：原生主題樣式 -->
<RatingBar
style="?android:attr/ratingBarStyleIndicator"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:rating="3"/>
<!--第二個(gè)：原生主題樣式：小-->
<RatingBar
style="?android:attr/ratingBarStyleSmall"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:rating="3"/>
自定義顏色
這種方式也很簡(jiǎn)單，只需要要定義一個(gè)樣式即可，兩步完成。
第一步，定義樣式，指定背景色 和 進(jìn)度色
<!--自定義RatingBar Color-->
<style name="RatingBar_CustomColor" parent="@android:style/Widget.Holo.RatingBar.Indicator">
<!--Background Color-->
<item name="colorControlNormal">#D7D7D7</item>
<!--Progress Color-->
<item name="colorControlActivated">#F49800</item>
</style>
第二步，XML中使用該主題
<!--自定義 Color-->
<RatingBar
android:id="@+id/go_rating"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:isIndicator="true"
style="?android:attr/ratingBarStyleSmall"
android:theme="@style/RatingBar_CustomColor"
android:rating="3"/>
自定義Drawable
這種方式相對(duì)于前面幾種，算是稍微麻煩一點(diǎn)的方式了，而且還存在圖片拉伸的坑（圖片底部被垂直拉伸成一條直線(xiàn)，跟哭了似的-_-!，就不貼圖了）。先說(shuō)具體實(shí)現(xiàn)方法，再說(shuō)坑。
第一步，定義層疊布局layerlist
自定義過(guò)ProgressBar的同學(xué)，相信對(duì)下面的background，secondProgress，progress屬性都不會(huì)陌生。
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="@android:id/background"
android:drawable="@drawable/star"/>
<item android:id="@android:id/secondaryProgress"
android:drawable="@drawable/star"/>
<item android:id="@android:id/progress"
android:drawable="@drawable/star_solid"/>
</layer-list>
第二步，自定義樣式，指定ProgressDrawable
注意這里指定minHeight和maxHeight，根據(jù)項(xiàng)目中的UI需求而定，定死高度的其中一個(gè)作用就是防止drawable圖片被垂直拉伸。
<!--自定義RatingBar Drawable-->
<style name="RatingBar_CustomDrawable" parent="@android:style/Widget.Holo.RatingBar.Indicator">
<item name="android:progressDrawable">@drawable/custom_rating_bar</item>
<item name="android:minHeight">15dp</item>
<item name="android:maxHeight">15dp</item>
</style>
第三步，在xml中使用剛才定義好的樣式
<!--自定義Drawable樣式-->
<RatingBar
android:id="@+id/room_ratingbar"
style="@style/RatingBar_CustomDrawable"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:rating="3"/>
最后說(shuō)下圖片垂直拉伸的解決方案：
- 設(shè)置minHeight和maxHeight，寫(xiě)死像素值。
- 讓UI幫忙切一張底部留有空隙的star圖標(biāo)，比如有1px的空隙
- 使用略大于當(dāng)前控件空間的icon，比如整個(gè)UI切圖是按照drawable-xxhdpi來(lái)切的，那么使用高一級(jí)的drawable目錄下比如drawable-xxxhdpi的icon，這樣在運(yùn)行的時(shí)候，icon會(huì)進(jìn)行相應(yīng)比例的縮放。
圖片拉伸問(wèn)題，還可以參考以下鏈接：
http://shikezhi.com/html/2015/android_0920/375199.html
http://blog.csdn.net/QMLN31821007/article/details/41121891
（完）
