最近遇见一个需要一个圆盘功能的需求，需要在圆盘中心和上下左右四个方向各添加一个控件，想了想还是用canvas自己来画吧

需要实现下面效果：

贴代码咯：

package com.rimi.healthmanage.view;

import android.content.Context;

import android.graphics.Canvas;

import android.graphics.LinearGradient;

import android.graphics.Paint;

import android.graphics.Paint.Style;

import android.graphics.RectF;

import android.graphics.Shader;

import android.util.AttributeSet;

import android.view.View;

import android.view.ViewGroup;

import com.rimi.healthmanage.R;

import com.xxs.sdk.util.InfoUtil;

import com.xxs.sdk.util.ProveUtil;

import com.xxs.sdk.util.TransformUtil;

public class FragmentMainView extends ViewGroup {

private int layoutHeight, layoutWidth;

private int centerX, centerY;

private Shader lnShaderdrawable;

private int circleSmallRadius;

private Paint paint;

private RectF recfBig, recfMidle;

private boolean ifallowdrawArc;

private int sweepAngle;

public FragmentMainView(Context context) {

super(context);

// TODO Auto-generated

constructor stub

setWillNotDraw(false);

}

public FragmentMainView(Context context, AttributeSet attrs)

{

super(context, attrs);

// TODO Auto-generated

constructor stub

setWillNotDraw(false);

}

public FragmentMainView(Context context, AttributeSet attrs, int

defStyle) {

super(context, attrs,

defStyle);

// TODO Auto-generated

constructor stub

setWillNotDraw(false);

}

@Override

protected void onMeasure(int widthMeasureSpec,

int heightMeasureSpec) {

// TODO Auto-generated method

stub

//

InfoUtil为自定义的一个获取屏幕高宽的工具类

layoutHeight = layoutWidth =

InfoUtil.getScreenWidth() > InfoUtil

.getScreenWidth()

? InfoUtil.getScreenWidth() / 3 * 2

:

InfoUtil.getScreenWidth() / 3 * 2;// 设置整个布局的高宽

setMeasuredDimension(layoutWidth,

layoutHeight);

// TODO Auto-generated method

stub

for (int i = 0; i <

getChildCount(); i++) {

View v =

getChildAt(i);

int widthSpec

= 0;

int

heightSpec = 0;

LayoutParams

params = v.getLayoutParams();

if

(params.width > 0) {

widthSpec

= MeasureSpec.makeMeasureSpec(params.width,

MeasureSpec.EXACTLY);

} else if

(params.width == -1) {

widthSpec

= MeasureSpec.makeMeasureSpec(layoutWidth,

MeasureSpec.EXACTLY);

} else if

(params.width == -2) {

widthSpec

= MeasureSpec.makeMeasureSpec(layoutWidth,

MeasureSpec.AT_MOST);

}

if

(params.height > 0) {

heightSpec

= MeasureSpec.makeMeasureSpec(params.height,

MeasureSpec.EXACTLY);

} else if

(params.height == -1) {

heightSpec

= MeasureSpec.makeMeasureSpec(layoutWidth,

MeasureSpec.EXACTLY);

} else if

(params.height == -2) {

heightSpec

= MeasureSpec.makeMeasureSpec(layoutWidth,

MeasureSpec.AT_MOST);

}

v.measure(widthSpec,

heightSpec);

}

}

@Override

protected void onLayout(boolean changed, int l,

int t, int r, int b) {

// TODO Auto-generated method

stub

centerX = layoutWidth / 2;//

得到圆心坐标

centerY = layoutHeight /

2;

//

TransformUtil为一个dp转像素的工具类

circleSmallRadius = layoutWidth

/ 2 - TransformUtil.dip2px(60);// 计算的到中心小圆半径

float left = 0, top = 0;

final int childCount =

getChildCount();

for (int i = 0; i <

childCount; i++) {

final View

mView = getChildAt(i);

Object tag =

mView.getTag();

if

(mView.getVisibility() == GONE

||

(tag == null || !ProveUtil.isNumeric(tag.toString()))) {

continue;

}

int w =

mView.getMeasuredWidth();// 获取View的宽度

int h =

mView.getMeasuredHeight();// 获取View的高度

int index =

Integer.valueOf(tag.toString());

switch

(index) {

case 0://

圆心

left

= centerX - w / 2;

top

= centerY - h / 2;

break;

case 1://

外圆左边

left

= 0;

top

= centerY - h / 2;

break;

case 2://

外圆上边

left

= centerX - w / 2;

top

= 0;

break;

case 3://

外圆右边

left

= layoutWidth - w;

top

= centerY - h / 2;

break;

case 4://

外圆下边

left

= centerX - w / 2;

top

= layoutHeight - h;

break;

default:

break;

}

mView.layout((int)

left, (int) top, (int) left + w, (int) top + h);

}

intMethod();

}

private void intMethod() {

paint = new Paint();

paint.setAntiAlias(true);//

设置消除锯齿

lnShaderdrawable = new

LinearGradient(centerX,

TransformUtil.dip2px(40),

centerX, layoutHeight

-

TransformUtil.dip2px(40), new int[] {

getResources().getColor(R.color.lanse),

getResources().getColor(R.color.danlvse)

}, null,

Shader.TileMode.MIRROR);

recfBig = new

RectF(TransformUtil.dip2px(20), TransformUtil.dip2px(20),

layoutWidth

- TransformUtil.dip2px(20), layoutHeight

-

TransformUtil.dip2px(20));

recfMidle = new

RectF(TransformUtil.dip2px(50),

TransformUtil.dip2px(50),

layoutWidth

-

TransformUtil.dip2px(50), layoutHeight

-

TransformUtil.dip2px(50));

}

@Override

protected void onDraw(Canvas canvas) {

// TODO Auto-generated method

stub

super.onDraw(canvas);

drawViewMethod(canvas);//

调用绘制最外层圆盘和中心小圆的方法

drawArcMethod(canvas);//

调用绘制圆弧的方法

}

private void drawViewMethod(Canvas canvas)

{

paint.setShader(null);

paint.setStyle(Style.STROKE);

paint.setColor(getResources().getColor(R.color.baise));

paint.setStrokeWidth(TransformUtil.dip2px(40));

canvas.drawArc(recfBig, 0, 360,

false, paint);

paint.setStyle(Style.FILL);

canvas.drawCircle(centerX,

centerY, circleSmallRadius, paint);

}

public void drawArcMethod(Canvas canvas) {

if (ifallowdrawArc) {

sweepAngle +=

1;//逐渐增减弧度来实现画弧形是的动画

paint.setStyle(Style.STROKE);

paint.setStrokeWidth(TransformUtil.dip2px(20));

paint.setShader(lnShaderdrawable);

if

(sweepAngle > 90) {

canvas.drawArc(recfMidle,

0, 360, false, paint);

ifallowdrawArc

= false;

sweepAngle

= 0;

} else

{

//

paint.setColor(getResources().getColor(R.color.lvse));

canvas.drawArc(recfMidle,

-45, sweepAngle, false, paint);

//

paint.setColor(getResources().getColor(R.color.huangse));

canvas.drawArc(recfMidle,

45, sweepAngle, false, paint);

//

paint.setColor(getResources().getColor(R.color.lanse));

canvas.drawArc(recfMidle,

135, sweepAngle, false, paint);

//

paint.setColor(getResources().getColor(R.color.hongse));

canvas.drawArc(recfMidle,

225, sweepAngle, false, paint);

invalidate();

}

}

}

public void setIfallowdrawArc(boolean

ifallowdrawArc) {

this.ifallowdrawArc =

ifallowdrawArc;

invalidate();

}

}

随便将布局也一并贴出

http://schemas.android.com/apk/res/android"

android:layout_width="match_parent"

android:layout_height="match_parent" >

android:id="@+id/fragment_main_mainview"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_alignParentTop="true"

android:layout_centerHorizontal="true"

android:layout_marginTop="20dp" >

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:tag="0"

android:text="测试" />

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:tag="1"

android:text="测试" />

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:tag="2"

android:text="测试" />

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:tag="3"

android:text="测试" />

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:tag="4"

android:text="测试" />