안 드 로 이 드 QQ 근처 사람들 검색 전시 기능

1.개술
낡은 규칙,먼저 그림 을 그리다.


오리지널 상품(gif 를 녹화 하지 않 습 니 다.여러분 은 Q 군 조수 에서 공유 지리 적 위 치 를 열 고 단체 채 팅 페이지 로 돌아 가면 근처에 있 는 사람 을 볼 수 있 습 니 다):

비슷 해 보이 지?
관찰 을 통 해 우 리 는 다음 과 같은 관 계 를 얻 을 수 있다.
1.아래 전시 목록 은 ViewPager 를 사용 하여 구현 할 수 있 습 니 다.(물론 귀 찮 지 않 으 시다 면 Horizontal ScrollView 를 사용 해 보 세 요)
2.위의 스 캔 그림 은 분명 ViewGroup 일 것 입 니 다.(안에 있 는 작은 도 트 는 클릭 할 수 있 기 때문에 View 라면 이 작은 도 트 의 위치 에 대한 판단 과 작은 도 트 크기 조정 애니메이션 에 대한 처리 가 매우 번 거 롭 고 실현 하기 어 려 울 것 입 니 다)그래서 저 희 는 ViewGroup 을 사용자 정의 해 야 합 니 다.
3.사용자 정의 뷰 그룹 이 확실 해 지면 그 안에 어떤 대상 을 넣 어야 하나 요?맞 아,바로 N 개의 작은 원점+스 캔 한 큰 동그라미 야.
위의 분석 을 통 해 우 리 는 우리 의 프로젝트 구 조 를 다음 과 같이 확정 할 수 있다.

다음은 하나씩 격파 하여 최종 효 과 를 완성 합 니 다!
2.전시 용 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"를 설정 해 야 합 니 다.
서브 뷰 를 제한 하지 않 는 다 는 뜻 이다.
세심 한 당신 은 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 는 끝 난 셈 입 니 다.


3.레이더 스캐닝 도 실현
코드 에 도 설명 이 잘 되 어 있 습 니 다.물론 스 캔 을 해 야 하기 때문에 우 리 는 끊임없이 돌아 가 야 합 니 다.그래서 여기 서 우 리 는 매트릭스 로 Matrix 를 바 꾸 었 습 니 다.스 캔 메시지 의 정지 와 전달 은 Runnable 을 사 용 했 습 니 다.만약 에 메 인 스 레 드 에 변 경 된 메 시 지 를 계속 배달 하 는 것 이 메 인 스 레 드 에 좋 지 않다 고 생각한다 면 Surface View 로 실현 하 는 것 을 고려 해 보 세 요.

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;
}
}

4.작은 원점 의 배치 완료
지금 우리 의 스캐닝 그림 이 생 겼 는데,비교 해 보면 우 리 는 아직 무엇이 부족 합 니까?그래,작은 땡땡이 야.

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 에서 인터페이스 IScanning Listener 를 정의 해 야 합 니 다.RadarView Group 에 스 캔 하고 있다 고 알려 주 십시오.작은 원점 이 나타 나 도록 하 세 요.
따라서 RadarView Group 의 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 에 서 는 Iadar ClickListener 를 정의 하여 ViewPager 가 있 는 MainAcitivity 가 이 인 터 페 이 스 를 실현 하도록 해 야 합 니 다.
완 성 된 효 과 는 이 렇 습 니 다.

총화

우리 가 최종 적 으로 실현 한 효 과 는 매우 좋다.실전 을 통 해 우 리 는 사용자 정의 View,사용자 정의 View Group 에 더욱 능숙 해 졌 다.