自定义卡劵之——CardVoucherView

在写这篇博文之前我首先感谢张鸿洋大神的公众号推送，其次就是http://blog.csdn.net/yissan/article/details/51429281这篇博文的主人。

这篇文章主要就是围绕着一个数学公式展开的：

circleNum = (int) ((w-gap)/(2*radius+gap)); 
这里gap就是圆间距，radius是圆半径，w是view的宽。

下面是我扩展后的运行结果：

1、四个边都做处理的

2、水平处理的

3、垂直处理的

其实都用了一个Canvas类实现的 ，在学习了H5的canvas标签后我觉得和安卓的Canvas类的用法基本对应，可以看出语言是相通的。

由于源码太多，我就不一一贴出，取其中一个类作为参考：

/**
 * Created by rongtao on 2016/5/24.
 */
public class CardVoucherView2 extends LinearLayout {
    private Paint mPaint;
    /**
     * 圆间距
     */
    private float mGap = 8;

    public void setRadius(float radius) {
        mRadius = radius;
    }

    public void setGap(float gap) {
        mGap = gap;
    }

    /**
     * 半径
     */
    private float mRadius = 10;
    /**
     * 圆数量
     */
    private int mCircleNum_H;
    private int mCircleNum_V;
    /**
     * 除过圆和间隙外多余出来的部分
     */
    private float mRemain_H;//水平
    private float mRemain_V;//垂直
    /*
       指定绘制的 方向
     */
    public final static int DRAW_HORIZONTAL=0;
    public final static int DRAW_VERTICAL=1;
    private int mOrientation=DRAW_HORIZONTAL;

    //设置画笔的颜色
    private int mPaintColor=Color.WHITE;
    @Override
    public void setOrientation(int orientation) {
        mOrientation = orientation;
    }

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

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

    }

    public CardVoucherView2(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init();
    }


    private void init() {
        mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
        mPaint.setDither(true);
        mPaint.setColor(mPaintColor);
        mPaint.setStyle(Paint.Style.FILL);
    }

    /**
     *  圆数量的 计算公式 circleNum = (int) ((w-gap)/(2*radius+gap));
     * @param w
     * @param h
     * @param oldw
     * @param oldh
     */
    @Override
    protected void onSizeChanged(int w, int h, int oldw, int oldh) {
        super.onSizeChanged(w, h, oldw, oldh);
        switch (mOrientation){
            case DRAW_HORIZONTAL:
                measureHorCicleNum(w);
                break;
            case DRAW_VERTICAL:
                measurehValCicleNum(h);
                break;
            default:
                measureHorCicleNum(w);
                measurehValCicleNum(h);
                break;
        }


    }

    /**
     * 测量水平的值
     * @param w
     */
    private void measureHorCicleNum(int w) {
        if(mRemain_H==0){
            mRemain_H=(w-mGap)%(mRadius*2+mGap);
        }
        mCircleNum_H=(int)((w-mGap)/(mRadius*2+mGap));
    }
    /**
     * 测量垂直的值
     * @param h
     */
    private void measurehValCicleNum(int h) {
        if(mRemain_V==0){
            mRemain_V=(h-mGap)%(mRadius*2+mGap);
        }
        mCircleNum_V=(int)((h-mGap)/(mRadius*2+mGap));
    }

    /**
     * 绘制不同方向上的原型锯齿
     * @param canvas
     */
    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
       switch (mOrientation){
           case DRAW_HORIZONTAL:
               drawHorCircle(canvas);
               break;
           case DRAW_VERTICAL:
               drawValCircle(canvas);
               break;
           default:
               drawHorCircle(canvas);
               drawValCircle(canvas);
               break;
       }

    }

    /**
     * 绘制水平的圆
     * @param canvas
     */
    private void drawHorCircle(Canvas canvas) {
        for (int i=0;i<mCircleNum_H;i++){
            float x = mGap+mRadius+mRemain_H/2+((mGap+mRadius*2)*i);
            // 定义椭圆对象
            RectF rectf = new RectF();
            // 设置椭圆大小
            rectf.left =x-mRadius;
            rectf.right = x+mRadius;
            rectf.top = 0;
            rectf.bottom = mRadius;
            // 绘制椭圆
            canvas.drawOval(rectf, mPaint);
            rectf.top = getHeight()-mRadius;
            rectf.bottom = getHeight();
            // 绘制椭圆
            canvas.drawOval(rectf, mPaint);
        }

    }
    /**
     * 绘制垂直的圆
     * @param canvas
     */
    private void drawValCircle(Canvas canvas) {
        for (int i=0;i<mCircleNum_V;i++){
            float y = mGap+mRadius+mRemain_V/2+((mGap+mRadius*2)*i);
            // 定义椭圆对象
            RectF rectf1 = new RectF();
            // 设置椭圆大小
            rectf1.left =0;
            rectf1.right = mRadius;
            rectf1.top = y-mRadius;
            rectf1.bottom = y+mRadius;
            // 绘制椭圆
            canvas.drawOval(rectf1, mPaint);
            rectf1.left = getWidth()-mRadius;
            rectf1.right = getWidth();
            // 绘制椭圆
            canvas.drawOval(rectf1, mPaint);
        }
    }
}

源码下载:http://download.csdn.net/detail/jiang_rong_tao/9529581

今天就这样了，有时间再扩展，开始工作，老大开始催了。