Draw circles with given color and show some text in each circle.

attrs.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <declare-styleable name="DrawCirclesView">
        <attr name="radius" format="dimension" />
        <attr name="textSize" format="dimension" />
    </declare-styleable>
</resources>

DrawCirclesView.java

package com.android.gifts.bottomnavigation;

import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Rect;
import android.text.TextPaint;
import android.util.AttributeSet;
import android.util.TypedValue;
import android.view.View;

/**
 * Created by Prasanna on 06-10-2016.
 */

public class DrawCirclesView extends View {

    private Paint mPaint;
    private Item[] mItems;

    private int circleR = 10;
    private final int SPACE = 10;
    private int mTextSize = 15;
    private TextPaint mTextPaint;
    private Rect mBounds;

    public DrawCirclesView(Context context) {
        super(context);
        init(context, null);
    }

    public DrawCirclesView(Context context, AttributeSet attrs) {
        super(context, attrs);
        init(context, attrs);
    }

    public DrawCirclesView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init(context, attrs);
    }

    private void init(Context context, AttributeSet attrs) {
        if (attrs == null) return;
        TypedArray a = getContext().getTheme().obtainStyledAttributes(attrs, R.styleable.DrawCirclesView, 0, 0);
        try {
            circleR = a.getDimensionPixelSize(R.styleable.DrawCirclesView_radius,
                    (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, circleR,
                            context.getResources().getDisplayMetrics()));
            mTextSize = a.getDimensionPixelSize(R.styleable.DrawCirclesView_textSize, (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_SP, mTextSize, context.getResources().getDisplayMetrics()));
        } finally {
            a.recycle();
        }

        mBounds = new Rect();

        mPaint = new Paint();
        mPaint.setAntiAlias(true);

        mTextPaint = new TextPaint();
        mTextPaint.setColor(Color.WHITE);
        mTextPaint.setTextSize(mTextSize);
        mTextPaint.setAntiAlias(true);
    }

    public void setItems(Item[] items) {
        mItems = items;
        invalidate();
    }

    @Override
    protected void onDraw(Canvas canvas) {
        if (mItems == null) return;
        int length = mItems.length;
        float circleX = circleR + SPACE;
        float circleY = circleR + SPACE;
        for (int i = 0; i < mItems.length; i++) {
            mPaint.setColor(mItems[i].color);
            if (getWidth() < circleX) {
                circleX = circleR + SPACE;
                circleY += ((circleR * 2) + SPACE);
            }
            canvas.drawCircle(circleX - (SPACE / 2), circleY, circleR, mPaint);
            String str = "" + mItems[i].count;
            mTextPaint.getTextBounds(str, 0, str.length(), mBounds);
            canvas.drawText("" + mItems[i].count, circleX - (SPACE / 2) - mBounds.width() / 2, circleY + mBounds.height() / 2, mTextPaint);
            circleX += ((circleR * 2) + SPACE);
        }
    }

    public class Item {
        public int count;
        public int color;

        public Item(int count, int color) {
            this.count = count;
            this.color = color;
        }
    }

}