Android自定义优惠券解析

自定义优惠券View在github上已经很多了，自己做也没什么特色，参考了网上的实现方式，对实现原理有了一些自己的理解，看代码总是很容易的，敲的过程去揣摩别人的思路，真正去理解才是我们要做的。

首先来看效果一：

这是网上流行的效果

看效果，主要是上下画圆，思路就是draw圆来覆盖掉布局背景，从而实现波浪效果，下面来看看怎么计算。

第一步：思考我们需要设置哪些参数

   //圆的半径private int radius=10;//间隔长度private int mLength=8;//画笔private Paint mPaint;//圆的个数private int mCircleNum;//不能整除时的间隔private int remain;

这里讲一下不能整除时的间隔，如果能整除的情况下View的width=（2*半径+间隔）*圆的个数+间隔，这样计算没有问题，但是当view的宽度比这个距离要大一点的时候，就是不满足整除的时候，最两侧的间距要稍微大一点，这就需要计算不能整除时的间隔。

 protected void onSizeChanged(int w, int h, int oldw, int oldh) {super.onSizeChanged(w, h, oldw, oldh);//获取不能整除时的间隔remain = (w - mLength) % (2 * radius + mLength);//获取圆的个数mCircleNum = (w - mLength) / (2 * radius + mLength);}@Overrideprotected void onDraw(Canvas canvas) {super.onDraw(canvas);for (int i = 0; i < mCircleNum; i++) {//计算圆x轴的坐标float x = mLength + radius + remain / 2 + ((mLength + radius * 2) * i);//上边花园canvas.drawCircle(x, 0, radius, mPaint);//下边画圆canvas.drawCircle(x, getHeight(), radius, mPaint);}}

效果：

这是对前人代码的理解，当然我们还需要在考虑如何在此基础添加什么的样式！

效果1：

在两侧加虚线：

        Paint paint = new Paint();paint.setAntiAlias(true);paint.setColor(Color.WHITE);paint.setStyle(Paint.Style.STROKE);//加虚线paint.setPathEffect(new DashPathEffect(new float[]{24, 12}, 0));paint.setStrokeWidth(6);//只能路径加虚线，drawLine不行Path path=new Path();path.moveTo(remain/2+mLength+2*radius, 2*radius);path.lineTo(remain/2+mLength+2*radius, getHeight()-2*radius);canvas.drawPath(path, paint);//右侧虚线Path path2=new Path();path2.moveTo(getWidth()-remain/2-mLength-2*radius,2*radius);path2.lineTo(getWidth()-remain/2-mLength-2*radius,getHeight()-2*radius);canvas.drawPath(path2, paint);

距离可以根据需求来调整，这个没啥可说的额。

效果二：

加虚线边框

        Path path3=new Path();//左上坐标起点path3.moveTo(remain/2+mLength, 2*radius);//左下坐标path3.lineTo(remain/2+mLength, getHeight()-2*radius);//右下坐标path3.lineTo(getWidth()-remain/2-mLength,getHeight()-2*radius);//右上坐标path3.lineTo(getWidth()-remain/2-mLength,2*radius);//关闭边框path3.close();canvas.drawPath(path3, paint);

考虑：这样做或许只能适应自己的需求，而并不具有通用性。

要具有通用性，必须要用到自定义的属性，将种种变量封装起来，这样就可随意控制圆的大小，背景颜色，间隔大小，虚线等。

具体就不细说了，恩就先到这吧。

全部代码：

package com.example.com.testview;import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.DashPathEffect;
import android.graphics.Paint;
import android.graphics.Path;
import android.util.AttributeSet;
import android.widget.LinearLayout;/*** Created by Administrator on 2016/9/23.*/public class CardViews extends LinearLayout {//圆的半径private int radius = 10;//间隔长度private int mLength = 8;//画笔private Paint mPaint;//圆的个数private int mCircleNum;//不能整除时的间隔private int remain;public CardViews(Context context) {super(context);init();}public CardViews(Context context, AttributeSet attrs) {super(context, attrs);init();}public CardViews(Context context, AttributeSet attrs, int defStyleAttr) {super(context, attrs, defStyleAttr);init();}private void init() {mPaint = new Paint();mPaint.setAntiAlias(true);mPaint.setDither(true);mPaint.setColor(Color.WHITE);mPaint.setStyle(Paint.Style.FILL);}@Overrideprotected void onSizeChanged(int w, int h, int oldw, int oldh) {super.onSizeChanged(w, h, oldw, oldh);remain = (w - mLength) % (2 * radius + mLength);mCircleNum = (w - mLength) / (2 * radius + mLength);}@Overrideprotected void onDraw(Canvas canvas) {super.onDraw(canvas);for (int i = 0; i < mCircleNum; i++) {float x = mLength + radius + remain / 2 + ((mLength + radius * 2) * i);canvas.drawCircle(x, 0, radius, mPaint);canvas.drawCircle(x, getHeight(), radius, mPaint);}Paint paint = new Paint();paint.setAntiAlias(true);paint.setColor(Color.WHITE);paint.setStyle(Paint.Style.STROKE);paint.setPathEffect(new DashPathEffect(new float[]{24, 12}, 0));paint.setStrokeWidth(6);
//        Path path=new Path();
//        path.moveTo(remain/2+mLength+2*radius, 2*radius);
//        path.lineTo(remain/2+mLength+2*radius, getHeight()-2*radius);
//        canvas.drawPath(path, paint);
//
//        Path path2=new Path();
//        path2.moveTo(getWidth()-remain/2-mLength-2*radius,2*radius);
//        path2.lineTo(getWidth()-remain/2-mLength-2*radius,getHeight()-2*radius);
//        canvas.drawPath(path2, paint);Path path3=new Path();path3.moveTo(remain/2+mLength, 2*radius);path3.lineTo(remain/2+mLength, getHeight()-2*radius);path3.lineTo(getWidth()-remain/2-mLength,getHeight()-2*radius);path3.lineTo(getWidth()-remain/2-mLength,2*radius);path3.close();canvas.drawPath(path3, paint);}
}

参考：
http://blog.csdn.net/u012162503/article/details/51433490

更好的：
https://github.com/dongjunkun/CouponView

Android自定义优惠券解析相关推荐

android+自定义dns解析,安卓手机玩dnsmasq 搭建自己的DNS服务器
dnsmasq 是一款运行在 Linux 平台上非常优秀的 DNS 工具,具有上手简单,易于配置等优点.而我们的 Android 手机同样集成了 dnsmasq 可在内网搭建专属自己的 DNS 服务器 ...
android 自定义dns解析器,Android中DNS解析
当服务端IP变化,大量用户还是访问的以前的IP,连接不上服务器. 我们的客户端软件如何通过域名正确访问服务器?这里面主要涉及到DNS缓存的问题. 什么是DNS? DNS 是域名系统 (Domain N ...
Android自定义xml解析
<?xml version="1.0" encoding="utf-8"?> <resources><Users><U ...
Android 自定义view完全解析--带你通透了解自定义view
参考转自郭霖博客带你一步步深入了解View系列 Android LayoutInflater原理分析相信接触Android久一点的朋友对于LayoutInflater一定不会陌生,都会知道它主要是用 ...
Android自定义Activity切换动画完全解析
Android自定义Activity切换动画完全解析在Android开发中,Activity之间的切换是最常见的业务场景了,而且系统默认的Activity之间的切换都是带动画效果的(右进右出).但是 ...
Android 自定义View合集
http://blog.csdn.net/u011507982/article/details/51199644 自定义控件学习 https://github.com/GcsSloop/Androi ...
Android ActionBar完全解析，使用官方推荐的最佳导航栏(下) .
转载请注明出处:http://blog.csdn.net/guolin_blog/article/details/25466665 本篇文章主要内容来自于Android Doc,我翻译之后又做了些加工 ...
Android ActionBar完全解析，使用官方推荐的最佳导航栏(下)
转载请注明出处:http://blog.csdn.net/guolin_blog/article/details/25466665 本篇文章主要内容来自于Android Doc,我翻译之后又做了些加工 ...
Android Service完全解析，关于服务你所需知道的一切(下)
转载请注册出处:http://blog.csdn.net/guolin_blog/article/details/9797169 在上一篇文章中,我们学习了Android Service相关的许多重要 ...

Android自定义优惠券解析

Android自定义优惠券解析相关推荐

最新文章

热门文章