前言

無意中翻到幾年前寫過的一個(gè)RatingBar，可以拖拽，支持自定義星星圖片，間距大小等參數(shù)。

自定義參數(shù)

為了方便擴(kuò)展，支持更多的樣式，這里將大部分參數(shù)設(shè)置成支持外部可配置的形式。

<declare-styleable name="RatingBarPlus">
    <attr name="hideImageResource" format="reference"/>
    <attr name="showImageResource" format="reference"/>
    <attr name="starSpace" format="dimension"/>
    <attr name="maxStar" format="integer"/>
    <attr name="stepSize" format="float"/>
    <attr name="rating" format="float"/>
    <attr name="starWidth" format="dimension"/>
    <attr name="starHeight" format="dimension"/>
</declare-styleable>

• hideImageResource 暗星星圖片id
• showImageResource 亮星星圖片id
• starSpace 星星間距
• maxStar 星星最大個(gè)數(shù)
• stepSize 評(píng)分步長，即能不能選中0.1個(gè)星
• rating 默認(rèn)評(píng)分
• starWidth 星星寬度
• starHeight 星星高度

解析參數(shù)

創(chuàng)建星星位圖的時(shí)候需要根據(jù)配置的大小和圖片本身的寬高進(jìn)行縮放。

繪制

繪制完成之后我們就可以動(dòng)態(tài)設(shè)置評(píng)分來回顯之前的評(píng)分，但是經(jīng)常我們需要與控件交互，動(dòng)態(tài)地設(shè)置分?jǐn)?shù)，所以我們還需要重寫onTouchEvent方法完成事件處理。

事件處理

評(píng)分需要隨著手指的移動(dòng)而動(dòng)態(tài)變化，這里我們記錄下當(dāng)前手指所在的位置，如果在星星上面，就算出當(dāng)前位置距離星星左邊的長度占據(jù)整個(gè)星星寬度的百分比，然后根據(jù)設(shè)置的stepSize參數(shù)動(dòng)態(tài)微調(diào)總評(píng)分。

評(píng)分監(jiān)聽

我們還需要將評(píng)分暴露給外部，處理主動(dòng)調(diào)用getRating()方法獲取之外，我們還可以提供一個(gè)監(jiān)聽接口，實(shí)時(shí)提供回調(diào)。

功能事件比較簡單，只需要在事件處理的時(shí)候，微調(diào)總評(píng)分完成之后回調(diào)一下數(shù)據(jù)就可以了。

if (onRatingChangeListener != null) {
    onRatingChangeListener.onRatingChange(rating);
}

外部使用

ratingBar.setOnRatingChangeListener{
    ratingText.text = "當(dāng)前評(píng)分:${it}"
}

總結(jié)