android - adding a String over a Drawable image?

Question

I'm trying to add a String to a Drawable image. I'm currently not using a Panel to draw and I'd like to keep it that way. Any ideas or do I need to invoke an onDraw() method?

My image is showing up with this code:

Drawable image = getResources().getDrawable(tile_types[tileType]);      
setImageDrawable(image);

I'd like to add a String over this image.

Thanks.

Matt Handy · Answer 1 · 2012-11-29T14:53:54.810

16

Sam's answer was my starting point, but the image didn't show up, only the text (I use it on a Google Map). Finally I got it working with a LayerDrawable. Here is my solution:

private Drawable createMarkerIcon(Drawable backgroundImage, String text,
                                  int width, int height) {

  Bitmap canvasBitmap = Bitmap.createBitmap(width, height, 
                                            Bitmap.Config.ARGB_8888);
  // Create a canvas, that will draw on to canvasBitmap.
  Canvas imageCanvas = new Canvas(canvasBitmap);

  // Set up the paint for use with our Canvas
  Paint imagePaint = new Paint();
  imagePaint.setTextAlign(Align.CENTER);
  imagePaint.setTextSize(16f);

  // Draw the image to our canvas
  backgroundImage.draw(imageCanvas);

  // Draw the text on top of our image
  imageCanvas.drawText(text, width / 2, height / 2, imagePaint);

  // Combine background and text to a LayerDrawable
  LayerDrawable layerDrawable = new LayerDrawable(
             new Drawable[]{backgroundImage, new BitmapDrawable(canvasBitmap)});
  return layerDrawable;
}

edited Nov 29 '12 at 14:53

answered Nov 29 '12 at 14:48

Matt Handy

29,855
2
89
112

do you know how to do it with a 9 path drawable, so it can take the size of the text ? – Tsunaze Jul 03 '13 at 12:54
how would you do this since BitmapDrawable has been depreciated?!? – M4tchB0X3r Sep 11 '13 at 21:51
Do you know why image didn't show up with Sam's answer? – pptang Sep 29 '15 at 05:24
1

As a plus, add imagePaint.setAntiAlias(true); in order to make text smooth – Emre Koç Aug 17 '16 at 13:50

score 6 · Answer 2 · answered May 20 '11 at 01:33

Drawable image = getResources().getDrawable(tile_types[tileType]);
// Store our image size as a constant
final int IMAGE_WIDTH = image.getIntrinsicWidth();
final int IMAGE_HEIGHT = image.getIntrinsicHeight();

// You can also use Config.ARGB_4444 to conserve memory or ARGB_565 if 
// you don't have any transparency.
Bitmap canvasBitmap = Bitmap.createBitmap(IMAGE_WIDTH, 
                                          IMAGE_HEIGHT, 
                                          Bitmap.Config.ARGB_8888);
// Create a canvas, that will draw on to canvasBitmap. canvasBitmap is
// currently blank.
Canvas imageCanvas = new Canvas(canvasBitmap);
// Set up the paint for use with our Canvas
Paint imagePaint = new Paint();
imagePaint.setTextAlign(Align.CENTER);
imagePaint.setTextSize(16f);

// Draw the image to our canvas
image.draw(imageCanvas);
// Draw the text on top of our image
imageCanvas.drawText("Sample Text", 
                         IMAGE_WIDTH / 2, 
                         IMAGE_HEIGHT / 2, 
                         imagePaint);
// This is the final image that you can use 
BitmapDrawable finalImage = new BitmapDrawable(canvasBitmap);

score 1 · Answer 3 · answered Sep 08 '14 at 15:16

1

If your resulted text looks "angular" due to resizing, it's better to use TextPaint instead of plain Paint with these parameters:

TextPaint textPaint = new TextPaint(TextPaint.ANTI_ALIAS_FLAG | TextPaint.LINEAR_TEXT_FLAG);

answered Sep 08 '14 at 15:16

Dmide

6,422
3
24
31

android - adding a String over a Drawable image?

3 Answers3

Linked