Android仿QQ附近的人搜索展示功能

 1.概述

老规矩，先上图

原装货（就不录制gif了，大家可以自己在q群助手开启共享地理位置，返回群聊天页面就看到看到附近的人）：

看起来还是挺像的吧。

通过观察，我们可以获取得到如下关系

1.下面展示列表我们可以使用viewpager来实现（当然如果你不觉得麻烦，你也可以用horizontalscrollview来试试）

2.上面的扫描图，肯定是个viewgroup(因为里面的小圆点是可以点击的，如果是view的话，对于这些小圆点的位置的判断，以及对小圆点缩放动画的处理都会超级麻烦，难以实现)，所以我们肯定需要自定义viewgroup

3.确定好了是自定义viewgroup后，对于里面需要放什么对象呢？没错，就是n个小圆点+一个扫描的大圈圈。

有了上面的分析，我们基本可以确定我们的项目结构如下了：

下面将逐个击破，完成最终效果！

二.展示用的viewpager

通过上面的分析，可以确定我们首先需要一个been类 info

public class info {
private int portraitid;//头像id
private string name;//名字
private string age;//年龄
private boolean sex;//false为男，true为女
private float distance;//距离
public int getportraitid() {
return portraitid;
}
public void setportraitid(int portraitid) {
this.portraitid = portraitid;
}
public string getage() {
return age;
}
public void setage(string age) {
this.age = age;
}
public float getdistance() {
return distance;
}
public void setdistance(float distance) {
this.distance = distance;
}
public string getname() {
return name;
}
public void setname(string name) {
this.name = name;
}
public boolean getsex() {
return sex;
}
public void setsex(boolean sex) {
this.sex = sex;
}
}

因为我们想要viewpager左右滑动的时候，当滑动速度大于一定值，则可以一次滑动两个item，所以我们需要自定义一个获取速度的viewpager

public class customviewpager extends viewpager{
private long downtime;
private float lastx;
private float mspeed;
public customviewpager(context context) {
super(context);
}
public customviewpager(context context, attributeset attrs) {
super(context, attrs);
}
@override
public boolean dispatchtouchevent(motionevent ev) {
float x = ev.getx();
switch (ev.getaction()) {
case motionevent.action_down:
downtime = system.currenttimemillis();
lastx = x;
break;
case motionevent.action_move:
x = ev.getx();
break;
case motionevent.action_up:
//计算得到手指从按下到离开的滑动速度
mspeed = (x - lastx) * 1000 / (system.currenttimemillis() - downtime);
break;
}
return super.dispatchtouchevent(ev);
}
public float getspeed() {
return mspeed;
}
public void setspeed(float mspeed) {
this.mspeed = mspeed;
}
}

最后就是我们的mainacitivyt中进行相应的设置

public class mainactivity extends activity implements viewpager.onpagechangelistener, radarviewgroup.iradarclicklistener {
private customviewpager viewpager;
private relativelayout rycontainer;
private radarviewgroup radarviewgroup;
private int[] mimgs = {r.drawable.len, r.drawable.leo, r.drawable.lep,
r.drawable.leq, r.drawable.ler, r.drawable.les, r.drawable.mln, r.drawable.mmz, r.drawable.mna,
r.drawable.mnj, r.drawable.leo, r.drawable.leq, r.drawable.les, r.drawable.lep};
private string[] mnames = {"immortalz", "唐马儒", "王尼玛", "张全蛋", "蛋花", "王大锤", "叫兽", "哆啦a梦"};
private int mposition;
private fixedspeedscroller scroller;
private sparsearray<info> mdatas = new sparsearray<>();
@override
protected void oncreate(bundle savedinstancestate) {
super.oncreate(savedinstancestate);
setcontentview(r.layout.activity_main);
initview();
initdata();
/**
* 将viewpager所在容器的事件分发交给viewpager
*/
rycontainer.setontouchlistener(new view.ontouchlistener() {
@override
public boolean ontouch(view v, motionevent event) {
return viewpager.dispatchtouchevent(event);
}
});
viewpageradapter madapter = new viewpageradapter();
viewpager.setadapter(madapter);
//设置缓存数为展示的数目
viewpager.setoffscreenpagelimit(mimgs.length);
viewpager.setpagemargin(getresources().getdimensionpixeloffset(r.dimen.viewpager_margin));
//设置切换动画
viewpager.setpagetransformer(true, new zoomoutpagetransformer());
viewpager.addonpagechangelistener(this);
setviewpagerspeed(250);
new handler().postdelayed(new runnable() {
@override
public void run() {
radarviewgroup.setdatas(mdatas);
}
}, 1500);
radarviewgroup.setiradarclicklistener(this);
}
private void initdata() {
for (int i = 0; i < mimgs.length; i++) {
info info = new info();
info.setportraitid(mimgs[i]);
info.setage(((int) math.random() * 25 + 16) + "岁");
info.setname(mnames[(int) (math.random() * mnames.length)]);
info.setsex(i % 3 == 0 ? false : true);
info.setdistance(math.round((math.random() * 10) * 100) / 100);
mdatas.put(i, info);
}
}
private void initview() {
viewpager = (customviewpager) findviewbyid(r.id.vp);
radarviewgroup = (radarviewgroup) findviewbyid(r.id.radar);
rycontainer = (relativelayout) findviewbyid(r.id.ry_container);
}
/**
* 设置viewpager切换速度
*
* @param duration
*/
private void setviewpagerspeed(int duration) {
try {
field field = viewpager.class.getdeclaredfield("mscroller");
field.setaccessible(true);
scroller = new fixedspeedscroller(mainactivity.this, new accelerateinterpolator());
field.set(viewpager, scroller);
scroller.setmduration(duration);
} catch (nosuchfieldexception e) {
e.printstacktrace();
} catch (illegalaccessexception e) {
e.printstacktrace();
}
}
@override
public void onpagescrolled(int position, float positionoffset, int positionoffsetpixels) {
mposition = position;
}
@override
public void onpageselected(int position) {
radarviewgroup.setcurrentshowitem(position);
logutil.m("当前位置 " + mposition);
logutil.m("速度 " + viewpager.getspeed());
//当手指左滑速度大于2000时viewpager右滑（注意是item+2）
if (viewpager.getspeed() < -1800) {
viewpager.setcurrentitem(mposition + 2);
logutil.m("位置 " + mposition);
viewpager.setspeed(0);
} else if (viewpager.getspeed() > 1800 && mposition > 0) {
//当手指右滑速度大于2000时viewpager左滑（注意item-1即可）
viewpager.setcurrentitem(mposition - 1);
logutil.m("位置 " + mposition);
viewpager.setspeed(0);
}
}
@override
public void onpagescrollstatechanged(int state) {
}
@override
public void onradaritemclick(int position) {
viewpager.setcurrentitem(position);
}
class viewpageradapter extends pageradapter {
@override
public object instantiateitem(viewgroup container, final int position) {
final info info = mdatas.get(position);
//设置一大堆演示用的数据，麻里麻烦~~
view view = layoutinflater.from(mainactivity.this).inflate(r.layout.viewpager_layout, null);
imageview ivportrait = (imageview) view.findviewbyid(r.id.iv);
imageview ivsex = (imageview) view.findviewbyid(r.id.iv_sex);
textview tvname = (textview) view.findviewbyid(r.id.tv_name);
textview tvdistance = (textview) view.findviewbyid(r.id.tv_distance);
tvname.settext(info.getname());
tvdistance.settext(info.getdistance() + "km");
ivportrait.setimageresource(info.getportraitid());
if (info.getsex()) {
ivsex.setimageresource(r.drawable.girl);
} else {
ivsex.setimageresource(r.drawable.boy);
}
ivportrait.setonclicklistener(new view.onclicklistener() {
@override
public void onclick(view v) {
toast.maketext(mainactivity.this, "这是 " + info.getname() + " >.<", toast.length_short).show();
}
});
container.addview(view);
return view;
}
@override
public int getcount() {
return mimgs.length;
}
@override
public boolean isviewfromobject(view view, object object) {
return view == object;
}
@override
public void destroyitem(viewgroup container, int position, object object) {
view view = (view) object;
container.removeview(view);
}
}
}

在贴出mainacitivity对应的xml

<relativelayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/lkd"
android:paddingleft="5dp"
android:paddingright="5dp">
<mr_immortalz.com.modelqq.custom.radarviewgroup
android:id="@+id/radar"
android:layout_width="280dp"
android:layout_height="280dp"
android:layout_centerhorizontal="true"
android:layout_margintop="50dp">
<mr_immortalz.com.modelqq.custom.radarview
android:id="@id/id_scan_circle"
android:layout_width="280dp"
android:layout_height="280dp"/>
</mr_immortalz.com.modelqq.custom.radarviewgroup>
<relativelayout
android:id="@+id/ry_container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignparentbottom="true"
android:layout_marginbottom="25dp"
android:clipchildren="false">
<mr_immortalz.com.modelqq.custom.customviewpager
android:id="@+id/vp"
android:layout_width="130dp"
android:layout_height="160dp"
android:layout_centerinparent="true"
android:layout_marginleft="120dp"
android:layout_marginright="120dp"
android:clipchildren="false"
/>
</relativelayout>
</relativelayout>

注意如果我们想要让viewpager一次显示多个，需要设置其所在 父容器 android:clipchildren=”false”
意思就是不限制子view在其范围内。

细心的你可能会发现mainacitivity中有

viewpager.setpagetransformer(true, new zoomoutpagetransformer()); 

这个，没错，这个就是用来控制我们的切换动画（我在谷歌官方提供的这个基础上进行了修改，也是很好理解）

public class zoomoutpagetransformer implements viewpager.pagetransformer {
private static final float min_scale = 0.70f;
private static final float min_alpha = 0.5f;
public void transformpage(view view, float position) {
int pagewidth = view.getwidth();
int pageheight = view.getheight();
if (position < -1) { // [-infinity,-1)
// this page is way off-screen to the left.
view.setalpha(min_alpha);
view.setscalex(min_scale);
view.setscaley(min_scale);
} else if (position <= 1) { // [-1,1]
// modify the default slide transition to shrink the page as well
float scalefactor = math.max(min_scale, 1 - math.abs(position));
float vertmargin = pageheight * (1 - scalefactor) / 2;
float horzmargin = pagewidth * (1 - scalefactor) / 2;
if (position < 0) {
view.settranslationx(horzmargin - vertmargin / 2);
view.setscalex(1 + 0.3f * position);
view.setscaley(1 + 0.3f * position);
} else {
view.settranslationx(-horzmargin + vertmargin / 2);
view.setscalex(1 - 0.3f * position);
view.setscaley(1 - 0.3f * position);
}
// scale the page down (between min_scale and 1)
// fade the page relative to its size.
view.setalpha(min_alpha + (scalefactor - min_scale) / (1 - min_scale) * (1 - min_alpha));
} else { // (1,+infinity]
// this page is way off-screen to the right.
view.setscalex(min_scale);
view.setscaley(min_scale);
view.setalpha(min_alpha);
}
}
}

完成了上面这些代码，我们的viewpager就算搞定了

三.实现雷达扫描图

代码中也注释得很清楚了，当然因为要扫描，我们需要不停的转动，所以这里我们用到了矩阵变换matrix，扫描消息的停顿和传递我们用到了runnable ，如果要是觉得在向主线程一直投递变换的消息对主线程不好，你可以考虑下用surfaceview来实现

public class radarview extends view {
private paint mpaintline;//画圆线需要用到的paint
private paint mpaintcircle;//画圆需要用到的paint
private paint mpaintscan;//画扫描需要用到的paint
private int mwidth, mheight;//整个图形的长度和宽度
private matrix matrix = new matrix();//旋转需要的矩阵
private int scanangle;//扫描旋转的角度
private shader scanshader;//扫描渲染shader
private bitmap centerbitmap;//最中间icon
//每个圆圈所占的比例
private static float[] circleproportion = {1 / 13f, 2 / 13f, 3 / 13f, 4 / 13f, 5 / 13f, 6 / 13f};
private int scanspeed = 5;
private int currentscanningcount;//当前扫描的次数
private int currentscanningitem;//当前扫描显示的item
private int maxscanitemcount;//最大扫描次数
private boolean startscan = false;//只有设置了数据后才会开始扫描
private iscanninglistener iscanninglistener;//扫描时监听回调接口
public void setscanninglistener(iscanninglistener iscanninglistener) {
this.iscanninglistener = iscanninglistener;
}
private runnable run = new runnable() {
@override
public void run() {
scanangle = (scanangle + scanspeed) % 360;
matrix.postrotate(scanspeed, mwidth / 2, mheight / 2);
invalidate();
postdelayed(run, 130);
//开始扫描显示标志为true 且 只扫描一圈
if (startscan && currentscanningcount <= (360 / scanspeed)) {
if (iscanninglistener != null && currentscanningcount % scanspeed == 0
&& currentscanningitem < maxscanitemcount) {
iscanninglistener.onscanning(currentscanningitem, scanangle);
currentscanningitem++;
} else if (iscanninglistener != null && currentscanningitem == maxscanitemcount) {
iscanninglistener.onscansuccess();
}
currentscanningcount++;
}
}
};
public radarview(context context) {
this(context, null);
}
public radarview(context context, attributeset attrs) {
this(context, attrs, 0);
}
public radarview(context context, attributeset attrs, int defstyleattr) {
super(context, attrs, defstyleattr);
init();
post(run);
}

private void init() {
mpaintline = new paint();
mpaintline.setcolor(getresources().getcolor(r.color.line_color_blue));
mpaintline.setantialias(true);
mpaintline.setstrokewidth(1);
mpaintline.setstyle(paint.style.stroke);
mpaintcircle = new paint();
mpaintcircle.setcolor(color.white);
mpaintcircle.setantialias(true);
mpaintscan = new paint();
mpaintscan.setstyle(paint.style.fill_and_stroke);
}
@override
protected void onmeasure(int widthmeasurespec, int heightmeasurespec) {
setmeasureddimension(measuresize(widthmeasurespec), measuresize(widthmeasurespec));
mwidth = getmeasuredwidth();
mheight = getmeasuredheight();
mwidth = mheight = math.min(mwidth, mheight);
centerbitmap = bitmapfactory.decoderesource(getresources(), r.drawable.circle_photo);
//设置扫描渲染的shader
scanshader = new sweepgradient(mwidth / 2, mheight / 2,
new int[]{color.transparent, color.parsecolor("#84b5ca")}, null);
}
private int measuresize(int measurespec) {
int result = 0;
int specmode = measurespec.getmode(measurespec);
int specsize = measurespec.getsize(measurespec);
if (specmode == measurespec.exactly) {
result = specsize;
} else {
result = 300;
if (specmode == measurespec.at_most) {
result = math.min(result, specsize);
}
}
return result;
}
@override
protected void ondraw(canvas canvas) {
drawcircle(canvas);
drawscan(canvas);
drawcentericon(canvas);
}
/**
* 绘制圆线圈
*
* @param canvas
*/
private void drawcircle(canvas canvas) {
canvas.drawcircle(mwidth / 2, mheight / 2, mwidth * circleproportion[1], mpaintline); // 绘制小圆
canvas.drawcircle(mwidth / 2, mheight / 2, mwidth * circleproportion[2], mpaintline); // 绘制中圆
canvas.drawcircle(mwidth / 2, mheight / 2, mwidth * circleproportion[3], mpaintline); // 绘制中大圆
canvas.drawcircle(mwidth / 2, mheight / 2, mwidth * circleproportion[4], mpaintline); // 绘制大圆
canvas.drawcircle(mwidth / 2, mheight / 2, mwidth * circleproportion[5], mpaintline); // 绘制大大圆
}
/**
* 绘制扫描
*
* @param canvas
*/
private void drawscan(canvas canvas) {
canvas.save();
mpaintscan.setshader(scanshader);
canvas.concat(matrix);
canvas.drawcircle(mwidth / 2, mheight / 2, mwidth * circleproportion[4], mpaintscan);
canvas.restore();
}
/**
* 绘制最中间的图标
*
* @param canvas
*/
private void drawcentericon(canvas canvas) {
canvas.drawbitmap(centerbitmap, null,
new rect((int) (mwidth / 2 - mwidth * circleproportion[0]), (int) (mheight / 2 - mwidth * circleproportion[0]),
(int) (mwidth / 2 + mwidth * circleproportion[0]), (int) (mheight / 2 + mwidth * circleproportion[0])), mpaintcircle);
}

public interface iscanninglistener {
//正在扫描（此时还没有扫描完毕）时回调
void onscanning(int position, float scanangle);
//扫描成功时回调
void onscansuccess();
}
public void setmaxscanitemcount(int maxscanitemcount) {
this.maxscanitemcount = maxscanitemcount;
}
/**
* 开始扫描
*/
public void startscan() {
this.startscan = true;
}
}

四.完成小圆点的放置

现在我们的扫描图有了，对比发现我们还差啥？没错，就是小圆点

public class circleview extends view {
private paint mpaint;
private bitmap mbitmap;
private float radius = displayutils.dp2px(getcontext(),9);//半径
private float disx;//位置x
private float disy;//位置y
private float angle;//旋转的角度
private float proportion;//根据远近距离的不同计算得到的应该占的半径比例
public float getproportion() {
return proportion;
}
public void setproportion(float proportion) {
this.proportion = proportion;
}
public float getangle() {
return angle;
}
public void setangle(float angle) {
this.angle = angle;
}
public float getdisx() {
return disx;
}
public void setdisx(float disx) {
this.disx = disx;
}
public float getdisy() {
return disy;
}
public void setdisy(float disy) {
this.disy = disy;
}
public circleview(context context) {
this(context, null);
}
public circleview(context context, attributeset attrs) {
this(context, attrs, 0);
}
public circleview(context context, attributeset attrs, int defstyleattr) {
super(context, attrs, defstyleattr);
init();
}
private void init() {
mpaint = new paint();
mpaint.setcolor(getresources().getcolor(r.color.bg_color_pink));
mpaint.setantialias(true);
}
@override
protected void onmeasure(int widthmeasurespec, int heightmeasurespec) {
super.onmeasure(widthmeasurespec, heightmeasurespec);
setmeasureddimension(measuresize(widthmeasurespec), measuresize(heightmeasurespec));
}
private int measuresize(int measurespec) {
int result = 0;
int specmode = measurespec.getmode(measurespec);
int specsize = measurespec.getsize(measurespec);
if (specmode == measurespec.exactly) {
result = specsize;
} else {
result = displayutils.dp2px(getcontext(),18);
if (specmode == measurespec.at_most) {
result = math.min(result, specsize);
}
}
return result;
}
@override
protected void ondraw(canvas canvas) {
canvas.drawcircle(radius, radius, radius, mpaint);
if (mbitmap != null) {
canvas.drawbitmap(mbitmap, null, new rect(0, 0, 2 * (int) radius, 2 * (int) radius), mpaint);
}
}
public void setpaintcolor(int resid) {
mpaint.setcolor(resid);
invalidate();
}
public void setportraiticon(int resid) {
mbitmap = bitmapfactory.decoderesource(getresources(), resid);
invalidate();
}
public void clearportaiticon(){
mbitmap = null;
invalidate();
}
}

有了小圆点，我们最后只需要把扫描图和小圆点放在一起就好了 因为我们是想变扫描变出现小圆点，所以我们需要在radarview中定义一个接口iscanninglistener，告诉radarviewgroup我正在扫描，你快让小圆点出现吧

所以在radarviewgroup的onscanning中需要调用requestlayout();

public class radarviewgroup extends viewgroup implements radarview.iscanninglistener {
private int mwidth, mheight;//viewgroup的宽高
private sparsearray<float> scananglelist = new sparsearray<>();//记录展示的item所在的扫描位置角度
private sparsearray<info> mdatas;//数据源
private int datalength;//数据源长度
private int minitemposition;//最小距离的item所在数据源中的位置
private circleview currentshowchild;//当前展示的item
private circleview minshowchild;//最小距离的item
private iradarclicklistener iradarclicklistener;//雷达图中点击监听circleview小圆点回调接口
public void setiradarclicklistener(iradarclicklistener iradarclicklistener) {
this.iradarclicklistener = iradarclicklistener;
}
public radarviewgroup(context context) {
this(context, null);
}
public radarviewgroup(context context, attributeset attrs) {
this(context, attrs, 0);
}
public radarviewgroup(context context, attributeset attrs, int defstyleattr) {
super(context, attrs, defstyleattr);
}
@override
protected void onmeasure(int widthmeasurespec, int heightmeasurespec) {
setmeasureddimension(measuresize(widthmeasurespec), measuresize(heightmeasurespec));
mwidth = getmeasuredwidth();
mheight = getmeasuredheight();
mwidth = mheight = math.min(mwidth, mheight);
//测量每个children
measurechildren(widthmeasurespec, heightmeasurespec);
for (int i = 0; i < getchildcount(); i++) {
view child = getchildat(i);
if (child.getid() == r.id.id_scan_circle) {
//为雷达扫描图设置需要的属性
((radarview) child).setscanninglistener(this);
//考虑到数据没有添加前扫描图在扫描，但是不会开始为circleview布局
if (mdatas != null && mdatas.size() > 0) {
((radarview) child).setmaxscanitemcount(mdatas.size());
((radarview) child).startscan();
}
continue;
}
}
}
@override
protected void onlayout(boolean changed, int l, int t, int r, int b) {
int childcount = getchildcount();
//首先放置雷达扫描图
view view = findviewbyid(r.id.id_scan_circle);
if (view != null) {
view.layout(0, 0, view.getmeasuredwidth(), view.getmeasuredheight());
}
//放置雷达图中需要展示的item圆点
for (int i = 0; i < childcount; i++) {
final int j = i;
final view child = getchildat(i);
if (child.getid() == r.id.id_scan_circle) {
//如果不是circleview跳过
continue;
}
//设置circleview小圆点的坐标信息
//坐标 = 旋转角度 * 半径 * 根据远近距离的不同计算得到的应该占的半径比例
((circleview) child).setdisx((float) math.cos(math.toradians(scananglelist.get(i - 1) - 5))
* ((circleview) child).getproportion() * mwidth / 2);
((circleview) child).setdisy((float) math.sin(math.toradians(scananglelist.get(i - 1) - 5))
* ((circleview) child).getproportion() * mwidth / 2);
//如果扫描角度记录sparsearray中的对应的item的值为0，
// 说明还没有扫描到该item，跳过对该item的layout
//（scananglelist设置数据时全部设置的value=0，
// 当onscanning时，value设置的值始终不会0，具体可以看onscanning中的实现）
if (scananglelist.get(i - 1) == 0) {
continue;
}
//放置circle小圆点
child.layout((int) ((circleview) child).getdisx() + mwidth / 2, (int) ((circleview) child).getdisy() + mheight / 2,
(int) ((circleview) child).getdisx() + child.getmeasuredwidth() + mwidth / 2,
(int) ((circleview) child).getdisy() + child.getmeasuredheight() + mheight / 2);
//设置点击事件
child.setonclicklistener(new onclicklistener() {
@override
public void onclick(view v) {
resetanim(currentshowchild);
currentshowchild = (circleview) child;
//因为雷达图是childat(0),所以这里需要作-1才是正确的circle
startanim(currentshowchild, j - 1);
if (iradarclicklistener != null) {
iradarclicklistener.onradaritemclick(j - 1);
}
}
});
}
}
private int measuresize(int measurespec) {
int result = 0;
int specmode = measurespec.getmode(measurespec);
int specsize = measurespec.getsize(measurespec);
if (specmode == measurespec.exactly) {
result = specsize;
} else {
result = 300;
if (specmode == measurespec.at_most) {
result = math.min(result, specsize);
}
}
return result;
}
/**
* 设置数据
*
* @param mdatas
*/
public void setdatas(sparsearray<info> mdatas) {
this.mdatas = mdatas;
datalength = mdatas.size();
float min = float.max_value;
float max = float.min_value;
//找到距离的最大值，最小值对应的minitemposition
for (int j = 0; j < datalength; j++) {
info item = mdatas.get(j);
if (item.getdistance() < min) {
min = item.getdistance();
minitemposition = j;
}
if (item.getdistance() > max) {
max = item.getdistance();
}
scananglelist.put(j, 0f);
}
//根据数据源信息动态添加circleview
for (int i = 0; i < datalength; i++) {
circleview circleview = new circleview(getcontext());
if (mdatas.get(i).getsex()) {
circleview.setpaintcolor(getresources().getcolor(r.color.bg_color_pink));
} else {
circleview.setpaintcolor(getresources().getcolor(r.color.bg_color_blue));
}
//根据远近距离的不同计算得到的应该占的半径比例 0.312-0.832
circleview.setproportion((mdatas.get(i).getdistance() / max + 0.6f) * 0.52f);
if (minitemposition == i) {
minshowchild = circleview;
}
addview(circleview);
}
}
/**
* 雷达图没有扫描完毕时回调
*
* @param position
* @param scanangle
*/
@override
public void onscanning(int position, float scanangle) {
if (scanangle == 0) {
scananglelist.put(position, 1f);
} else {
scananglelist.put(position, scanangle);
}
requestlayout();
}
/**
* 雷达图扫描完毕时回调
*/
@override
public void onscansuccess() {
logutil.m("完成回调");
resetanim(currentshowchild);
currentshowchild = minshowchild;
startanim(currentshowchild, minitemposition);
}
/**
* 恢复circleview小圆点原大小
*
* @param object
*/
private void resetanim(circleview object) {
if (object != null) {
object.clearportaiticon();
objectanimator.offloat(object, "scalex", 1f).setduration(300).start();
objectanimator.offloat(object, "scaley", 1f).setduration(300).start();
}
}
/**
* 放大circleview小圆点大小
*
* @param object
* @param position
*/
private void startanim(circleview object, int position) {
if (object != null) {
object.setportraiticon(mdatas.get(position).getportraitid());
objectanimator.offloat(object, "scalex", 2f).setduration(300).start();
objectanimator.offloat(object, "scaley", 2f).setduration(300).start();
}
}
/**
* 雷达图中点击监听circleview小圆点回调接口
*/
public interface iradarclicklistener {
void onradaritemclick(int position);
}
/**
* 根据position，放大指定的circleview小圆点
*
* @param position
*/
public void setcurrentshowitem(int position) {
circleview child = (circleview) getchildat(position + 1);
resetanim(currentshowchild);
currentshowchild = child;
startanim(currentshowchild, position);
}
}

每次点击雷达图中的小圆点都会告诉viewpager切换到指定的页面，所以radarviewgroup中需要定义一个iradarclicklistener，让viewpager所在的mainacitivity去实现该接口
完成的效果就是这样了

五.总结

我们最终实现的效果还是挺棒的,通过实战，我们对于自定义view，自定义viewgroup更加熟练啦~