1

I need to merge two images, one on top of another. I have the first image (background.png) where it has an transparent portion. I want to put another image (image.png) on top of the background.png.

However for the final image that gets created, I only want part of the image.png that overlaps with the transparent portion of the bakground.png to be shown, the rest of the new image will show the background.

Here's my code for merging the image, but I'm not sure how to go from here. Thanks.

public class MainActivity  extends ActionBarActivity {

private ImageView collageImage;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    collageImage = (ImageView)findViewById(R.id.imageView3);

    Button combineImage = (Button)findViewById(R.id.combineimage);
    combineImage.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            Bitmap bigImage = BitmapFactory.decodeResource(getResources(), R.drawable.multiple);
            Bitmap smallImage = BitmapFactory.decodeResource(getResources(), R.drawable.multipletwo);
            Bitmap mergedImages = createSingleImageFromMultipleImages(bigImage, smallImage);

            collageImage.setImageBitmap(mergedImages);
        }
    });
}

private Bitmap createSingleImageFromMultipleImages(Bitmap firstImage, Bitmap secondImage){

    Bitmap result = Bitmap.createBitmap(firstImage.getWidth(), firstImage.getHeight(), firstImage.getConfig());
    Canvas canvas = new Canvas(result);
    canvas.drawBitmap(firstImage, 0f, 0f, null);
    canvas.drawBitmap(secondImage, 10, 10, null);
    return result;
}
}
Julia
  • 1,207
  • 4
  • 29
  • 47

1 Answers1

0

Try using 2 imageviews that overlap in the layout. Maybe use a Relative layout to position them how you want. Then you will set an image for each iamgeview and they will be "merged".

Tudor Lozba
  • 736
  • 1
  • 6
  • 9