How to add round corner to canvas drawrect in Android?

Question

I am creating a rectangle in @Override method of ReplacementSpan. How to add RoundCorner and padding to it?

Code:

@Override
public void draw(Canvas canvas, CharSequence text, int start, int end, float x, int top, int y, int bottom, Paint paint) {
    RectF rect = new RectF(x, top, x + measureText(paint, text, start, end), bottom);
    paint.setColor(mBackgroundColor);
    canvas.drawRect(rect, paint);
    paint.setColor(mForegroundColor);
    canvas.drawText(text, start, end, x, y, paint);
}

Edit-1

I am using MeasureText:

private float measureText(Paint paint, CharSequence text, int start, int end) { return paint.measureText(text, start, end); }

Edit-2

After some suggestions I made these changes and I can see Rounded corner on Rectangle

@Override
public void draw(Canvas canvas, CharSequence text, int start, int end, float x, int top, int y, int bottom, Paint paint) {
    RectF rect = new RectF(x, top, x + measureText(paint, text, start, end), bottom);
    paint.setColor(mBackgroundColor);
    canvas.drawRoundRect(rect, 15,15,paint);
    paint.setColor(mForegroundColor);
    canvas.drawText(text, start, end, x, y, paint);

}

and here is the screenshot:

I am calling draw method from following code:

int currentIndex = 0;
for (int i = 0; i < words.length - 1; i++) {
            s.setSpan(new CustomDrawble(Color.GRAY, Color.WHITE), currentIndex, currentIndex + words[i].length(), Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
            currentIndex += words[i].length() + 1;
        }

Blackbelt · Answer 1 · 2015-10-24T10:28:50.197

14

Canvas has the method drawRoundRect. You will have to provide the RectF to be drawn, the Paint, as for drawRect and two addition paramters, rx and ry that represent the x and y radius of your rounded corners. E.g.

canvas.drawRoundRect(rect, 5, 5, paint);

will draw a rect with round corner of 5pixels

Edit2:

disclaimer: use dip instead of pixels

@Override
public void draw(Canvas canvas, CharSequence text, int start, int end, float x, int top, int y, int bottom, Paint paint) {
   RectF rect = new RectF(x, top, x + measureText(paint, text, start, end) + 10, bottom);
   paint.setColor(mBackgroundColor);
   canvas.drawRoundRect(rect, 15,15,paint);
   paint.setColor(mForegroundColor);
   canvas.drawText(text, start, end, x + 5, y, paint); 
 }

edited Oct 24 '15 at 10:28

answered Oct 24 '15 at 10:01

Blackbelt

156,034
29
297
305

Thanks for your answer I just used it and it works! I was looking for How to set Margin of DrawRect text? How can I do that? – Oct 24 '15 at 10:05
margin? The only thing that comes to my mind atm is to make the rectangle a little bit larger. canvas doen't deal with maring/padding. You might want to try a the view level – Blackbelt Oct 24 '15 at 10:12
Actually I am using ReplacementSpan and to measure text I am using measureText. Please have a look at Edit-1 section – Oct 24 '15 at 10:14
you want you rounded rect wider than the text to avoid that text touch the borders of you rectange? – Blackbelt Oct 24 '15 at 10:19
Checkout the Edit-2 section in the post – Oct 24 '15 at 10:23
rect has to be wider. Try adding 10dip to the right value of rect, and add to the start left of your drawText of 5dip – Blackbelt Oct 24 '15 at 10:25
Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/93236/discussion-between-user4567-and-blackbelt). – Oct 24 '15 at 10:28
I gotta go.. maybe this afternoon (cest timezone) – Blackbelt Oct 24 '15 at 10:29
I actually tried it but it didn't work. I have added a new question : http://stackoverflow.com/questions/33317735/how-to-make-space-between-spannable-string-in-android Please have a look at it – Oct 24 '15 at 11:39

score 0 · Answer 2 · answered Apr 10 '20 at 17:28

This works for me:

 public static int cnvToDip(Context context,
                            int     pixels)
 {

  return ((int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, pixels, context.getResources().getDisplayMetrics()));
 }

public static float[] getRoundRectangleShape(Context context,
                                              int     radius)
 {

  Display display = ((WindowManager) context.getSystemService(Context.WINDOW_SERVICE)).getDefaultDisplay();

  Point point = new Point();
  display.getSize(point);

  return new float[]{point.x / cnvToDip(context, radius),
                     point.x / cnvToDip(context, radius),
                     point.x / cnvToDip(context, radius),
                     point.x / cnvToDip(context, radius),
                     point.x / cnvToDip(context, radius),
                     point.x / cnvToDip(context, radius),
                     point.x / cnvToDip(context, radius),
                     point.x / cnvToDip(context, radius)};
 }

ShapeDrawable shapeDrawable = new ShapeDrawable(new RoundRectShape(getRoundRectangleShape(context, 20), null, null));
    shapeDrawable.getPaint().setColor(Color.BLUE);

   @Override
   public void draw(Canvas canvas)
   {

    super.draw(canvas);

    shapeDrawable.draw(canvas);

How to add round corner to canvas drawrect in Android?

Edit-1

Edit-2

2 Answers2