How can I set camera preview size to squared aspect ratio in a squared SurfaceView (like Instagram)

Question

I'm trying to develop my own camera activity, but I have a problem that I'm not unable to solve...

What I want, is something very similiar to instagram photo frame, and this is what I get:

When I should get something like this:

and...

when I should get something like:

I think I'm maanaging the SurfaceView and Camera preview well, only using

Camera.Parameters parameters = camera.getParameters();
camera.setDisplayOrientation(90);

and Custom SurfaceView:

public class SquaredSurfaceView extends SurfaceView {

private int width;
private int height;

public SquaredSurfaceView(Context context) {
    super(context);
}

public SquaredSurfaceView(Context context, AttributeSet attrs) {
    super(context, attrs);
}

public SquaredSurfaceView(Context context, AttributeSet attrs, int defStyle) {
    super(context, attrs, defStyle);
}

@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
    super.onMeasure(widthMeasureSpec, heightMeasureSpec);
    width = MeasureSpec.getSize(widthMeasureSpec);
    height = width;
    setMeasuredDimension(width, width);
}

public int getViewWidth() {
    return width;
}

public int getViewHeight() {
    return height;
}

}

What I'm doing wrong?? :-(

Answer 1

As said before you need to find the correct preview size (the one with aspect ratio 1:1) and probably you have to use FrameLayout for the SurfacePreview. It seems that you have and aspect ratio problem maybe you have the right preview size but you are placing it in an incorrect layout.

Another solution might be (just like Instagram does) to make your camera at full size and then hide some areas of the layout just to make it look like a square. Then by software you would have to cut the image to make it a real square.

Hope this helps you