15

I want to change the Surface preview bottom overlay with gif or image Like Vigo

Like this

enter image description here

Please tell me any sdk or what I am using for this Filter

I am able to change the overlay on the top view using this

Help of this

 PictureCallback cameraPictureCallbackJpeg = new PictureCallback() 
  {  
    @Override
    public void onPictureTaken(byte[] data, Camera camera) 
    {
      // TODO Auto-generated method stub   
      Bitmap cameraBitmap = BitmapFactory.decodeByteArray
                                                                  (data, 0, data.length);

   int   wid = cameraBitmap.getWidth();
     int  hgt = cameraBitmap.getHeight();

    //  Toast.makeText(getApplicationContext(), wid+""+hgt, Toast.LENGTH_SHORT).show();
      Bitmap newImage = Bitmap.createBitmap
                                        (wid, hgt, Bitmap.Config.ARGB_8888);

      Canvas canvas = new Canvas(newImage);

      canvas.drawBitmap(cameraBitmap, 0f, 0f, null);

     Drawable drawable = getResources().getDrawable
                                                          (R.drawable.mark3);
      drawable.setBounds(20, 30, drawable.getIntrinsicWidth()+20, drawable.getIntrinsicHeight()+30);
    drawable.draw(canvas);



      File storagePath = new File(Environment.
                    getExternalStorageDirectory() + "/PhotoAR/"); 
      storagePath.mkdirs(); 

      File myImage = new File(storagePath,
                    Long.toString(System.currentTimeMillis()) + ".jpg");

      try
      {
        FileOutputStream out = new FileOutputStream(myImage);
        newImage.compress(Bitmap.CompressFormat.JPEG, 80, out);


        out.flush();
        out.close();
      }
      catch(FileNotFoundException e)
      {
        Log.d("In Saving File", e + "");    
      }
      catch(IOException e)
      {
        Log.d("In Saving File", e + "");
      }

      camera.startPreview();



      newImage.recycle();
      newImage = null;

      Intent intent = new Intent();
      intent.setAction(Intent.ACTION_VIEW);

      intent.setDataAndType(Uri.parse("file://" + myImage.getAbsolutePath()), "image/*");
      startActivity(intent);

    }
  };

output of this

enter image description here

enter image description here

Arjun saini
  • 4,223
  • 3
  • 23
  • 51
  • Do you just want to overlay images with GIFs? I am not clear on what you exactly want to do. – zindarod May 10 '18 at 10:45
  • Yes, I want to change the camera preview on real-time except human body with Gif, jpg or others... Just like Chroma key does... Green background Replace.... – Arjun saini May 10 '18 at 11:12
  • please remove the opencv tag. am sure its not related to opencv. unless you want to use opencv to achieve this. also this question seems too broad – kishea May 10 '18 at 13:31
  • Looking at the expected result I believe it involves edge detection. Take a look at this [library](https://github.com/bwr/edgefinder) and this [post](http://scientistengineer.blogspot.sg/2015/09/opencv-for-edge-detection-real-time.html) – pradithya aria Apr 17 '18 at 14:58

2 Answers2

6

Use GLSurfaceView. The basic idea is to have the camera preview in GLSurfaceView and draw OpenGL renderings.
The common approach is to subclass the GLSurfaceView and implements the GLSurfaceView.Renderer. The rendering tasks are performed by implementing the interface.

public class CameraRenderer extends GLSurfaceView implements GLSurfaceView.Renderer, SurfaceTexture.OnFrameAvailableListener { 
    @Override
    public synchronized void onSurfaceCreated(GL10 gl, EGLConfig config) {
        ...
        //compile shader here
    }

    @Override
    public synchronized void onSurfaceChanged(GL10 gl, int width, int height) {
        ...
        //open camera and start preview here
    }

    @Override
    public synchronized void onDrawFrame(GL10 gl) {
        ...
        //draw frame as required
    }

}

Check out this grafika project to get a better idea and this project which is close to what you're trying to do.

Udit Mukherjee
  • 687
  • 5
  • 20
2

You need to use external libraries for that.

for using filters in camera,and such virtual effects.

Try this Libraries:

1)CameraFilter

2)This are Basic filters.

You can learn here how to implement this basic filters.

3)EffectFactory

This are effects like Instagram.

3)FaceLandMarks

This are effects like Snapchat, but for this you will need to purchase a key for using that from that api page.

blackgreen
  • 34,072
  • 23
  • 111
  • 129
Mrunal Chauhan
  • 51
  • 1
  • 12