Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Android - How to use camera getSupportedPreviewSizes() for portrait orientation

I'm trying to embed a camera preview in an activity. And it's only in portrait orientation. The problem is the preview gets stretched.

I've tried to pick the optimal size. But the problem is all supported preview sizes from getSupportedPreviewSizes() returns sizes in landscape orientation. So picking the right size according to my code won't work I guess.

My layout XML:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_take_attendance"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:orientation="vertical"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.lab.rafael.smartattendance.TakeAttendanceActivity">

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="@string/take_attendance_label"
        android:id="@+id/take_attendance_label"
        android:layout_marginBottom="@dimen/activity_vertical_margin"/>

    <!-- camera preview container -->
    <FrameLayout
        android:layout_width="wrap_content"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:background="@color/red"
        android:id="@+id/take_attendance_scan_qr_frame"/>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <EditText
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:hint="@string/take_attendance_manual_text"
            />
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/take_attendance_manual_button"
            android:id="@+id/take_attendance_manual_button"/>
    </LinearLayout>
</LinearLayout>

Here's my CameraPreview class:

package com.lab.rafael.smartattendance.camera;

import android.content.Context;
import android.hardware.Camera;
import android.util.Log;
import android.view.SurfaceHolder;
import android.view.SurfaceView;
import java.io.IOException;
import java.util.List;

public class CameraPreview extends SurfaceView implements SurfaceHolder.Callback {
    private Camera mCamera = null;
    private SurfaceHolder mHolder = null;
    private Camera.Size optimalSize = null;

    public CameraPreview(Context context, Camera camera)
    {
        super(context);
        mCamera = camera;
        mHolder = getHolder();
        mHolder.addCallback(this);
    }

    @Override
    public void surfaceCreated(SurfaceHolder holder) {
        try {
            Camera.Parameters params = mCamera.getParameters();
            List<String> focusModes = params.getSupportedFocusModes();
            mCamera.setDisplayOrientation(90);
            mCamera.setPreviewDisplay(holder);

            if(focusModes.contains(Camera.Parameters.FOCUS_MODE_CONTINUOUS_PICTURE)) {
                params.setFocusMode(Camera.Parameters.FOCUS_MODE_CONTINUOUS_PICTURE);
            }

            if(optimalSize != null) {
                params.setPreviewSize(optimalSize.width, optimalSize.height);
            }

            mCamera.setParameters(params);

            mCamera.startPreview();
        } catch (IOException e)
        {
            Log.e("created_error", e.getMessage());
        }

    }

    @Override
    public void surfaceChanged(SurfaceHolder holder, int format, int width, int height) {
        if(mHolder.getSurface() == null) {
            return;
        }

        try {
            mCamera.stopPreview();
        } catch (Exception e) {
            Log.e("changed_error", e.getMessage());
        }

        try {
            mCamera.setPreviewDisplay(holder);
            mCamera.startPreview();
        } catch (IOException e){
            Log.e("error", e.getMessage());
        }
    }

    @Override
    public void onMeasure(int measureWidthSpec, int measureHeightSpec) {
        optimalSize = getOptimalSize(MeasureSpec.getSize(measureWidthSpec), MeasureSpec.getSize(measureHeightSpec));
        setMeasuredDimension(optimalSize.width, optimalSize.height);
    }

    protected Camera.Size getOptimalSize(int width, int height) {
        List<Camera.Size> supportedSizes = mCamera.getParameters().getSupportedPreviewSizes();
        double targetRatio = (double) width / height,
                optimalRatio = 0.0,
                acceptableRatioMargin = 0.1,
                minDiff = Double.MAX_VALUE;


        for(Camera.Size size : supportedSizes) {
            optimalRatio = (double) size.width / size.height;
            if(Math.abs(optimalRatio - targetRatio) < acceptableRatioMargin) {
                if(Math.abs(height - size.height) < minDiff) {
                    minDiff = Math.abs(height - size.height);
                    optimalSize = size;
                }
            }
        }

        if(optimalSize == null) {
            for(Camera.Size size : supportedSizes) {
                if(Math.abs(height - size.height) <= minDiff) {
                    minDiff = Math.abs(height - size.height);
                    optimalSize = size;
                }
            }
        }

        return optimalSize;
    }

    public void surfaceDestroyed(SurfaceHolder holder) {
    }
}

The below images is resulting from the values:

Specified resolution from measureSpecWidth/Height = `984x1335`

Returned from getOptimalSize() = `1600x1200`.

Because provided supportedPreviewSizes are for landscape not portrait.

Here's the result:

enter image description here

like image 955
Rafael Adel Avatar asked Nov 08 '16 00:11

Rafael Adel


2 Answers

I had same problem like 1 year ago. Plus I had to deal with frontal and back camera. I don't remember much about the code but I tried it before posting this answer an it's still working like a charm.
Hope you can dig and compare with your code. I can share more code if you just something working ;)

/**
 * A simple wrapper around a Camera and a SurfaceView that renders a centered preview of the Camera
 * to the surface. We need to center the SurfaceView because not all devices have cameras that
 * support preview sizes at the same aspect ratio as the device's display.
 */
public class Preview extends ViewGroup implements SurfaceHolder.Callback {

    SurfaceView mSurfaceView;
    SurfaceHolder mHolder;
    Camera.Size mPreviewSize;
    List<Camera.Size> mSupportedPreviewSizes;
    Camera mCamera;
    private Context context;
    private int mCameraId;
    public boolean use_front_camera;

    public Preview(Context context, int cameraId) {
        super(context);

        this.context = context;
        mCameraId = cameraId;
        use_front_camera = true;

        mSurfaceView = new SurfaceView(context);
        addView(mSurfaceView);

        // Install a SurfaceHolder.Callback so we get notified when the
        // underlying surface is created and destroyed.
        mHolder = mSurfaceView.getHolder();
        mHolder.addCallback(this);
    }

    public void setCamera(Camera camera) {
        mCamera = camera;
        if (mCamera != null) {
            mSupportedPreviewSizes = mCamera.getParameters().getSupportedPreviewSizes();
            requestLayout();
        }
    }

    public void switchCamera(Camera camera) {
        setCamera(camera);
        try {
            camera.setPreviewDisplay(mHolder);
        } catch (IOException exception) {
            android.util.Log.e(IdelityConstants.DEBUG_IDELITY_KEY_LOG, "IOException caused by setPreviewDisplay()", exception);
        }
        Camera.Parameters parameters = camera.getParameters();
        parameters.setPreviewSize(mPreviewSize.width, mPreviewSize.height);
        requestLayout();

        camera.setParameters(parameters);
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        // We purposely disregard child measurements because act as a
        // wrapper to a SurfaceView that centers the camera preview instead
        // of stretching it.

        int width = MeasureSpec.getSize(widthMeasureSpec);
        int height = MeasureSpec.getSize(heightMeasureSpec);

        //MUST CALL THIS
        setMeasuredDimension(width, height);

        if (mSupportedPreviewSizes != null) {
            mPreviewSize = getOptimalPreviewSize(mSupportedPreviewSizes, width, height);
        }
    }

    @Override
    protected void onLayout(boolean changed, int l, int t, int r, int b) {
        if (changed && getChildCount() > 0) {
            final View child = getChildAt(0);

            final int width = r - l;
            final int height = b - t;

            int previewWidth = width;
            int previewHeight = height;
            if (mPreviewSize != null) {
                /**
                 * Como el calculo se hace con la cámara en modo landscape y luego toca
                 * girar la cámara para que se vea bien, se pasan los valores cambiados.
                 */
                previewWidth = mPreviewSize.height;
                previewHeight = mPreviewSize.width;
            }

            // Center the child SurfaceView within the parent.
            if (width * previewHeight < height * previewWidth) {
                final int scaledChildWidth = previewWidth * height / previewHeight;
                child.layout((width - scaledChildWidth) / 2, 0,
                    (width + scaledChildWidth) / 2, height);
            } else {
                final int scaledChildHeight = previewHeight * width / previewWidth;
                child.layout(0, (height - scaledChildHeight) / 2,
                    width, (height + scaledChildHeight) / 2);
            }
        }
    }

    public void surfaceCreated(SurfaceHolder holder) {
        // The Surface has been created, acquire the camera and tell it where
        // to draw.
        try {
            if (mCamera != null) {
                mCamera.setPreviewDisplay(holder);
            }
        } catch (IOException exception) {
            android.util.Log.e(IdelityConstants.DEBUG_IDELITY_KEY_LOG, "IOException caused by setPreviewDisplay()", exception);
        }
    }

    public void surfaceDestroyed(SurfaceHolder holder) {
        // Surface will be destroyed when we return, so stop the preview.
    //        if (mCamera != null) {
    //            mCamera.stopPreview();
    //        }
    }


    private Camera.Size getOptimalPreviewSize(List<Camera.Size> sizes, int w, int h) {
        final double ASPECT_TOLERANCE = 0.1;
        double targetRatio = (double) w / h;
        if (sizes == null) return null;

        Camera.Size optimalSize = null;
        double minDiff = Double.MAX_VALUE;

        int targetHeight = h;

        // Try to find an size match aspect ratio and size
        for (Camera.Size size : sizes) {
            double ratio = (double) size.width / size.height;
            if (Math.abs(ratio - targetRatio) > ASPECT_TOLERANCE) continue;
            if (Math.abs(size.height - targetHeight) < minDiff) {
                optimalSize = size;
                minDiff = Math.abs(size.height - targetHeight);
            }
        }

        // Cannot find the one match the aspect ratio, ignore the requirement
        if (optimalSize == null) {
            minDiff = Double.MAX_VALUE;
            for (Camera.Size size : sizes) {
                if (Math.abs(size.height - targetHeight) < minDiff) {
                    optimalSize = size;
                    minDiff = Math.abs(size.height - targetHeight);
                }
            }
        }
        return optimalSize;
    }

    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.

        if (mCamera == null)
            return;

        Camera.Parameters parameters = mCamera.getParameters();
        parameters.setFlashMode(Camera.Parameters.FLASH_MODE_AUTO);
            parameters.setFocusMode(Camera.Parameters.FOCUS_MODE_CONTINUOUS_PICTURE);
        parameters.setJpegQuality(100);
        parameters.setPreviewSize(mPreviewSize.width, mPreviewSize.height);


        List<Camera.Size> sizes = parameters.getSupportedPictureSizes();
        Camera.Size size = sizes.get(0);
        for(int i=0;i<sizes.size();i++)
        {
            if(sizes.get(i).width > size.width)
                size = sizes.get(i);
        }
        parameters.setPictureSize(size.width, size.height);


        requestLayout();


        mCamera.setParameters(parameters);
            mCamera.setDisplayOrientation(getCameraDisplayOrientation((FragmentActivity)context, mCameraId));
        mCamera.startPreview();
    }


    public static int getCameraDisplayOrientation(FragmentActivity activity, int cameraId) {
        Camera.CameraInfo info = new Camera.CameraInfo();

        Camera.getCameraInfo(cameraId, info);
        int rotation = activity.getWindowManager().getDefaultDisplay().getRotation();

        int degrees = 0;
        switch (rotation) {
            case Surface.ROTATION_0: degrees = 0; break;
            case Surface.ROTATION_90: degrees = 90; break;
            case Surface.ROTATION_180: degrees = 180; break;
            case Surface.ROTATION_270: degrees = 270; break;
        }


        int result;
        if (info.facing == Camera.CameraInfo.CAMERA_FACING_FRONT) {
            result = (info.orientation + degrees) % 360;
            result = (360 - result) % 360;  // compensate the mirror
        }
        else {  // back-facing
            result = (info.orientation - degrees + 360) % 360;
        }

        return result;
    }


    /** A safe way to get an instance of the Camera object. */
    public static Camera getCameraInstance(int cameraIndex){
        Camera c = null;
        try {
            c = Camera.open(cameraIndex); // attempt to get a Camera instance
        }
        catch (Exception e){
            // Camera is not available (in use or does not exist)
            android.util.Log.e(IdelityConstants.ERROR_IDELITY_KEY_LOG, "Camera is not available: " + e.getMessage());
        }
        return c; // returns null if camera is unavailable
    }
}



here is the XML, its simple (you will see in the screenshot). The only important thing is the FrameLayout with id: capture_evidence_camera_preview

<RelativeLayout
    android:layout_width="fill_parent"
    android:layout_height="0dp"
    android:id="@+id/capture_evidence_linearLayout_camera"
    android:layout_weight="3"
    android:layout_gravity="center_horizontal">


    <FrameLayout
        android:id="@+id/capture_evidence_camera_preview"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerVertical="true"
        android:layout_centerHorizontal="true"/>

    <TextView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="@string/capture_evidence_default_text_number_evidence"
        android:id="@+id/capture_evidence_textView_value_typed"
        android:textSize="50sp"
        android:textColor="@color/idelity_blanco"
        android:gravity="center_horizontal"
        android:paddingLeft="5dp"
        android:paddingRight="5dp"
        android:background="#d2000000"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        android:paddingTop="8dp"
        android:paddingBottom="8dp" />
</RelativeLayout>


<RelativeLayout
    android:layout_width="fill_parent"
    android:layout_height="0dp"
    android:layout_weight="1">

    <net.idelity.idelitymobile.ui.helpers.IdelityButton
        android:layout_width="wrap_content"
        android:layout_height="fill_parent"
        android:text="@string/button_back"
        android:id="@+id/capture_evidence_button_cancel"
        android:layout_alignParentBottom="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:background="@drawable/button_gray"
        android:textColor="@color/idelity_blanco"
        android:textSize="20sp"
        android:paddingLeft="40dp"
        android:paddingRight="40dp"
        android:textStyle="bold" />

    <net.idelity.idelitymobile.ui.helpers.IdelityButton
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:id="@+id/capture_evidence_button_capture_evidence"
        android:layout_alignParentBottom="true"
        android:layout_toRightOf="@+id/capture_evidence_button_cancel"
        android:layout_toEndOf="@+id/capture_evidence_button_cancel"
        android:background="@drawable/take_photo_button_camera"
        android:textSize="25sp"
        android:textColor="@color/idelity_blanco"
        android:textStyle="bold"
        android:text="@string/capture_evidence_button_capture_evidence"
        android:paddingBottom="10dp" />
</RelativeLayout>

XML preview

Its used under an FragmentActivity (I can share it if you need it too)

like image 181
MiguelHincapieC Avatar answered Oct 21 '22 01:10

MiguelHincapieC


tl;dr the sizes used both in getSupportedPreviewSizes() and in setPreviewSize(int width, int height) are in the original camera orientation, which might (and usually is) different to the natural phone's orientation and the current display orientation.

Because of this the getOptimalSize(int, int) method looped through the sizes when they are on their side (and using 1/ratio of them because of that), not picking any of them and choosing a wrong ratio at the end, based on the height according to the second loop in the method, resulting in a squashed image.


Apparently, the supported sizes are always referring to the camera in its natural angle (although the documentation does not tell us that). The camera's natural angle is normally not the same as the natural angle of the phone. You can check the difference between them using the CameraInfo.orientation field.

The documentation that does hint that this is true (besides trying it out) is the same documentation that solves your mystery as well: Camera.Parameters.setPreviewSize(int width, int height):

The sides of width and height are based on camera orientation. That is, the preview size is the size before it is rotated by display orientation. So applications need to consider the display orientation while setting preview size. For example, suppose the camera supports both 480x320 and 320x480 preview sizes. The application wants a 3:2 preview ratio. If the display orientation is set to 0 or 180, preview size should be set to 480x320. If the display orientation is set to 90 or 270, preview size should be set to 320x480. The display orientation should also be considered while setting picture size and thumbnail size.

(Documentation here)

We can learn a couple of things from that:

  1. The sizes you get are supposed to be the same no matter what the display/phone orientation is, so there is nothing wrong with the values you see there. You should turn them on their side in order to pick the best one for the onMeasure() method to measure the view in a portrait orientation (based on the screen and space you want the preview to occupy).

    Ideally - turn them after you confirmed the camera's mounting angle and the current phone's angle are not compatible (one landscape and one portrait).

    //in getOptimalSize(int width, int height)
             //isCameraOnSide() is a new method you should implement
             //return true iff the camera is mounted on the side compared to 
             //the phone's natural orientation.
    double targetRatio = (isCameraOnSide()) ?  (double) height / width 
                            : (double) width / height,
            optimalRatio = 0.0,
            acceptableRatioMargin = 0.1,
            minDiff = Double.MAX_VALUE;
    
    
    for(Camera.Size size : supportedSizes) {
        optimalRatio = (double) size.width / size.height;
        if(Math.abs(optimalRatio - targetRatio) < acceptableRatioMargin) {
            if(Math.abs(height - size.height) < minDiff) {
                minDiff = Math.abs(height - size.height);
                optimalSize = size;
            }
        }
    }
    

    In your and my cases isCameraOnSide() returns true - as we can see from your line of setPreviewOrientation(90). For a more general implementation, here's one based google's Camera2Basic sample:

    private boolean isCameraOnSide(){
        int displayRotation = activity.getWindowManager().getDefaultDisplay().getRotation();
        //Inquire the sensor's orientation relative to the natural phone's orientation
        android.hardware.Camera.CameraInfo info =
            new android.hardware.Camera.CameraInfo();
        android.hardware.Camera.getCameraInfo(0, info); //Back-facing camera
        int sensorOrientation = info.orientation;
    
        boolean swappedDimensions = false;
        switch (displayRotation) {
            case Surface.ROTATION_0:
            case Surface.ROTATION_180:
                if (sensorOrientation == 90 || sensorOrientation == 270) {
                    swappedDimensions = true;
                }
                break;
            case Surface.ROTATION_90:
            case Surface.ROTATION_270:
                if (sensorOrientation == 0 || sensorOrientation == 180) {
                    swappedDimensions = true;
                }
                break;
            default:
                Log.e(TAG, "Display rotation is invalid: " + displayRotation);
        }
    
        return swappedDimensions;
    }
    
  2. And more importantly: If you use the Camera.Parameters.getPreviewSize() method as a watch or in a Log I think you will see that it is set to a different ratio than the one of the size picked by the setMearuseDimension(int, int) method. This difference in ratios is the origin of the stretch/squash (it looks squashed vertically in your picture. That can also be a hint that the distortion is not from a landscape/portrait confusion, as a landscape picture in portrait view would be stretched vertically rather than squashed). After choosing the right size for the view (in this case SurfaceView), you should call Camera.Parameters.setPreviewSize(int width, int height) with a supported preview size that has the same ratio as the size you used for the view (again, width according to the camera, not the current phone/display orientation. That means it might go into the height parameter).

    For example, you could do that in surfaceCreated and surfaceChanged methods (worked for me). Make sure the preview is not on when you set the camera's preview size and start it (or re-start it) after you do:

        //inside surfaceCreated(SurfaceHolder holder)
        Camera.Parameters params = mCamera.getParameters(); 
        Camera.Size prevSize = getOptimalSize(getWidth(), getHeight()); 
             //prevSize should be still in the camera's orientation. In your and my cases - landscape
        params.setPreviewSize(prevSize.width, prevSize.height);
        mCamera.setParameters(params);
    
        mCamera.setPreviewDisplay(holder);
        mCamera.startPreview();
    
like image 27
et_l Avatar answered Oct 21 '22 01:10

et_l