Draw Bitmap on another Bitmap with same width and height

Question

there I want to overlay an Bitmap onto my another Bitmap. You can say, I want to draw a Bitmap on another bitmap.

Suppose that I have a Bitmap as:

And I want to draw another bitmap onto this bitmap "KEEP CALM AND CHECK YOUR WORK"! This will be Bitmap 1

The Bitmap I want to place on this bitmap is like an effect overlay as:

This will be Bitmap 2

---

The Problem

I want to overlay Bitmap 2 onto Bitmap 1 say Bitmap 2 should come above Bitmap 1.

The Bitmap 2 Should get the width and height of the Bitmap 1 to cover it all.

The Bitmap 1 will be of any width and height but, I want the Bitmap 2 should get the width and height of the Bitmap 1 in any case.

My code problem is that it crops the Bitmap 1 and overlay Bitmap 2 onto it then. I mean the code is getting the Bitmap 2 width and height!

---

What I have done

public Bitmap overlay123(Bitmap bmp1, Bitmap bmp2) {
            Bitmap bmOverlay = Bitmap.createBitmap(bmp2.getWidth(), bmp2.getHeight(), bmp1.getConfig());
            float left =(bmp2.getWidth() - (bmp1.getWidth()*((float)bmp2.getHeight()/(float)bmp1.getHeight())))/(float)2.0;
            float bmp1newW = bmp1.getWidth()*((float)bmp2.getHeight()/(float)bmp1.getHeight());
            Bitmap bmp1new = getResizedBitmap(bmp1, bmp2.getHeight(), (int)bmp1newW);
            Canvas canvas = new Canvas(bmOverlay);
            canvas.drawBitmap(bmp1new, left ,0 , null);
            canvas.drawBitmap(bmp2, new Matrix(), null);
            return bmOverlay;
        }

        public Bitmap getResizedBitmap(Bitmap bm, int newHeight, int newWidth) {
            int width = bm.getWidth();
            int height = bm.getHeight();
            float scaleWidth = ((float) newWidth) / width;
            float scaleHeight = ((float) newHeight) / height;
            Matrix matrix = new Matrix();
            matrix.postScale(scaleWidth, scaleHeight);
            Bitmap resizedBitmap = Bitmap.createBitmap(bm, 0, 0, width, height, matrix, false);
            return resizedBitmap;
}

---

Problem with the above code is that it crops or resizes bitmap 1 width and height!

---

Try 2

private Bitmap overlayer(Bitmap bmp1, Bitmap bmp2) {
    Bitmap bmOverlay = Bitmap.createBitmap(bmp1.getWidth(), bmp1.getHeight(), bmp1.getConfig());
    Canvas canvas = new Canvas(bmOverlay);
    canvas.drawBitmap(bmp1, new Matrix(), null);
    canvas.drawBitmap(bmp2, new Matrix(), null);
    return bmOverlay;
}

---

Problem with code is that It always show the Bitmap 2 in the top left corner with a smaller size!

---

I just need to know how can I place the Bitmap 2 onto Bitmap 1 getting width and height same as of Bitmap 1.

I am newbie to Bitmap Codes so I have no idea about it

Thanks in advace!

The final image should look like:

Answer 1

First of all, i advice you to use your Try2 as basis for further work. But i would slightly modify the code to that:

private Bitmap overlayer(Bitmap bmp1, Bitmap bmp2) {
    Bitmap bmOverlay = Bitmap.createBitmap(bmp1.getWidth(), bmp1.getWidth(), bmp1.getConfig());
    Canvas canvas = new Canvas(bmOverlay);
    canvas.drawBitmap(bmp1, null, new Rect(0,0,bmp1.getWidth(),bmp1.getHeight()), new Paint());
    canvas.drawBitmap(bmp2, null, new Rect(0,0,bmp1.getWidth(),bmp1.getHeight()), new Paint());
    return bmOverlay;
}

I have used the constructor mentioned on the android developer reference for drawing bitmaps. You define a new Recatangle, that servers as shape for scaling/drawing the bitmaps to the canvas. In your case, i am defining the rectangle with same size as your bitmap1. If you hand this recangle box over to the method, which is drawing the canvas, the canvas will scale the bitmap to that box size and draw it on the canvas.

Answer 2

MainActivity Output.

public class MainActivity extends Activity {
    private ImageView Img;

    /**
     * Called when the activity is first created.
     */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        Button button = (Button) findViewById(R.id.button);
        Img = (ImageView) findViewById(R.id.imageView);
        button.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Bitmap bm = BitmapFactory.decodeResource(getResources(), R.drawable.top);
                Bitmap bmt = BitmapFactory.decodeResource(getResources(), R.drawable.back);
                Img.setImageBitmap(overlayer(bm, bmt));

            }
        });
    }
    private Bitmap overlayer(Bitmap bmp1, Bitmap bmp2) {
        Bitmap bmOverlay = Bitmap.createBitmap(bmp1.getWidth(), bmp1.getHeight(), bmp1.getConfig());
        Canvas canvas = new Canvas(bmOverlay);
        canvas.drawBitmap(bmp1, new Matrix(), null);
        canvas.drawBitmap(bmp2, new Matrix(), null);
        return bmOverlay;
    }
}

activity_main.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">


    <ImageView
        android:id="@+id/imageView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="New Button"
        android:id="@+id/button"
        android:layout_alignParentTop="true"
        android:layout_alignParentStart="true" />
</RelativeLayout>

Output:

Output result see here.