Android仿新浪微博雷达扫描效果

MR.甲

之前在新浪微博看到一个雷达效果，可以查看图

先说说这个效果

1.程序默认提示点击雷达，开始探索

2.当点击雷达，提示正在探索周边的人，同时展示雷达扫描效果，即雷达按钮绕中心旋转，展现波纹达到扫描效果，

3.当触摸雷达时，雷达按钮会缩小，然后手指离开时，雷达按钮会缩回原位

4.最后如果扫描到周边的人，卡片显示周边人的信息，如果没有扫描到，则提示未能探索到周边的人，请稍后再试，同时关闭扫描效果

这里就不卡片展示周边人这个效果，毕竟是仿制，我们只需要关注动画效果，所以做个每两秒执行扫描效果一周，执行3遍显示为没有搜索到周边的人就行了

说说当中的技术点

1.首先是要熟悉canvas，paint,，其中canvas的画圆，画图片（之所以要熟悉画图片，是因为我们有四张图来显示成按钮，这四张图从新浪微博的app里获取，估计它也是这么干的），画文字等要熟悉。

2.雷达按钮绕中心旋转，这就要涉及到矩阵了，因为雷达按钮绕中心旋转，实际上也是对图片进行旋转操作，这样的话Matrix就比较合适了，至于旋转的角度怎么得到，用ValueAnimator比较合适，它可以在你设定的时间内，获取到你设定的两个值（这里指旋转角度，0,到360）之间的速率的变化值，然后刷新View的旋转角度就可以达到旋转的效果了

3.雷达按钮的缩放，原理同旋转，只不过我们关注的是缩放的比率而已

4.雷达的扫描效果，这个可以具体看看微博的效果，它是首先启动灰色波纹效果，没多久白色波纹效果与灰色效果同时抵达，就像波浪，后边的波浪把前一次波浪冲抵，当到达一定程度的时候显示灰色线波纹，达到波浪消失的效果，这里灰色波浪与白色波浪的冲抵效果，我用到了ValueAnimator里的Interpolator，其中分别为灰色波纹为减速DecelerateInterpolator,白色为AccelerateInterpolator,灰色线波纹为LinearInterpolator,一个减速，一个加速，达到追击的效果，一个线性，达到逐渐消失的效果

来看看我们的效果图，请查看附件：

gif录制效果不是很好，大家会给大家提供链接，自行下载查看效果

现在上自定义源码：

package com.RadarScanView.app;
import android.animation.Animator;
import android.animation.AnimatorListenerAdapter;
import android.animation.ValueAnimator;
import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Matrix;
import android.graphics.Paint;
import android.graphics.Rect;
import android.os.Looper;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.view.View;
import android.view.animation.AccelerateInterpolator;
import android.view.animation.DecelerateInterpolator;
import android.view.animation.LinearInterpolator;
/**
* Created by Administrator on 2015/8/31.
*/
public class RadarScanView extends View {
//默认扫描图标
private Bitmap mIconScanBitmap;
//扫描时图标
private Bitmap mIconScaningBitmap;
//白色扫描图