Question

I have a SurfaceView that is being used to draw images, and I would like to overlay them onto a live-feed from the phone’s camera. I have read Overlay images onto camera preview surfaceview
and how to draw an overlay on a surfaceview used by camera on android

    public class TestCameraOverlayActivity extends Activity { 
         Bitmap bitmap;

         /** Called when the activity is first created. */ 
         @Override 
         public void onCreate(Bundle savedInstanceState) { 
               super.onCreate(savedInstanceState); 
               requestWindowFeature(Window.FEATURE_NO_TITLE); 
               Preview mPreview = new Preview(this); 
               DrawOnTop mDraw = new DrawOnTop(this); 
               bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.icon);
               setContentView(mPreview); 
               addContentView(mDraw, new LayoutParams (LayoutParams.WRAP_CONTENT,
               LayoutParams.WRAP_CONTENT)); 
        } 

        class DrawOnTop extends View { 
            public DrawOnTop(Context context) { 
                super(context); 

        } 

        @Override 
        protected void onDraw(Canvas canvas) { 
            Paint paint = new Paint(); 
            paint.setStyle(Paint.Style.STROKE); 
            paint.setColor(Color.BLACK); 
            canvas.drawText("Test Text", 10, 10, paint); 
            canvas.drawBitmap(bitmap, 0, 0, null);
            super.onDraw(canvas); 
        } 
    } 

    class Preview extends SurfaceView implements SurfaceHolder.Callback { 
        SurfaceHolder mHolder; 
        Camera mCamera; 

        Preview(Context context) { 
            super(context); 
            // Install a SurfaceHolder.Callback so we get notified when the 
            // underlying surface is created and destroyed. 
            mHolder = getHolder(); 
            mHolder.addCallback(this); 
            mHolder.setType(SurfaceHolder.SURFACE_TYPE_PUSH_BUFFERS); 
        } 

        public void surfaceCreated(SurfaceHolder holder) { 
            // The Surface has been created, acquire the camera and tell it where 
            // to draw. 
            mCamera = Camera.open(); 
             try {
        mCamera.setPreviewDisplay(holder);
        } catch (IOException e) {

            e.printStackTrace();
        } 
        } 

        public void surfaceDestroyed(SurfaceHolder holder) { 
           // Surface will be destroyed when we return, so stop the preview. 
           // Because the CameraDevice object is not a shared resource, it's very 
           // important to release it when the activity is paused. 
           mCamera.stopPreview(); 
           mCamera = null; 
        } 

        public void surfaceChanged(SurfaceHolder holder, int format, int w, int h) { 
            // Now that the size is known, set up the camera parameters and begin 
            // the preview. 
            Camera.Parameters parameters = mCamera.getParameters(); 
            parameters.setPreviewSize(w, h); 
            mCamera.setParameters(parameters); 
            mCamera.startPreview(); 
       } 
    } 
 }

if you run it you can one see image on the preview SurfaceView, but my question is how to save them together as jpeg on the sdcard. Can you give some advice, if i need Format conversion so that i can save them at the same time. My partial solution to save the image only

/** Handles data for jpeg picture */
PictureCallback jpegCallback = new PictureCallback() {

public void onPictureTaken(byte[] data, Camera camera) {
    FileOutputStream outStream = null;
try {
    // write to local sandbox file system
        // outStream = CameraDemo.this.openFileOutput(String.format("%d.jpg", 
           System.currentTimeMillis()), 0); 

        // Or write to sdcard
    outStream = new FileOutputStream(String.format("/sdcard/%d.jpg", 
        System.currentTimeMillis()));   
    outStream.write(data);
    outStream.close();
    Log.d(TAG, "onPictureTaken - wrote bytes: " + data.length);
} catch (FileNotFoundException e) {
    e.printStackTrace();
} catch (IOException e) {
    e.printStackTrace();
} finally {
}
Log.d(TAG, "onPictureTaken - jpeg");
}
};

Answer 1

I think you are asking how to merge the two images into one.

The first thing you should do is use an AsynchHandler to save your image so you don’t lock up the UI, that’s not part of your issue but it will be.

As to your general question it was asked and answered here in general you will need to merge the two image parts together and handle scaling of your overlay as a whole, or the component image parts.