自定义view——实现评分控件RatingBar的实现

首先看下效果图
这里写图片描述

星星是两个不同的图片

首先老套路:自定义属性

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <declare-styleable name="RatingBar">
        <attr name="starNormal" format="reference"/>
        <attr name="starFocus" format="reference"/>
        <attr name="gradeNumber" format="integer"/>
    </declare-styleable>
</resources>

自定义RatingBar,绘制两张图片,根据getX的位置绘制不同的图片,比较简单直接贴源码


public class RatingBar extends View {
    private Bitmap mStarNormalBitmap, mStarFocusBitmap;
    private int mGradeNumber = 5;
    private int mCurrentGrade = 0;

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

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

    public RatingBar(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        TypedArray ta = context.obtainStyledAttributes(attrs, R.styleable.RatingBar);
        int starNormalId = ta.getResourceId(R.styleable.RatingBar_starNormal, 0);
        if (starNormalId == 0) {
            throw new RuntimeException("请设置属性 starNormal ");
        }
        mStarNormalBitmap = BitmapFactory.decodeResource(getResources(), starNormalId);
        int starFocusId = ta.getResourceId(R.styleable.RatingBar_starFocus, 0);
        if (starFocusId == 0) {
            throw new RuntimeException("请设置属性 starFocus ");
        }
        mStarFocusBitmap = BitmapFactory.decodeResource(getResources(), starFocusId);

        mGradeNumber = ta.getInt(R.styleable.RatingBar_gradeNumber, mGradeNumber);
        ta.recycle();
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        int height = mStarFocusBitmap.getHeight();
        int width = (mStarFocusBitmap.getWidth()+getPaddingLeft()) * mGradeNumber;
        setMeasuredDimension(width, height);
    }

    @Override
    protected void onDraw(Canvas canvas) {
        for (int i = 0; i < mGradeNumber; i++) {
            int x = i * (mStarFocusBitmap.getWidth()+getPaddingLeft());
            if(mCurrentGrade>i) {
                canvas.drawBitmap(mStarFocusBitmap, x, 0, null);
            }else{
                canvas.drawBitmap(mStarNormalBitmap, x, 0, null);
            }
        }
    }

    @Override
    public boolean onTouchEvent(MotionEvent event) {
        switch (event.getAction()) {
            //case MotionEvent.ACTION_DOWN:// 按下 尽量减少onDraw()的调用
            case MotionEvent.ACTION_MOVE:
            //case MotionEvent.ACTION_UP:// 抬起 尽量减少onDraw()的调用
                float x = event.getX();
                //获取当前的评分
                int currentGrade = (int) (x / mStarFocusBitmap.getWidth()) + 1; //当前评分
                if (currentGrade < 0) {
                    currentGrade = 0;
                }
                if (currentGrade > mGradeNumber) {
                    currentGrade = mGradeNumber;
                }
                if (currentGrade == mCurrentGrade) {
                    return true;//消费当前事件。减少invalidate
                }
                // 再去刷新显示
                mCurrentGrade = currentGrade;
                invalidate();
                break;
        }
        return true;//消费当前事件
    }
}

布局使用

 <com.yijia.a03_.RatingBar
        app:gradeNumber="5"
        android:padding="5dp"
        android:paddingLeft="5dp"
        app:starNormal="@drawable/star_normal"
        app:starFocus="@drawable/star_selected"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值