2016-02-11 51 views
0

我試圖複製我在網絡中找到的圓環圖代碼。代碼如下所示圖中的不規則陰影

public class DonutChart extends View{ 

private float radius; 
SharedPreferences prefs; 
Paint paint; 
Paint shadowPaint; 
int a,b,c; 
Path myPath; 
Path shadowPath; 

RectF outterCircle; 
RectF innerCircle; 
RectF shadowRectF; 
public DonutChart(Context context, AttributeSet attrs) { 
    super(context, attrs); 

    TypedArray a = context.getTheme().obtainStyledAttributes(
      attrs, 
      R.styleable.DonutChart, 
      0, 0 
    ); 

    try { 
     radius = a.getDimension(R.styleable.DonutChart_radius, 20.0f); 
    } finally { 
     a.recycle(); 
    } 

    paint = new Paint(); 
    paint.setDither(true); 
    paint.setStyle(Paint.Style.FILL); 
    paint.setStrokeJoin(Paint.Join.ROUND); 
    paint.setStrokeCap(Paint.Cap.ROUND); 
    paint.setAntiAlias(true); 
    paint.setStrokeWidth(radius/14.0f); 

    shadowPaint = new Paint(); 
    shadowPaint.setColor(0xf0000000); 
    shadowPaint.setStyle(Paint.Style.STROKE); 
    shadowPaint.setAntiAlias(true); 
    shadowPaint.setStrokeWidth(6.0f); 
    shadowPaint.setMaskFilter(new BlurMaskFilter(4, BlurMaskFilter.Blur.SOLID)); 


    myPath = new Path(); 
    shadowPath = new Path(); 


    outterCircle = new RectF(); 
    innerCircle = new RectF(); 
    shadowRectF = new RectF(); 

    float adjust = (.019f*radius); 
    shadowRectF.set(adjust, adjust, radius*2-adjust, radius*2-adjust); 

    adjust = .038f * radius; 
    outterCircle.set(adjust, adjust, radius*2-adjust, radius*2-adjust); 

    adjust = .276f * radius; 
    innerCircle.set(adjust, adjust, radius * 2 - adjust, radius * 2 - adjust); 
} 
@Override 
protected void onDraw(Canvas canvas) { 
    super.onDraw(canvas); 
    // draw shadow 

    paint.setShader(null); 
    float adjust = (.0095f*radius); 
    paint.setShadowLayer(8, adjust, -adjust, 0xaa000000); 
    drawDonut(canvas, paint, 0, 359.9f); 
    //Orange 
    setGradient(0xffEF6632,0xffEF6632); 
    drawDonut(canvas,paint, 0,b); 
    //Blue 
    setGradient(0xff00CCDA,0xff00CCDA); 
    drawDonut(canvas, paint, 60,a); 
    // blue 
// setGradient(0xff4AB6C1,0xff2182AD); 
// drawDonut(canvas, paint, 120, 60); 
    // Grey 
    setGradient(0xff557687,0xff557687); 
    drawDonut(canvas, paint, 180,c); 
} 
public void drawDonut(Canvas canvas, Paint paint, float start,float sweep){ 

    myPath.reset(); 
    myPath.arcTo(outterCircle, start, sweep, false); 
    myPath.arcTo(innerCircle, start+sweep, -sweep, false); 
    myPath.close(); 
    canvas.drawPath(myPath, paint); 
} 

public void setGradient(int sColor, int eColor){ 
    paint.setShader(new RadialGradient(radius, radius, radius - 5, 
      new int[]{sColor, eColor}, 
      new float[]{.6f, .95f}, TileMode.CLAMP)); 
} 
@Override 
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { 
    super.onMeasure(widthMeasureSpec, heightMeasureSpec); 

    int desiredWidth = (int) radius*2; 
    int desiredHeight = (int) radius*2; 

    int widthMode = MeasureSpec.getMode(widthMeasureSpec); 
    int widthSize = MeasureSpec.getSize(widthMeasureSpec); 
    int heightMode = MeasureSpec.getMode(heightMeasureSpec); 
    int heightSize = MeasureSpec.getSize(heightMeasureSpec); 

    int width; 
    int height; 

    //70dp exact 
    if (widthMode == MeasureSpec.EXACTLY) { 
     width = widthSize; 
    }else if (widthMode == MeasureSpec.AT_MOST) { 
     //wrap content 
     width = Math.min(desiredWidth, widthSize); 
    } else { 
     width = desiredWidth; 
    } 

    //Measure Height 
    if (heightMode == MeasureSpec.EXACTLY) { 
     height = heightSize; 
    } else if (heightMode == MeasureSpec.AT_MOST) { 
     height = Math.min(desiredHeight, heightSize); 
    } else { 
     height = desiredHeight; 
    } 

    //MUST CALL THIS 
    setMeasuredDimension(width, height); 
} 
public void getData(int x,int y){ 
    invalidate(); 
    a=((x*360)/10); 
    b=(y*360)/10; 
    c=((10-(x+y))*360)/10; 
    String s1,s2,s3; 
    s1=String.valueOf(a); 
    s2=String.valueOf(b); 
    s3=String.valueOf(c); 
    Toast.makeText(getContext(),"Inside Chart "+s1+" "+s2+" "+s3 +" "+String.valueOf(x),Toast.LENGTH_SHORT).show(); 
} 

} 

問題是,當我使我的設備上的圖形它給了我一個奇怪的影子像這樣:

Image 1

或像這樣:

Image 2

是什麼導致了這種情況,以及如何糾正它?

回答

1

這實際上是因爲只有線長度的值發生了變化,而起點是相同的,所以有時它們往往會重疊。

這可以通過改變代碼如下

protected void onDraw(Canvas canvas) { 
super.onDraw(canvas); 
// draw shadow 
paint.setShader(null); 
float adjust = (.0095f*radius); 
paint.setShadowLayer(8, adjust, -adjust, 0xaa000000); 
drawDonut(canvas, paint, 0, 359.9f); 
//Orange 
setGradient(0xffEF6632,0xffEF6632); 
drawDonut(canvas,paint, 0,b); 
//Blue 
setGradient(0xff00CCDA,0xff00CCDA); 
drawDonut(canvas, paint, b,a); 
// Grey 
setGradient(0xff557687,0xff557687); 
drawDonut(canvas, paint, a+b,c); 
} 
可以解決