自定義RatingBar的顯示風格

                                          自定義RatingBar的顯示風格

        Android裏有一種控件叫RatingBar，描述某種事物的好評等級的，即星級等級，用5個星星來表示。Android自帶的RatingBar風格基本上已經滿足我們的需求了。但是有的時候爲了滿足客戶的要求，需要自定義風格，無非就是改變星星的顯示風格。下面就介紹如何使用自定義的星星。

1、準備兩張自定義圖片，放在drawable-hdpi目錄下（根據自己的實際情況）。

            

2、xml裏定義RatingBar大致如下：

<RatingBar
    android:id="@+id/event_rating"
    style="@style/RatingBar"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginStart="3dp"
    android:layout_marginTop="1dp"
    android:focusable="false"
    android:isIndicator="false"
    android:max="100"
    android:numStars="5"
    android:rating="0.5"
    android:stepSize="20" />

3、@style/RatingBar就是我們自定的風格，它在values\style.xml裏定義如下：

<style name="RatingBar">
    <item name="android:progressDrawable">@drawable/ratingbar_drawable</item>
    <item name="android:maxHeight">@dimen/home_detail_ratingbar_height</item>
    <item name="android:minHeight">@dimen/home_detail_ratingbar_height</item>
</style>

4、@drawable/ratingbar_drawable對應ratingbar_drawable.xml,它在drawable目錄下。

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:id="@android:id/background"
        android:drawable="@drawable/ratting_star_normal">
    </item>

    <item
        android:id="@android:id/secondaryProgress"
        android:drawable="@drawable/ratting_star_normal">
    </item>

    <item
        android:id="@android:id/progress"
        android:drawable="@drawable/ratting_star_selected">
    </item>
</layer-list>

5、home_detail_ratingbar_height的定義在dimens.xml裏定義如下

<dimen name="home_detail_ratingbar_height">20dp</dimen>

6、RatingBar設置值（根據自己的情況設置）。

float rating = 0;
try {
    rating = Float.parseFloat(programmeBean.getProgrammescore());
} catch (NumberFormatException e) {
    e.printStackTrace();
}

rating = rating * 100;

if (rating >= 30) {
    rating = 100;
} else if (rating < 30 && rating >= 10) {
    rating = 80;
} else if (rating < 10 && rating >= 7.55) {
    rating = 60;
} else if (rating < 7.55 && rating >= 6) {
    rating = 40;
} else if (rating < 6 && rating >= 1) {
    rating = 20;
} else if (rating < 1 && rating > 0) {
    rating = 10;
} else {
    rating = 0;
}

rating = rating / (float)(mRatingBarDetails.getMax() / mRatingBarDetails.getNumStars());
mRatingBarDetails.setRating(rating);

7、效果圖

 

覺得ok記得點贊噢，謝謝。

                                                                                  THE   END