how to fill image fullscreen in android

Question

<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ImageView
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:id="@+id/imageview"
        android:scaleType="centerCrop"/>
    <RelativeLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_above="@+id/imagecancel"
        android:layout_marginBottom="10dp"
        android:background="#80000000">
    <EditText
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:id="@+id/imagecaption"
        android:hint="Enter a description"
        android:textColorHint="#80ffffff"
        android:textColor="#ffffff"
        android:layout_marginRight="10dp"
        android:layout_marginLeft="10dp"/>
    </RelativeLayout>
    <ImageButton
        android:contentDescription="@string/imagecancel"
        android:id="@+id/imagecancel"
        android:layout_width="wrap_content"
        android:layout_height="40dp"
        android:layout_alignParentBottom="true"
        android:layout_alignParentLeft="true"
        android:layout_marginLeft="10dp"
        android:layout_marginBottom="10dp"
        android:scaleType="fitStart"
        android:background="@android:color/transparent"
        android:src="@drawable/cancel"/>
    <ImageButton
        android:contentDescription="@string/imagesave"
        android:id="@+id/imagesave"
        android:layout_width="wrap_content"
        android:layout_height="40dp"
        android:layout_alignParentBottom="true"
        android:layout_alignParentRight="true"
        android:layout_marginRight="10dp"
        android:layout_marginBottom="10dp"
        android:scaleType="fitEnd"
        android:background="@android:color/transparent"
        android:src="@drawable/ok"/>

</RelativeLayout>

Java

private void previewCapturedImage() {



        try {

            BitmapFactory.Options options = new BitmapFactory.Options();
            options.inSampleSize = 1;
            ExifInterface exif = null;
            int orientation = 0;//Since API Level 5
            try {
                exif = new ExifInterface(fileUri.getPath());
                orientation = exif.getAttributeInt(ExifInterface.TAG_ORIENTATION, ExifInterface.ORIENTATION_NORMAL);
            } catch (IOException e) {
                e.printStackTrace();
            }
            String exifOrientation = exif.getAttribute(ExifInterface.TAG_ORIENTATION);

            Log.i("file path",exifOrientation);

            final Bitmap bitmap = BitmapFactory.decodeFile(fileUri.getPath());

            previewimage.setImageBitmap(bitmap);
            switch(orientation) {

                case ExifInterface.ORIENTATION_ROTATE_270:
                    Log.i("RotateBitmap","270");
                    RotateBitmap(bitmap, 270);
                    previewimage.setRotation(270);
                    break;
                case ExifInterface.ORIENTATION_ROTATE_90:
                    Log.i("RotateBitmap","90");
                    RotateBitmap(bitmap, 90);
                    previewimage.setRotation(90);
                    break;
                case ExifInterface.ORIENTATION_ROTATE_180:
                    Log.i("RotateBitmap","180");
                    RotateBitmap(bitmap, 180);
                    previewimage.setRotation(180);
                    break;
            }







        } catch (NullPointerException e) {
            e.printStackTrace();
        }

    }

    public static Bitmap RotateBitmap(Bitmap source, float angle)
    {
        Matrix matrix = new Matrix();
        matrix.postRotate(angle);
        previewimage.setImageBitmap(source);
        return Bitmap.createBitmap(source, 0, 0, source.getWidth(), source.getHeight(), matrix, true);
    }

here image fill normaly in small screen phones. But in large screen phone image didn't show correctly.It shows a gap 2cm from top and 2cm from bottom. The image comes from taking picture from phone camera. I want to fill image fullscreen. How to solve this problem.

Answer 1

The source of your problem is a difference between the side ratio of your current preview area compared to side ratio of the picture you're getting. Your preview area will be different on different devices (even on the same device in different orientation - caused by 'soft buttons' position), and the image you get from the camera has rarely the same side ratio as you current preview.

Your question can be answered without any code. Just draw one rectangle (non-square) and one square on a piece of paper and try to fit one into another.

The rectangle (wide or tall) represents you phone and the square represents the picture you've got from the camera (it mostly isn't square, but I use square here to make it clearer to demonstrate).

If you take these 2 shapes and try to 'fit' one into another, you will end up with 3 different scenarios:

1. you manage to fit square into rectangle by stretching/squeezing it. This is definitely not the result to shoot for (first, it is not square anymore, second, our grandma's face will be too fat or too skinny :-)
2. you fit the full square into your rectangle and you'll see 2 unfilled areas (if you center it) - this is the situation you're complaining about. Also called 'fit-in' or 'letterbox';
3. you fill the full rectangle with a portion of your square and two sides of your square will overflow the rectangle. This case looks like you've achieved your goal if you don't mind that you lost some of your image. Situation is sometime called 'pan&scan'.

So, how does this rant help you? If you insist on filling the full screen (and losing overflowing image portion), you adjust your SurfaceView area after you get your image, use it's width / height to calculate the ratios.

If you really insist on seeing some code, it's done here (see the setLayoutParams), but be warned, the example I'm pointing to is more complicated and involves custom camera handling. But the general idea is the same.

Good Luck

Answer 2

Change the scaletype

   <ImageView
 android:layout_width="fill_parent"
 android:layout_height="fill_parent"
 android:id="@+id/imageview"
 android:scaleType="fitXY"/>

Answer 3

try this

<ImageView
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:id="@+id/imageview"
        android:scaleType="fitXY"/>

Answer 4

if you want, you can set it as RelativeLayout background in xml.

android:background="@drawable/_image"

or set it dynamically.