Drawing text in a custom view, canvas.drawText won't display

Question

I'm trying to draw text in a custom view that has an image as a background. Three things are being drawn.

• The bitmap behind the circle
• The red circle and
• Text over it.

At the moment the circle and bitmap draw perfectly but the text doesn't display.

Code for custom view.

public class NotificationButtonView extends Button
{
private int mNumberOfNotifications = 0;
private Paint mNotificationPaint = new Paint();
private Paint mTextPaint = new Paint();

public NotificationButtonView(Context context, AttributeSet attrs, int defStyle) {
    super(context, attrs, defStyle);
}
public NotificationButtonView(Context context, AttributeSet attrs) {
    super(context, attrs);
}
public NotificationButtonView(Context context) {
    super(context);
}

public void setNotificationNumber(int number)
{
    this.mNumberOfNotifications = number;
    this.invalidate();
}

public void addNotification()
{
    this.mNumberOfNotifications++;
    this.invalidate();
}

@Override
protected void onAttachedToWindow() 
{
    super.onAttachedToWindow();

    mNotificationPaint.setColor(Color.rgb(255,69,0));
    mNotificationPaint.setAlpha(220);

    mTextPaint.setAntiAlias(true);
    mTextPaint.setColor(Color.BLACK);
    mTextPaint.setStyle(Style.FILL);
    mTextPaint.setTextSize(this.getWidth() / 3);
    mTextPaint.setTypeface(Typeface.defaultFromStyle(Typeface.BOLD));
    mTextPaint.setTextAlign(Align.CENTER);
    mTextPaint.setLinearText(true);
}

@Override
protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);

    int diameter = this.getWidth() / 3;

    /*
    canvas.drawCircle(
            this.getWidth() - diameter,
            this.getHeight() - diameter, 
            diameter,
            this.mNotificationPaint
        );
        */


    //Get the text bounds.
    Rect foundBounds = new Rect();
    mTextPaint.getTextBounds("1", 0, "1".length(), foundBounds);
    foundBounds.offset(0, diameter);

    canvas.drawText(
            //String.valueOf(mNumberOfNotifications), 
            "1",
            0,
            foundBounds.bottom,
            this.mTextPaint
        );

    //For testing the location of the text bounds.
    canvas.drawRect(foundBounds, mNotificationPaint);

}

}

Answer 1

You are getting this.getWidth() 0 in onAttachedToWindow() as a result the text size is set to 0.

But you are getting this.getWidth() value in onDraw so in onDraw add this line

mTextPaint.setTextSize(this.getWidth() / 3);