How To Merge/save Image After Overlaying Other Image?

I am implementing an application in which there are two images . First image is static or rather say 'drop-target' for android 'Drag & Drop' concept and second image is 'dragga

Solution 1:

This function converts a view into a bitmap. Pass on your target Image to the following method, and a bitmap will be returned of all its children views.

publicstatic Bitmap getBitmapFromView(View view) {
    //Define a bitmap with the same size as the viewBitmapreturnedBitmap= Bitmap.createBitmap(view.getWidth(), view.getHeight(),Bitmap.Config.ARGB_8888);
    //Bind a canvas to itCanvascanvas=newCanvas(returnedBitmap);
    //Get the view's backgroundDrawablebgDrawable=view.getBackground();
    if (bgDrawable!=null) 
        //has background drawable, then draw it on the canvas
        bgDrawable.draw(canvas);
    else//does not have background drawable, then draw white background on the canvas
        canvas.drawColor(Color.WHITE);
    // draw the view on the canvas
    view.draw(canvas);
    //return the bitmapreturn returnedBitmap;
}

Solution 2:

Please try this in the saveImage() method:

try {
    // Create a new File instance to save the generated image;Filefile=newFile(Environment.getExternalStorageDirectory()
            .getPath() + "/saved.png");
    // Check if File does not exist in the storage;if (!file.exists()) {
        // Create a physical File;
        file.createNewFile();
    }
    // Initialize a FileOutputStream to write to the File;FileOutputStreamfos=newFileOutputStream(file);
    // Top edge Y coordinate of the top most child View;intboundTop= m_alTop.getMeasuredHeight();
    // Left edge X coordinate of the left most child View;intboundLeft= m_alTop.getMeasuredWidth();
    // Bottom edge Y coordinate of the bottom most child View;intboundBottom=0;
    // Right edge X coordinate of the right most child View;intboundRight=0;
    // Get the total number of child Views present in the Layout;inttotalChildren= m_alTop.getChildCount();
    // Value to add as padding to the final image;intpadding=20;
    // Iterate through all the child Views;for(inti=0; i < totalChildren; i++) {
        // Get the current child View;Viewvw= m_alTop.getChildAt(i);
        // Check if it is higher than the current top edge;if(vw.getTop() < boundTop) {
            // Update the top edge value;
            boundTop = vw.getTop();
        }
        // Check if it is more leftwards than the current left edge;if(vw.getLeft() < boundLeft) {
            // Update the left edge value;
            boundLeft = vw.getLeft();
        }
        // Check if it is lower than the current bottom edge;if(vw.getBottom() > boundBottom) {
            // Update the bottom edge value;
            boundBottom = vw.getBottom();
        }
        // Check if it is more rightwards than the current right edge;if(vw.getRight() > boundRight) {
            // Update the right edge value;
            boundRight = vw.getRight();
        }
    }
//  Toast.makeText(this, boundTop + ", " + boundLeft + ", " + boundBottom + ", " + boundRight, Toast.LENGTH_LONG)//      .show();// Calculate the final Bitmap width;intbWidth= padding + boundRight - boundLeft;
    // Calculate the final Bitmap height;intbHeight= padding + boundBottom - boundTop;
    // Create a Bitmap Object with the specified width and height;Bitmapbitmap= Bitmap.createBitmap(bWidth,
            bHeight, Bitmap.Config.ARGB_8888);
    // Initialize a Canvas to draw to the Bitmap;Canvascanvas=newCanvas(bitmap);
    // Fill the Bitmap with transparency;
    canvas.drawColor(Color.TRANSPARENT);
    /*
     * Translate the Canvas towards top left direction to compensate for
     * the blank space between the extreme Views and the edges of the
     * Layout and also the extra padding.
     */
    canvas.translate(- boundLeft + padding/2, - boundTop + padding/2);
    // Make the Layout draw its child Views on the Canvas;
    m_alTop.draw(canvas);
    // Save the Bitmap to the File instance;
    bitmap.compress(Bitmap.CompressFormat.PNG, 81, fos);
    // Flush(Clear) the FileOutputStream;
    fos.flush();
    // Close the FileOutputStream;
    fos.close();
    // Flag the Bitmap for garbage collection;
    bitmap.recycle();
}catch (Exception e) {
    Toast.makeText(this, "ERROR WHILE SAVING", Toast.LENGTH_LONG)
            .show();
    e.printStackTrace();
}

There was a stray blank TextView being added in addView() method which I had to comment out for this to work correctly:

if (m_counter % 2 == 0) {
    .
    .
    // m_alTop.addView(m_tv, new AbsoluteLayout.LayoutParams....
    m_alTop.addView(sourceImage, new AbsoluteLayout.LayoutParams....

Edit: changed Config from RGB_565 to ARGB_8888.

Edit_2015_04_16: Now saving cropped image in Bitmap with a padding and also added transparent background.