Android Custom Drawable


Extend your class with Drawable and override these methods

public class IconDrawable extends Drawable {
     * Paint for drawing the shape
    private Paint paint;
     * Icon drawable to be drawn to the center of the shape
    private Drawable icon;
     * Desired width and height of icon
    private int desiredIconHeight, desiredIconWidth;

     * Public constructor for the Icon drawable
     * @param icon            pass the drawable of the icon to be drawn at the center
     * @param backgroundColor background color of the shape
    public IconDrawable(Drawable icon, int backgroundColor) {
        this.icon = icon;
        paint = new Paint(Paint.ANTI_ALIAS_FLAG);
        desiredIconWidth = 50;
        desiredIconHeight = 50;

    public void draw(Canvas canvas) {
        //if we are setting this drawable to a 80dpX80dp imageview 
        //getBounds will return that measurements,we can draw according to that width.
        Rect bounds = getBounds();
        //drawing the circle with center as origin and center distance as radius
        canvas.drawCircle(bounds.centerX(), bounds.centerY(), bounds.centerX(), paint);
        //set the icon drawable's bounds to the center of the shape
        icon.setBounds(bounds.centerX() - (desiredIconWidth / 2), bounds.centerY() - (desiredIconHeight / 2), (bounds.centerX() - (desiredIconWidth / 2)) + desiredIconWidth, (bounds.centerY() - (desiredIconHeight / 2)) + desiredIconHeight);
        //draw the icon to the bounds


    public void setAlpha(int alpha) {
        //sets alpha to your whole shape

    public void setColorFilter(ColorFilter colorFilter) {
       //sets color filter to your whole shape

    public int getOpacity() {
        //give the desired opacity of the shape
        return PixelFormat.TRANSLUCENT;

Declare a ImageView in your layout

   android:layout_height="80dp" />

Set your custom drawable to the ImageView

 IconDrawable iconDrawable=new IconDrawable(ContextCompat.getDrawable(this,android.R.drawable.ic_media_play),ContextCompat.getColor(this,R.color.pink_300));


enter image description here enter image description here enter image description here