Android 自定義五星評分控件

先看效果圖:


錄屏.gif

android 現(xiàn)在已經(jīng)自帶RateingBar,當(dāng)然原生會更好些梦碗,這里算是拋磚引玉吧。希望對學(xué)習(xí)自定義控件的小伙伴有點幫助刃滓。
一 自定義屬性
這里需要三個屬性
...
<?xml version="1.0" encoding="utf-8"?>
<resources>
<declare-styleable name="RatingBar">
<attr name="iconNormal" format="reference"/>
<attr name="iconSelect" format="reference"/>
<attr name="iconNumber" format="integer"/>
</declare-styleable>
</resources>
...
默認(rèn)星星圖片和選中后的星星圖片以及星星數(shù)量

二 新建RatingBar類
1,get 屬性
...
TypedArray typedValue=context.obtainStyledAttributes(attrs, R.styleable.RatingBar);
//首先拿到圖片屬性的resourceId
int iconSelectId= typedValue.getResourceId(R.styleable.RatingBar_iconSelect,0);
if(iconSelectId==0) throw new RuntimeException("屬性設(shè)置=0");//如果沒有設(shè)置圖片拋出一個運(yùn)行時異常

    int iconNormalid=typedValue.getResourceId(R.styleable.RatingBar_iconNormal,0);
    if(iconNormalid==0)throw new RuntimeException("屬性設(shè)置=0");
  //通過resource 解析達(dá)到圖片的bitmap
    bitmapSelect=BitmapFactory.decodeResource(context.getResources(),iconSelectId);
    bitmapNormal=BitmapFactory.decodeResource(getResources(),iconNormalid);
    //得到星星數(shù)量屬性
    starNumber=typedValue.getInteger(R.styleable.RatingBar_iconNumber,starNumber);
    typedValue.recycle();

...
上面有個問題困擾我,一直沒搞懂,如果有了解的可以指點下谈火。問題如下:
我先是把兩個星星圖片放到了mipmap里面,然后通過上面的代碼拿到bitmap舌涨,但是這時的bitmap.getWidth()返回值是0糯耍,這樣就沒法畫出星星。我嘗試了好多方法囊嘉,最后還是把兩個圖片放到drawable文件夾下才可以温技。why?
2.onMeasure

...
int widthSize=bitmapSelect.getWidth()starNumber+getPaddingRight()(starNumber-1);
int heightSize=bitmapSelect.getHeight();
setMeasuredDimension(widthSize,heightSize);
...
如果不加padding,星星就會連到一起扭粱,所以加上paddingRight舵鳞,高度就是bitmap圖片的高度。
3.onDraw
...
for (int i = 0; i <starNumber ; i++) {
//坐標(biāo)x=圖片的寬度+paddingRight琢蛤,有幾個圖片就乘上幾
float x=bitmapNormal.getWidth() * i+getPaddingRight()*i;
if(mCurrentX>i)//mCurrent 代表當(dāng)前黃色星星在哪個位置上
canvas.drawBitmap(bitmapSelect, x, 0, null);
else
canvas.drawBitmap(bitmapNormal, x, 0, null);
}
..
4 onTouch
...
case DOWN
case MOVE
float x=getx()/(bitmap.width()+getPaddingRight());//finger down 在第幾個星星的x位置
if(x==mCurrentx)return true;
mCurrentx=x;
invalidate();

三 使用
...
<com.ui.main.RatingBar
android:id="@+id/ratingBar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingRight="15dp"
app:iconNormal="@drawable/starnormal"
app:iconNumber="5"
app:iconSelect="@drawable/starselected" />
...
...
四 源碼
...
public class RatingBar extends View {

final String TAG="RatingBarTAG";
/**
 * 需要解析的圖片
 */
private Bitmap bitmapNormal,bitmapSelect;
/**
 * star 數(shù)量
 */
private int starNumber=5;
/**
 * 當(dāng)前手指所在的位置是第幾個星星的位置
 */
private float mCurrentX=0f;

public RatingBar(Context context) {
    this(context,null);
}

public RatingBar(Context context, @Nullable AttributeSet attrs) {
    this(context, attrs,0);
}

public RatingBar(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
    super(context, attrs, defStyleAttr);
    TypedArray typedValue=context.obtainStyledAttributes(attrs, R.styleable.RatingBar);
    int iconSelectId= typedValue.getResourceId(R.styleable.RatingBar_iconSelect,0);
    if(iconSelectId==0) throw new RuntimeException("屬性設(shè)置=0");

    int iconNormalid=typedValue.getResourceId(R.styleable.RatingBar_iconNormal,0);
    if(iconNormalid==0)throw new RuntimeException("屬性設(shè)置=0");

    bitmapSelect=BitmapFactory.decodeResource(context.getResources(),iconSelectId);
    bitmapNormal=BitmapFactory.decodeResource(getResources(),iconNormalid);

    starNumber=typedValue.getInteger(R.styleable.RatingBar_iconNumber,starNumber);
    typedValue.recycle();

}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
    super.onMeasure(widthMeasureSpec, heightMeasureSpec);

    int widthSize=bitmapSelect.getWidth()*starNumber+getPaddingRight()*(starNumber-1);
    int heightSize=bitmapSelect.getHeight();
    setMeasuredDimension(widthSize,heightSize);
}

@Override
protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
        for (int i = 0; i <starNumber ; i++) {
            //坐標(biāo)x=圖片的寬度+paddingRight蜓堕,有幾個圖片就乘上幾
            float x=bitmapNormal.getWidth() * i+getPaddingRight()*i;
            if(mCurrentX>i)
                canvas.drawBitmap(bitmapSelect, x, 0, null);
            else
                canvas.drawBitmap(bitmapNormal, x, 0, null);
        }

}

@Override
public boolean onTouchEvent(MotionEvent event) {

    switch (event.getAction()) {
        case MotionEvent.ACTION_DOWN:
        case MotionEvent.ACTION_MOVE:
            float x= event.getX()/(bitmapSelect.getWidth()+getPaddingRight());
            if(x==mCurrentX){
                return true;
            }
            mCurrentX=x;
            invalidate();
            break;
    }
    return true;
}

}

...

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市博其,隨后出現(xiàn)的幾起案子套才,更是在濱河造成了極大的恐慌,老刑警劉巖慕淡,帶你破解...
    沈念sama閱讀 211,290評論 6 491
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件背伴,死亡現(xiàn)場離奇詭異,居然都是意外死亡峰髓,警方通過查閱死者的電腦和手機(jī)傻寂,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,107評論 2 385
  • 文/潘曉璐 我一進(jìn)店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來儿普,“玉大人崎逃,你說我怎么就攤上這事∶己ⅲ” “怎么了个绍?”我有些...
    開封第一講書人閱讀 156,872評論 0 347
  • 文/不壞的土叔 我叫張陵勒葱,是天一觀的道長。 經(jīng)常有香客問我巴柿,道長凛虽,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 56,415評論 1 283
  • 正文 為了忘掉前任广恢,我火速辦了婚禮凯旋,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘钉迷。我一直安慰自己至非,他們只是感情好,可當(dāng)我...
    茶點故事閱讀 65,453評論 6 385
  • 文/花漫 我一把揭開白布糠聪。 她就那樣靜靜地躺著荒椭,像睡著了一般。 火紅的嫁衣襯著肌膚如雪舰蟆。 梳的紋絲不亂的頭發(fā)上趣惠,一...
    開封第一講書人閱讀 49,784評論 1 290
  • 那天,我揣著相機(jī)與錄音身害,去河邊找鬼味悄。 笑死,一個胖子當(dāng)著我的面吹牛塌鸯,可吹牛的內(nèi)容都是我干的侍瑟。 我是一名探鬼主播,決...
    沈念sama閱讀 38,927評論 3 406
  • 文/蒼蘭香墨 我猛地睜開眼界赔,長吁一口氣:“原來是場噩夢啊……” “哼丢习!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起淮悼,我...
    開封第一講書人閱讀 37,691評論 0 266
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎揽思,沒想到半個月后袜腥,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 44,137評論 1 303
  • 正文 獨居荒郊野嶺守林人離奇死亡钉汗,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 36,472評論 2 326
  • 正文 我和宋清朗相戀三年羹令,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片损痰。...
    茶點故事閱讀 38,622評論 1 340
  • 序言:一個原本活蹦亂跳的男人離奇死亡福侈,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出卢未,到底是詐尸還是另有隱情肪凛,我是刑警寧澤堰汉,帶...
    沈念sama閱讀 34,289評論 4 329
  • 正文 年R本政府宣布,位于F島的核電站伟墙,受9級特大地震影響翘鸭,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜戳葵,卻給世界環(huán)境...
    茶點故事閱讀 39,887評論 3 312
  • 文/蒙蒙 一就乓、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧拱烁,春花似錦生蚁、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,741評論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至浦妄,卻和暖如春尼摹,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背剂娄。 一陣腳步聲響...
    開封第一講書人閱讀 31,977評論 1 265
  • 我被黑心中介騙來泰國打工蠢涝, 沒想到剛下飛機(jī)就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人阅懦。 一個月前我還...
    沈念sama閱讀 46,316評論 2 360
  • 正文 我出身青樓和二,卻偏偏與公主長得像,于是被迫代替她去往敵國和親耳胎。 傳聞我的和親對象是個殘疾皇子惯吕,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 43,490評論 2 348

推薦閱讀更多精彩內(nèi)容