Wie entwerfe ich Diagramme mit Leinwand in Android?

Question

Ich möchte die folgenden Diagramme in Android mit Leinwand oder anderen Methoden entwerfen. Bitte helfen Sie mir ...

Wie im Bild zeigen ich, möchte ich Abschnitte des Kreises gemäß Eingang in Prozent zeichnen. 50% Teil des Kreises ist rote Farbe und 50% Teil der Cremefarbe mit etwas Text wie im Bild.

Answer 1

könnte hilfreich sein,

public class View_PieChart extends View {
    private static final int WAIT = 0;
    private static final int IS_READY_TO_DRAW = 1;
    private static final int IS_DRAW = 2;
    private static final float START_INC = 30;
    private Paint mBgPaints   = new Paint();
    private Paint mLinePaints = new Paint();
    private int   mOverlayId;
    private int   mWidth;
    private int   mHeight;
    private int   mGapLeft;
    private int   mGapRight;
    private int   mGapTop;
    private int   mGapBottom;
    private int   mBgColor;
    private int   mState = WAIT;
    private float mStart;
    private float mSweep;
    private int   mMaxConnection;
    private List<PieDetailsItem> mDataArray;
    //--------------------------------------------------------------------------------------
    public View_PieChart (Context context){
        super(context);
    }
    //--------------------------------------------------------------------------------------
    public View_PieChart(Context context, AttributeSet attrs) {
        super(context, attrs);
    }
    //--------------------------------------------------------------------------------------
    @Override 
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        //------------------------------------------------------
        if (mState != IS_READY_TO_DRAW) return;
        canvas.drawColor(mBgColor);
        //------------------------------------------------------
        mBgPaints.setAntiAlias(true);
        mBgPaints.setStyle(Paint.Style.FILL);
        mBgPaints.setColor(0x88FF0000);
        mBgPaints.setStrokeWidth(0.5f);
        //------------------------------------------------------
        mLinePaints.setAntiAlias(true);
        mLinePaints.setStyle(Paint.Style.STROKE);
        mLinePaints.setColor(0xff000000);
        mLinePaints.setStrokeWidth(0.5f);
        //------------------------------------------------------
        RectF mOvals = new RectF( mGapLeft, mGapTop, mWidth - mGapRight, mHeight - mGapBottom);
        //------------------------------------------------------
        mStart = START_INC;
        PieDetailsItem Item;
        for (int i = 0; i < mDataArray.size(); i++) {
            Item = (PieDetailsItem) mDataArray.get(i);
            mBgPaints.setColor(Item.Color);
            mSweep = (float) 360 * ( (float)Item.Count / (float)mMaxConnection );
            canvas.drawArc(mOvals, mStart, mSweep, true, mBgPaints);
            canvas.drawArc(mOvals, mStart, mSweep, true, mLinePaints);
            mStart += mSweep;
        }
        //------------------------------------------------------
        Options options = new BitmapFactory.Options();
        options.inScaled = false;
        /*Bitmap OverlayBitmap = BitmapFactory.decodeResource(getResources(), mOverlayId, options);
        canvas.drawBitmap(OverlayBitmap, 0.0f, 0.0f, null);*/
        //------------------------------------------------------
        mState = IS_DRAW;
    }
    //--------------------------------------------------------------------------------------
    public void setGeometry(int width, int height, int GapLeft, int GapRight, int GapTop, int GapBottom, int OverlayId) {
        mWidth     = width;
        mHeight    = height;
        mGapLeft   = GapLeft;
        mGapRight  = GapRight;
        mGapTop    = GapTop;
        mGapBottom = GapBottom;
        mOverlayId = OverlayId;
    }
    //--------------------------------------------------------------------------------------
    public void setSkinParams(int bgColor) {
        mBgColor   = bgColor;
    }
    //--------------------------------------------------------------------------------------
    public void setData(List<PieDetailsItem> data, int MaxConnection) {
        mDataArray = data;
        mMaxConnection = MaxConnection;
        mState = IS_READY_TO_DRAW;
    }
    //--------------------------------------------------------------------------------------
    public void setState(int State) {
        mState = State;
    }
    //--------------------------------------------------------------------------------------
    public int getColorValue( int Index ) {
        if (mDataArray == null) return 0;
        if (Index < 0){
            return ((PieDetailsItem)mDataArray.get(0)).Color;
        } else if (Index >= mDataArray.size()){
            return ((PieDetailsItem)mDataArray.get(mDataArray.size()-1)).Color;
        } else {
            return ((PieDetailsItem)mDataArray.get(mDataArray.size()-1)).Color;
        }
    }
}

Answer 2

Sie können Engine für diese Art von Diagramm aufstellen.

Überprüfen Sie diese URL:http://www.artfulbits.com/articles/samples/aicharts/sample-viewer.aspx?sample=piesample

Grüße, Girish