Android - Draw Bitmap within Canvas

Question

I currently have a maze game which draws a 5 x 5 square (takes the width of screen and splits it evenly). Then for each of these boxes using x and y cordinates I user drawRect, to draw a colored background.

The issue I am having is I now need to draw an image within this same location, therefore replacing the current plain background colour fill.

Here is the code I am currently using to drawRect (a few example):

// these are all the variation of drawRect that I use
canvas.drawRect(x, y, (x + totalCellWidth), (y + totalCellHeight), green);
canvas.drawRect(x + 1, y, (x + totalCellWidth), (y + totalCellHeight), green);
canvas.drawRect(x, y + 1, (x + totalCellWidth), (y + totalCellHeight), green);

I would then also need to implement a background image for all the other squares within my canvas. This background will have simple 1px black lines drawn over the top of it, current code to draw in a grey background.

background = new Paint();
background.setColor(bgColor);
canvas.drawRect(0, 0, width, height, background);

Could you please advice if this is at all possible. If so, what is the best way I can go about doing this, whilst trying to minimise memory usage and having 1 image which will expand and shrink to fill the relvent square space(this varies on all the different screen sizes as it splits the overall screen width evenly).

bobnoble · Accepted Answer · 2012-11-13T14:37:28.013

Use the Canvas method public void drawBitmap (Bitmap bitmap, Rect src, RectF dst, Paint paint). Set dst to the size of the rectangle you want the entire image to be scaled into.

EDIT:

Here's a possible implementation for drawing the bitmaps in squares across on the canvas. Assumes the bitmaps are in a 2-dimensional array (e.g., Bitmap bitmapArray[][];) and that the canvas is square so the square bitmap aspect ratio is not distorted.

private static final int NUMBER_OF_VERTICAL_SQUARES = 5;
private static final int NUMBER_OF_HORIZONTAL_SQUARES = 5;

...

    int canvasWidth = canvas.getWidth();
    int canvasHeight = canvas.getHeight();

    int squareWidth = canvasWidth / NUMBER_OF_HORIZONTAL_SQUARES;
    int squareHeight = canvasHeight / NUMBER_OF_VERTICAL_SQUARES;
    Rect destinationRect = new Rect();

    int xOffset;
    int yOffset;

    // Set the destination rectangle size
    destinationRect.set(0, 0, squareWidth, squareHeight);

    for (int horizontalPosition = 0; horizontalPosition < NUMBER_OF_HORIZONTAL_SQUARES; horizontalPosition++){

        xOffset = horizontalPosition * squareWidth;

        for (int verticalPosition = 0; verticalPosition < NUMBER_OF_VERTICAL_SQUARES; verticalPosition++){

            yOffset = verticalPosition * squareHeight;

            // Set the destination rectangle offset for the canvas origin
            destinationRect.offsetTo(xOffset, yOffset);

            // Draw the bitmap into the destination rectangle on the canvas
            canvas.drawBitmap(bitmapArray[horizontalPosition][verticalPosition], null, destinationRect, null);
        }
    }

Coudl you please provide an example with code, mainly in terms of how i specifiy which rectangle to target, with reference to how I am currently drawing my rectangles. Thanks — SingleWave Games, Nov 13 '12 at 13:48
Edited the answer to show creation of the destination rectangle and iterating through the 5x5 set of squares. — bobnoble, Nov 13 '12 at 14:38
I am very new to Android and Java development and therefore was wondering how to add Bitmap into a 2d array. I am currently getting the Bitmap images using the 'BitmapFactory'. 1 further thing to mention is that my bitmap is always going to be the same, therefore can i hardcode anything (as this would save memory)? Thanks — SingleWave Games, Nov 13 '12 at 14:50
@LandLPartners - when you say the "bitmap is always going to be the same", do you mean each square square in the 5x5 matrix will contain the same bitmap? Or that part of a single bitmap will fill each square? Or something else? — bobnoble, Nov 13 '12 at 15:48
I have now solved the issue, by using snippets of your example code. In terms of bitmaps, there are 2 scenario, 1 will have multiple images per square(all the same). The other (main background). Will be 1 bitmap stretched across the whole 5x5 grid. Thanks for your help. — SingleWave Games, Nov 13 '12 at 16:33

score 2 · Answer 2 · edited May 23 '17 at 12:24

2

Try the following code :

Paint paint = new Paint();
paint.setAntiAlias(true);
paint.setFilterBitmap(true);
paint.setDither(true);

canvas.drawBitmap(bitmap, x, y, paint);

==================

You could also just reference this answer.

edited May 23 '17 at 12:24

Community

1
1

answered Nov 13 '12 at 13:06

Omarj

1,151
2
16
43

This works fine to draw the image, however it only draws part of the image, as only the starting points for x and y are set. I essentially also need to define the end x and y points, similar to what I am doing using drawRect. Thanks – SingleWave Games Nov 13 '12 at 13:12
No, maybe I was not clear. I am currently using drawRect, however need to draw a bitmap in this place instead. However, the width and height of this bitmap is constantly changing depending on where the user is within the map. – SingleWave Games Nov 13 '12 at 13:44

Android - Draw Bitmap within Canvas

2 Answers2

Linked