Android自定义星星评分控件

下面为控件的实现历程：
此控件高效，直接使用ondraw绘制，先亮照：

由于Android自身的星星评分控件样式可以改，但是他的大小不好调整的缺点，只能用small normal这样的style调整，自定义不强，因此击发了我自定义星星控件的欲望。

星星评分控件的设计，大体规划为：

需要两张图片，一颗亮星星，一颗空星星；（当然图片不一定是星星，其他图片也可以，现在实验就用星星就好了）星星数量，间距可以自定义，星星的最小步进为0.1，在用户使用的时候与Android自带的方法一样。

星星控件大体分为两层，第一层空星星，第二层亮星星，第一层固定，第二层动态绘制，这样就可以实现评分。

在画星星的时候，由于在xml得出回来的对象是drawable,不必再转换为bitmap绘制，故直接绘制drawable，并且提升效率。

绘制drawable需要两个方法就够了
1、设置绘制到那里：
setBounds（int left ,int top , int right ,int bottom）;
2、绘制：
draw（Canvas canvas）;

经过一个for循环，五颗空星星就出来了，哈哈

for （int i = 0;i < starCount;i++） { starEmptyDrawable.setBounds（starSize * i, 0, starSize * （i + 1）, starSize）; starEmptyDrawable.draw（canvas）;}

for （int i = 0;i < starCount;i++） { starEmptyDrawable.setBounds（starSize * i, 0, starSize * （i + 1）, starSize）; starEmptyDrawable.draw（canvas）;}for （int i = 0;i < starCount -1;i++） { starFillDrawable.setBounds（starSize * i, 0, starSize * （i + 1）, starSize）; starFillDrawable.draw（canvas）;}

上面几行代码成功强行装成了一个评了4分的

现在，显示几颗几颗的星星无压力，但是我们目标是需要步进为0.1的星星。
But
经过一系列的实验，发现Drawable对象没有能指定绘制需要的部分，也就是不能绘制半颗星星（反正找不到，找到可以评论告诉我），然后就采用了折中的方法，把Drawable对象变为Bitmap这样就好办了，再利用BitmapShader，想绘制多少就绘制多上（就是实现0.1步进），下面为1/3颗的效果：

转换方法：

private Bitmap drawableToBitmap（Drawable drawable） {if （drawable == null）return null;Bitmap bitmap = Bitmap.createBitmap（starSize, starSize, Bitmap.Config.ARGB_8888）;Canvas canvas = new Canvas（bitmap）;drawable.setBounds（0, 0, starSize, starSize）;drawable.draw（canvas）;return bitmap; }

把Bitmap转换为画笔绘制：

paint = new Paint（）;paint.setAntiAlias（true）;paint.setShader（new BitmapShader（starFillBitmap, BitmapShader.TileMode.CLAMP, BitmapShader.TileMode.CLAMP））;

在ondraw（）方法绘制（三分之一个）

canvas.drawRect（0,0,starSize/3,starSize,paint）;
原理就是这样，剩下就是逻辑问题了，以下为星星控件代码：

package com.dming.starbar;import android.content.Context;import android.content.res.TypedArray;import android.graphics.Bitmap;import android.graphics.BitmapShader;import android.graphics.Canvas;import android.graphics.Paint;import android.graphics.drawable.Drawable;import android.util.AttributeSet;import android.view.MotionEvent;import android.view.View;/** * Created by DMing on 2016/7/18. * */public class StarBar extends View{ private int starDistance = 0; //星星间距 private int starCount = 5; //星星个数 private int starSize;//星星高度大小，星星一般正方形，宽度等于高度 private float starMark = 0.0F; //评分星星 private Bitmap starFillBitmap; //亮星星 private Drawable starEmptyDrawable; //暗星星 private OnStarChangeListener onStarChangeListener;//监听星星变化接口 private Paint paint; //绘制星星画笔 private boolean integerMark = false; public StarBar（Context context, AttributeSet attrs） {super（context, attrs）;init（context, attrs）; } public StarBar（Context context, AttributeSet attrs, int defStyleAttr） {super（context, attrs, defStyleAttr）;init（context, attrs）; } /*** 初始化UI组件** @param context* @param attrs*/ private void init（Context context, AttributeSet attrs）{setClickable（true）;TypedArray mTypedArray = context.obtainStyledAttributes（attrs, R.styleable.RatingBar）;this.starDistance = （int） mTypedArray.getDimension（R.styleable.RatingBar_starDistance, 0）;this.starSize = （int） mTypedArray.getDimension（R.styleable.RatingBar_starSize, 20）;this.starCount = mTypedArray.getInteger（R.styleable.RatingBar_starCount, 5）;this.starEmptyDrawable = mTypedArray.getDrawable（R.styleable.RatingBar_starEmpty）;this.starFillBitmap = drawableToBitmap（mTypedArray.getDrawable（R.styleable.RatingBar_starFill））;mTypedArray.recycle（）;paint = new Paint（）;paint.setAntiAlias（true）;paint.setShader（new BitmapShader（starFillBitmap, BitmapShader.TileMode.CLAMP, BitmapShader.TileMode.CLAMP））; } /*** 设置是否需要整数评分* @param integerMark*/ public void setIntegerMark（boolean integerMark）{this.integerMark = integerMark; } /*** 设置显示的星星的分数** @param mark*/ public void setStarMark（float mark）{if （integerMark） { starMark = （int）Math.ceil（mark）;}else { starMark = Math.round（mark * 10） * 1.0f / 10;}if （this.onStarChangeListener ！= null） { this.onStarChangeListener.onStarChange（starMark）; //调用监听接口}invalidate（）; } /*** 获取显示星星的数目** @return starMark*/ public float getStarMark（）{return starMark; } /*** 定义星星点击的监听接口*/ public interface OnStarChangeListener {void onStarChange（float mark）; } /*** 设置监听* @param onStarChangeListener*/ public void setOnStarChangeListener（OnStarChangeListener onStarChangeListener）{this.onStarChangeListener = onStarChangeListener; } @Override protected void onMeasure（int widthMeasureSpec, int heightMeasureSpec） {super.onMeasure（widthMeasureSpec, heightMeasureSpec）;setMeasuredDimension（starSize * starCount + starDistance * （starCount - 1）, starSize）; } @Override protected void onDraw（Canvas canvas） {super.onDraw（canvas）;if （starFillBitmap == null || starEmptyDrawable == null） { return;}for （int i = 0;i < starCount;i++） { starEmptyDrawable.setBounds（（starDistance + starSize） * i, 0, （starDistance + starSize） * i + starSize, starSize）; starEmptyDrawable.draw（canvas）;}if （starMark > 1） { canvas.drawRect（0, 0, starSize, starSize, paint）; if（starMark-（int）（starMark） == 0） {for （int i = 1; i < starMark; i++） { canvas.translate（starDistance + starSize, 0）; canvas.drawRect（0, 0, starSize, starSize, paint）;} }else {for （int i = 1; i < starMark - 1; i++） { canvas.translate（starDistance + starSize, 0）; canvas.drawRect（0, 0, starSize, starSize, paint）;}canvas.translate（starDistance + starSize, 0）;canvas.drawRect（0, 0, starSize * （Math.round（（starMark - （int） （starMark））*10）*1.0f/10）, starSize, paint）; }}else { canvas.drawRect（0, 0, starSize * starMark, starSize, paint）;} } @Override public boolean onTouchEvent（MotionEvent event） {int x = （int） event.getX（）;if （x < 0） x = 0;if （x > getMeasuredWidth（）） x = getMeasuredWidth（）;switch（event.getAction（））{ case MotionEvent.ACTION_DOWN: {setStarMark（x*1.0f / （getMeasuredWidth（）*1.0f/starCount））;break; } case MotionEvent.ACTION_MOVE: {setStarMark（x*1.0f / （getMeasuredWidth（）*1.0f/starCount））;break; } case MotionEvent.ACTION_UP: {break; }}invalidate（）;return super.onTouchEvent（event）; } /*** drawable转bitmap** @param drawable* @return*/ private Bitmap drawableToBitmap（Drawable drawable） {if （drawable == null）return null;Bitmap bitmap = Bitmap.createBitmap（starSize, starSize, Bitmap.Config.ARGB_8888）;Canvas canvas = new Canvas（bitmap）;drawable.setBounds（0, 0, starSize, starSize）;drawable.draw（canvas）;return bitmap; }}

attrs的文件：

<?xml version="1.0" encoding="utf-8"?><resources> <declare-styleable name="RatingBar"><！--星星间距--><attr format="dimension" name="starDistance"/><！--星星大小--><attr format="dimension" name="starSize"/><！--星星个数--><attr format="integer" name="starCount"/><！--星星空图--><attr format="reference" name="starEmpty"/><！--星星满图--><attr format="reference" name="starFill"/> </declare-styleable></resources>

XML的使用方式：

 <com.dming.starbar.StarBarandroid:id="@+id/starBar"android:layout_below="@+id/display"android:layout_width="wrap_content"android:layout_height="wrap_content"ratingbar:starEmpty="@drawable/star_empty"ratingbar:starFill="@drawable/star_full"ratingbar:starDistance="5dp"ratingbar:starCount="8"ratingbar:starSize="30dp"/>

<重点>工程源码：http://xiazai.jb51.net/201701/yuanma/AndroidStarBar（jb51.net）.rar
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。