Android自定义控件简单实现ratingbar效果

先上图：

一开始让我自定义控件我是拒绝的，因为android很早以前就有一个控件ratingbar，但是设置样式的时候我发现把图片设置小一点就显示不全，一直找不到解办法!（可以设置系统的自带的小样式），反正就是无法任意的改变星星的大小！反正很坑啊。

下面来描述这个控件需要实现的功能：

1：水平放置，布局文件里面可以设置星星图标和背景星星，宽高，边距，星星数量，当前星级

2；实现点击效果

3：添加点击的监听器

下面实现第一步：

定义属性

<!--自定星级控件-->
<declare-styleable name="StarView">
    <attr name="mImageWidth" format="dimension"/>
    <attr name="mImageHeight" format="dimension" />
    <attr name="mDefaultImageId" format="reference" />
    <attr name="mClickImageId" format="reference" />
    <attr name="mMargin" format="dimension" />
    <attr name="mStarNum" format="integer" />
    <attr name="mStarChoose" format="integer" />
</declare-styleable>

本控件继承线性布局的starbar，代码过于简单，直接贴出来

package cn.ihealthcom.ihealth.widget;

import android.content.Context;
import android.content.res.TypedArray;
import android.util.AttributeSet;
import android.view.View;
import android.widget.ImageView;
import android.widget.LinearLayout;

import cn.ihealthcom.ihealth.R;

/**
 * 简单实现星级评选控件：内部填充多个ImageView
 * 继承LinearLayout 设置水平方向
 * Created by qiuchunjia on 2016/4/12.
 */
public class StarView extends LinearLayout {
    private int mImageWidth = ;  //图片设置默认的宽度
    private int mImageHeight = ; //图片设置默认的高度
    private int mDefaultImageId = R.drawable.ic_launcher;
    private int mClickImageId = R.drawable.ic_launcher;
    private int mMargin = ;   //图片之间默认的margin
    private int mStarNum = ;  //星星默认的个数
    private int mStarChoose = ;  //默认默认是三颗星
    private boolean isClick = true;

    private OnStarItemClickListener mStarItemClickListener;

    public StarView(Context context, AttributeSet attrs) {
        super(context, attrs);
        initData(context, attrs);
    }

    public StarView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        initData(context, attrs);
    }

    /**
     * 初始化数据
     *
     * @param context
     * @param attrs
     */
    private void initData(Context context, AttributeSet attrs) {
        this.setOrientation(HORIZONTAL);  //设置水平
        TypedArray a = context.getTheme().obtainStyledAttributes(attrs,
                R.styleable.StarView, , );
        int n = a.getIndexCount();

        for (int i = ; i < n; i++) {
            int attr = a.getIndex(i);
            switch (attr) {
                case R.styleable.StarView_mImageWidth:
                    mImageWidth = (int) a.getDimension(attr, mImageWidth);
                    break;
                case R.styleable.StarView_mImageHeight:
                    mImageHeight = (int) a.getDimension(attr, mImageHeight);
                    break;
                case R.styleable.StarView_mDefaultImageId:
                    mDefaultImageId = a.getResourceId(attr, mDefaultImageId);
                    break;
                case R.styleable.StarView_mClickImageId:
                    mClickImageId = a.getResourceId(attr, mClickImageId);
                    break;
                case R.styleable.StarView_mMargin:
                    mMargin = (int) a.getDimension(attr, mMargin);
                    break;
                case R.styleable.StarView_mStarNum:
                    mStarNum = a.getInt(attr, mStarNum);
                    break;
                case R.styleable.StarView_mStarChoose:
                    mStarChoose = a.getInt(attr, mStarChoose);
                    break;
            }
        }
        a.recycle();

    }

    @Override
    protected void onFinishInflate() {
        super.onFinishInflate();
        setStarNum(mStarNum);  //设置个数
    }

    /**
     * 设置星星数量
     *
     * @param number
     */
    public void setStarNum(int number) {
        if (number <= ) {
            try {
                throw new Exception("设置的数据不能小于等于零");
            } catch (Exception e) {
                e.printStackTrace();
            }
        }
        this.removeAllViews(); //清空所有view
        for (int i = ; i < number; i++) {
            ImageView imageView = new ImageView(getContext());
            final LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(mImageWidth, mImageHeight);
            layoutParams.leftMargin = mMargin;
            layoutParams.rightMargin = mMargin;
            imageView.setLayoutParams(layoutParams);
            this.addView(imageView);
            imageView.setImageResource(mDefaultImageId);
            setStarOnClick(imageView, i);
        }
        setCurrentChoose(mStarChoose);  //设置当前选择
    }

    /**
     * 设置点击事件
     *
     * @param imageView
     * @param i
     */
    private void setStarOnClick(final ImageView imageView, final int i) {
        if (imageView != null) {
            imageView.setOnClickListener(new OnClickListener() {
                @Override
                public void onClick(View view) {
                    resetDefaultImage();
                    setCurrentChoose(i+);
                    if (mStarItemClickListener != null) {
                        mStarItemClickListener.onItemClick(imageView, i);
                    }
                }
            });
        }
    }

    /**
     * 设置当前选择
     *
     * @param index
     */
    private void setCurrentChoose(int index) {
        if(isClick){
            for (int i = ; i < index; i++) {
                ImageView imageView = (ImageView) getChildAt(i);
                imageView.setImageResource(mClickImageId);
            }
        }
    }

    /**
     * 重置默认为默认的图片
     */
    private void resetDefaultImage() {
        int cNum = getChildCount();
        for (int i = ; i < cNum; i++) {
            ImageView imageView = (ImageView) getChildAt(i);
            imageView.setImageResource(mDefaultImageId);
        }
    }

    public int getImageWidth() {
        return mImageWidth;
    }

    public void setImageWidth(int mImageWidht) {
        this.mImageWidth = mImageWidht;
    }

    public int getImageHeight() {
        return mImageHeight;
    }

    public void setImageHeight(int mImageHeight) {
        this.mImageHeight = mImageHeight;
    }

    public int getDefaultImageId() {
        return mDefaultImageId;
    }

    public void setDefaultImageId(int resouceId) {
        this.mDefaultImageId = mDefaultImageId;
    }

    public int getClickImageId() {
        return mClickImageId;
    }

    public void setClickImageId(int mClickImageId) {
        this.mClickImageId = mClickImageId;
    }

    public OnStarItemClickListener getStarItemClickListener() {
        return mStarItemClickListener;
    }

    public void setmStarItemClickListener(OnStarItemClickListener mStarItemClickListener) {
        this.mStarItemClickListener = mStarItemClickListener;
    }

    /**
     * 星星点击事件
     */
    public interface OnStarItemClickListener {
        public void onItemClick(View view, int pos);
    }

}

代码中只实现了ratingbar常用的功能，能满足项目的需求.xml使用

<cn.ihealthcom.ihealth.widget.StarView
    android:layout_alignParentRight="true"
    android:layout_marginLeft="5dp"
    android:layout_marginRight="10dp"
    android:id="@+id/start_view"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    fresco:mClickImageId="@mipmap/star_y"
    fresco:mDefaultImageId="@mipmap/star_n"
    fresco:mImageHeight="@dimen/margin_15dp"
    fresco:mImageWidth="@dimen/margin_15dp"
    fresco:mMargin="2dp"
    fresco:mStarChoose=""
    fresco:mStarNum="" />

下面来看看同一张切图的设置不同的宽高显示的效果

代码和功能都比较简单就不做过多的解释了