Android中自定義RatingBar實現星星大小,數量,間距等的設置

前言

  系統中自帶的RatingBar使用起來非常不方便，並且無法調整合適大小，於是自定義一個可自己調節星星數量，大小，間距等屬性的RatingBar

Demo展示圖片：

佈局代碼如下:

//（layout）activity_main.xml
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    tools:context="com.test.ratingbar.MainActivity">

    <TextView
        android:id="@+id/textView"
        android:paddingTop="15dp"
        android:paddingLeft="15dp"
        android:text="星級"
        android:textSize="25sp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"/>

    <com.test.ratingbar.view.RatingBar
        android:id="@+id/star"
        android:paddingTop="15dp"
        android:layout_toRightOf="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="50dp"
        android:paddingLeft="10dp"
        app:starCount="5"
        app:starEmpty="@drawable/rating_small_empty"
        app:starFill="@drawable/rating_small_full"
        app:starHalf="@drawable/rating_small_half"
        app:starImageSize="35dp"
        app:starPadding="1dp"
        app:starStep="2.5"
        app:stepSize="Half"/>
        <!--上面RatingBar屬性設置代碼是使用的關鍵 對星星數量，大小，位置，星星樣式，間距，默認星級等均做了設置-->
</RelativeLayout>
------------------------------------------------------------------------

//（values）attrs.xml
<resources>
    <declare-styleable name="RatingBar">
        <!--尺寸值-->
        <attr name="starImageSize" format="dimension" />
        <!--星星間距-->
        <attr name="starPadding" format="dimension" />
        <!--星星總數-->
        <attr name="starCount" format="integer" />
        <!--空白的星星資源文件值-->
        <attr name="starEmpty" format="reference" />
        <!--滿星資源文件值-->
        <attr name="starFill" format="reference" />
        <!--半星資源文件值-->
        <attr name="starHalf" format="reference" />
        <!--是否可點擊boolean值-->
        <attr name="clickable" format="boolean" />
        <!--當前進度float值-->
        <attr name="starStep" format="float" />
        <!--每次進度方式的值，整星還是半星-->
        <attr name="stepSize">
            <enum name="Half" value="0" />
            <enum name="Full" value="1" />
        </attr>
    </declare-styleable>
</resources>
------------------------------------------------------------------------

//(drawable)ratingbar_bg.xml
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <!--主背景-->
    <item
        android:id="@android:id/background"
        android:drawable="@drawable/rating_small_empty"></item>
    <!--副進度條-->
    <item
        android:id="@android:id/secondaryProgress"
        android:drawable="@drawable/rating_small_half"></item>
    <!--主進度條-->
    <item
        android:id="@android:id/progress"
        android:drawable="@drawable/rating_small_full"></item>
</layer-list>

• 1
• 2
• 3
• 4
• 5
• 6
• 7
• 8
• 9
• 10
• 11
• 12
• 13
• 14
• 15
• 16
• 17
• 18
• 19
• 20
• 21
• 22
• 23
• 24
• 25
• 26
• 27
• 28
• 29
• 30
• 31
• 32
• 33
• 34
• 35
• 36
• 37
• 38
• 39
• 40
• 41
• 42
• 43
• 44
• 45
• 46
• 47
• 48
• 49
• 50
• 51
• 52
• 53
• 54
• 55
• 56
• 57
• 58
• 59
• 60
• 61
• 62
• 63
• 64
• 65
• 66
• 67
• 68
• 69
• 70
• 71
• 72
• 73
• 74
• 75
• 76
• 77
• 78
• 79
• 80
• 81

自定義RatingBar代碼：

//（view）RatingBar
import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.drawable.Drawable;
import android.util.AttributeSet;
import android.view.View;
import android.widget.ImageView;
import android.widget.LinearLayout;
import com.test.ratingbar.R;
import java.math.BigDecimal;

public class RatingBar extends LinearLayout {
    /**
     * 是否可點擊
     */
    private boolean mClickable;
    /**
     * 星星總數
     */
    private int starCount;
    /**
     * 星星的點擊事件
     */
    private OnRatingChangeListener onRatingChangeListener;
    /**
     * 每個星星的大小
     */
    private float starImageSize;
    /**
     * 每個星星的間距
     */
    private float starPadding;
    /**
     * 星星的顯示數量，支持小數點
     */
    private float starStep;
    /**
     * 空白的默認星星圖片
     */
    private Drawable starEmptyDrawable;
    /**
     * 選中後的星星填充圖片
     */
    private Drawable starFillDrawable;
    /**
     * 半顆星的圖片
     */
    private Drawable starHalfDrawable;
    /**
     * 每次點擊星星所增加的量是整個還是半個
     */
    private StepSize stepSize;

    /**
     * 設置半星的圖片資源文件
     */
    public void setStarHalfDrawable(Drawable starHalfDrawable) {
        this.starHalfDrawable = starHalfDrawable;
    }

    /**
     * 設置滿星的圖片資源文件
     */
    public void setStarFillDrawable(Drawable starFillDrawable) {
        this.starFillDrawable = starFillDrawable;
    }

    /**
     * 設置空白和默認的圖片資源文件
     */
    public void setStarEmptyDrawable(Drawable starEmptyDrawable) {
        this.starEmptyDrawable = starEmptyDrawable;
    }

    /**
     * 設置星星是否可以點擊操作
     */
    public void setClickable(boolean clickable) {
        this.mClickable = clickable;
    }

    /**
     * 設置星星點擊事件
     */
    public void setOnRatingChangeListener(OnRatingChangeListener onRatingChangeListener) {
        this.onRatingChangeListener = onRatingChangeListener;
    }

    /**
     * 設置星星的大小
     */
    public void setStarImageSize(float starImageSize) {
        this.starImageSize = starImageSize;
    }

    public void setStepSize(StepSize stepSize) {
        this.stepSize = stepSize;
    }

    /**
     * 構造函數
     * 獲取xml中設置的資源文件
     */
    public RatingBar(Context context, AttributeSet attrs) {
        super(context, attrs);
        setOrientation(LinearLayout.HORIZONTAL);
        TypedArray mTypedArray = context.obtainStyledAttributes(attrs, R.styleable.RatingBar);
        starImageSize = mTypedArray.getDimension(R.styleable.RatingBar_starImageSize, 20);
        starPadding = mTypedArray.getDimension(R.styleable.RatingBar_starPadding, 10);
        starStep = mTypedArray.getFloat(R.styleable.RatingBar_starStep, 1.0f);
        stepSize = StepSize.fromStep(mTypedArray.getInt(R.styleable.RatingBar_stepSize, 1));
        starCount = mTypedArray.getInteger(R.styleable.RatingBar_starCount, 5);
        starEmptyDrawable = mTypedArray.getDrawable(R.styleable.RatingBar_starEmpty);
        starFillDrawable = mTypedArray.getDrawable(R.styleable.RatingBar_starFill);
        starHalfDrawable = mTypedArray.getDrawable(R.styleable.RatingBar_starHalf);
        mClickable = mTypedArray.getBoolean(R.styleable.RatingBar_clickable, true);
        mTypedArray.recycle();
        for (int i = 0; i < starCount; ++i) {
            final ImageView imageView = getStarImageView();
            imageView.setImageDrawable(starEmptyDrawable);
            imageView.setOnClickListener(
                    new OnClickListener() {
                        @Override
                        public void onClick(View v) {
                            if (mClickable) {
                                //浮點數的整數部分
                                int fint = (int) starStep;
                                BigDecimal b1 = new BigDecimal(Float.toString(starStep));
                                BigDecimal b2 = new BigDecimal(Integer.toString(fint));
                                //浮點數的小數部分
                                float fPoint = b1.subtract(b2).floatValue();
                                if (fPoint == 0) {
                                    fint -= 1;
                                }

                                if (indexOfChild(v) > fint) {
                                    setStar(indexOfChild(v) + 1);
                                } else if (indexOfChild(v) == fint) {
                                    if (stepSize == StepSize.Full) {//如果是滿星 就不考慮半顆星了
                                        return;
                                    }
                                    //點擊之後默認每次先增加一顆星，再次點擊變爲半顆星
                                    if (imageView.getDrawable().getCurrent().getConstantState().equals(starHalfDrawable.getConstantState())) {
                                        setStar(indexOfChild(v) + 1);
                                    } else {
                                        setStar(indexOfChild(v) + 0.5f);
                                    }
                                } else {
                                    setStar(indexOfChild(v) + 1f);
                                }

                            }
                        }
                    }
            );
            addView(imageView);
        }
        setStar(starStep);
    }

    /**
     * 設置每顆星星的參數
     */
    private ImageView getStarImageView() {
        ImageView imageView = new ImageView(getContext());

        LayoutParams layout = new LayoutParams(
                Math.round(starImageSize), Math.round(starImageSize));//設置每顆星星在線性佈局的大小
        layout.setMargins(0, 0, Math.round(starPadding), 0);//設置每顆星星在線性佈局的間距
        imageView.setLayoutParams(layout);
        imageView.setAdjustViewBounds(true);
        imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);
        imageView.setImageDrawable(starEmptyDrawable);
        imageView.setMinimumWidth(10);
        imageView.setMaxHeight(10);
        return imageView;

    }

    /**
     * 設置星星的個數
     */

    public void setStar(float rating) {

        if (onRatingChangeListener != null) {
            onRatingChangeListener.onRatingChange(rating);
        }
        this.starStep = rating;
        //浮點數的整數部分
        int fint = (int) rating;
        BigDecimal b1 = new BigDecimal(Float.toString(rating));
        BigDecimal b2 = new BigDecimal(Integer.toString(fint));
        //浮點數的小數部分
        float fPoint = b1.subtract(b2).floatValue();

        //設置選中的星星
        for (int i = 0; i < fint; ++i) {
            ((ImageView) getChildAt(i)).setImageDrawable(starFillDrawable);
        }
        //設置沒有選中的星星
        for (int i = fint; i < starCount; i++) {
            ((ImageView) getChildAt(i)).setImageDrawable(starEmptyDrawable);
        }
        //小數點默認增加半顆星
        if (fPoint > 0) {
            ((ImageView) getChildAt(fint)).setImageDrawable(starHalfDrawable);
        }
    }

    /**
     * 操作星星的點擊事件
     */
    public interface OnRatingChangeListener {
        /**
         * 選中的星星的個數
         */
        void onRatingChange(float ratingCount);

    }

    /**
     * 星星每次增加的方式整星還是半星，枚舉類型
     * 類似於View.GONE
     */
    public enum StepSize {
        Half(0), Full(1);
        int step;

        StepSize(int step) {
            this.step = step;
        }

        public static StepSize fromStep(int step) {
            for (StepSize f : values()) {
                if (f.step == step) {
                    return f;
                }
            }
            throw new IllegalArgumentException();
        }
    }
}

• 1
• 2
• 3
• 4
• 5
• 6
• 7
• 8
• 9
• 10
• 11
• 12
• 13
• 14
• 15
• 16
• 17
• 18
• 19
• 20
• 21
• 22
• 23
• 24
• 25
• 26
• 27
• 28
• 29
• 30
• 31
• 32
• 33
• 34
• 35
• 36
• 37
• 38
• 39
• 40
• 41
• 42
• 43
• 44
• 45
• 46
• 47
• 48
• 49
• 50
• 51
• 52
• 53
• 54
• 55
• 56
• 57
• 58
• 59
• 60
• 61
• 62
• 63
• 64
• 65
• 66
• 67
• 68
• 69
• 70
• 71
• 72
• 73
• 74
• 75
• 76
• 77
• 78
• 79
• 80
• 81
• 82
• 83
• 84
• 85
• 86
• 87
• 88
• 89
• 90
• 91
• 92
• 93
• 94
• 95
• 96
• 97
• 98
• 99
• 100
• 101
• 102
• 103
• 104
• 105
• 106
• 107
• 108
• 109
• 110
• 111
• 112
• 113
• 114
• 115
• 116
• 117
• 118
• 119
• 120
• 121
• 122
• 123
• 124
• 125
• 126
• 127
• 128
• 129
• 130
• 131
• 132
• 133
• 134
• 135
• 136
• 137
• 138
• 139
• 140
• 141
• 142
• 143
• 144
• 145
• 146
• 147
• 148
• 149
• 150
• 151
• 152
• 153
• 154
• 155
• 156
• 157
• 158
• 159
• 160
• 161
• 162
• 163
• 164
• 165
• 166
• 167
• 168
• 169
• 170
• 171
• 172
• 173
• 174
• 175
• 176
• 177
• 178
• 179
• 180
• 181
• 182
• 183
• 184
• 185
• 186
• 187
• 188
• 189
• 190
• 191
• 192
• 193
• 194
• 195
• 196
• 197
• 198
• 199
• 200
• 201
• 202
• 203
• 204
• 205
• 206
• 207
• 208
• 209
• 210
• 211
• 212
• 213
• 214
• 215
• 216
• 217
• 218
• 219
• 220
• 221
• 222
• 223
• 224
• 225
• 226
• 227
• 228
• 229
• 230
• 231
• 232
• 233
• 234
• 235
• 236
• 237
• 238
• 239
• 240
• 241
• 242
• 243

Activity代碼如下:

//（activity）MainActivity
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import com.test.ratingbar.view.RatingBar;

public class MainActivity extends AppCompatActivity {
    private RatingBar mRatingBar;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        initView();
        initData();
    }
    private void initView(){
        mRatingBar = (com.test.ratingbar.view.RatingBar) findViewById(R.id.star);
    }
    private void initData(){
        mRatingBar.setClickable(false);
        mRatingBar.setStar(3.5f);
    }
}

• 1
• 2
• 3
• 4
• 5
• 6
• 7
• 8
• 9
• 10
• 11
• 12
• 13
• 14
• 15
• 16
• 17
• 18
• 19
• 20
• 21
• 22

Demo下載請移步：http://download.csdn.net/detail/zxc514257857/9799637