Image stretched when set as background in the Relative layout

Question

I am capturing image from camera and sending it to the server .I am displaying the captured image in the background of RelativeLayout using the following code:

private void previewMedia(boolean isImage) {
    // Checking whether captured media is image or video
    if (isImage) {
        Log.e("Preview Media", "Called");
        BitmapFactory.Options options = new BitmapFactory.Options();

        // down sizing image as it throws OutOfMemory Exception for larger images
        options.inSampleSize = 8;
        //options.inScaled = false;

        Log.e("File URI", String.valueOf(fileUri));

        final Bitmap bitmap = BitmapFactory.decodeFile(fileUri.getPath(), options);
        //Uploading image to server
        new UploadFileToServer().execute();
        Log.e("DownSizing image", "Called");
        Drawable dr = new BitmapDrawable(bitmap);
        Log.e("DrawableN", String.valueOf(dr));
        relativeLayout.setBackgroundDrawable(dr);
    }
}

Inside the code ,I am downsizing the image to avoid OutOfMemory Exception.While setting the image in the background of Relative Layout ,image got stretched.Screenshot is given below:

XML code:

   <?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="@dimen/padding10">

    <RelativeLayout
        android:id="@+id/rel"
        android:layout_width="match_parent"
        android:layout_height="150dp"
        android:layout_marginBottom="@dimen/margin10"
        android:layout_marginLeft="@dimen/margin10"
        android:layout_marginRight="@dimen/margin10"
        android:layout_marginTop="@dimen/margin10">

        <ImageView
            android:id="@+id/arrowProfile"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentLeft="true"
            android:layout_alignParentTop="true"
            android:paddingLeft="@dimen/padding10"
            android:src="@drawable/back_signup" />

        <com.almabay.almachat.circularImageView.CircularImageView
            android:id="@+id/cam"
            android:layout_width="50dp"
            android:layout_height="50dp"
            android:layout_alignParentRight="true"
            android:paddingRight="@dimen/padding10"
            android:background="@drawable/camera1"/>

        <TextView
            android:id="@+id/userName"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_above="@+id/status"
            android:layout_alignParentBottom="true"
            android:layout_marginBottom="@dimen/margin20"
            android:paddingLeft="@dimen/padding10"
            android:text="User Name"
            android:textColor="#ffffff"
            android:textSize="20sp" />

        <TextView
            android:id="@+id/status"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:paddingLeft="@dimen/padding10"
            android:text="Status of user"
            android:textColor="#ffffff" />
    </RelativeLayout>

    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_below="@+id/rel"
        android:background="@color/divider_background">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"

            android:layout_marginRight="@dimen/margin10"
            android:layout_marginTop="@dimen/margin10"
            android:background="@color/divider_background"
            android:orientation="vertical">

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_marginBottom="@dimen/margin10"
                android:background="#ffffff"
                android:orientation="vertical"
                android:paddingLeft="@dimen/padding10">

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="First Name"
                    android:textStyle="bold" />

                <TextView
                    android:id="@+id/firstNameProfile"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Ashish" />

                <View
                    android:layout_width="match_parent"
                    android:layout_height="@dimen/divider_height"
                    android:layout_marginBottom="@dimen/margin10"
                    android:layout_marginTop="@dimen/margin10"
                    android:background="@color/divider_background" />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Last Name"
                    android:textStyle="bold" />

                <TextView
                    android:id="@+id/lastNameProfile"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Kumar" />

                <View
                    android:layout_width="match_parent"
                    android:layout_height="@dimen/divider_height"
                    android:layout_marginBottom="@dimen/margin10"
                    android:layout_marginTop="@dimen/margin10"
                    android:background="@color/divider_background" />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Birthday"
                    android:textStyle="bold" />

                <TextView
                    android:id="@+id/birthday"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="03 December" />

                <View
                    android:layout_width="match_parent"
                    android:layout_height="2dp"
                    android:layout_marginBottom="@dimen/margin10"
                    android:layout_marginTop="@dimen/margin10"
                    android:background="@color/divider_background" />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Gender"
                    android:textStyle="bold" />

                <TextView
                    android:id="@+id/gender"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:paddingBottom="@dimen/padding10"
                    android:text="Female" />

            </LinearLayout>

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_marginBottom="@dimen/margin10"
                android:background="@color/while_color"
                android:orientation="vertical"
                android:paddingLeft="@dimen/padding10">

                <RelativeLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content">

                    <TextView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_alignParentLeft="true"
                        android:paddingTop="@dimen/padding10"
                        android:text="Status"
                        android:textStyle="bold" />

                    <ImageView
                        android:id="@+id/imgEdit"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_alignParentRight="true" />
                </RelativeLayout>

                <View
                    android:layout_width="match_parent"
                    android:layout_height="@dimen/divider_height"
                    android:layout_marginBottom="@dimen/margin10"
                    android:layout_marginTop="@dimen/margin10"
                    android:background="@color/divider_background" />

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:paddingBottom="@dimen/padding10"
                    android:text="Displaying the status message here" />
            </LinearLayout>

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_marginBottom="@dimen/margin10"
                android:background="@color/while_color"
                android:orientation="vertical"
                android:paddingLeft="@dimen/padding10">

                <RelativeLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content">

                    <TextView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_alignParentLeft="true"
                        android:text="Email"
                        android:textStyle="bold" />

                    <ImageView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_alignParentRight="true" />
                </RelativeLayout>

                <View
                    android:layout_width="match_parent"
                    android:layout_height="@dimen/divider_height"
                    android:layout_marginBottom="@dimen/margin10"
                    android:layout_marginTop="@dimen/margin10"
                    android:background="@color/divider_background" />


                <TextView
                    android:id="@+id/emailProfile"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:paddingBottom="@dimen/padding10"
                    android:text="Email ID" />
            </LinearLayout>

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_marginBottom="@dimen/margin10"
                android:background="@color/while_color"
                android:orientation="vertical"
                android:paddingLeft="@dimen/padding10">

                <RelativeLayout
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:paddingTop="@dimen/padding10">

                    <TextView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_alignParentLeft="true"
                        android:text="Phone"
                        android:textStyle="bold" />

                    <ImageView
                        android:layout_width="30dp"
                        android:layout_height="30dp"
                        android:layout_alignParentRight="true" />
                </RelativeLayout>

                <View
                    android:layout_width="match_parent"
                    android:layout_height="@dimen/divider_height"
                    android:layout_marginBottom="@dimen/margin10"
                    android:background="@color/divider_background" />

                <TextView
                    android:id="@+id/mobile"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:paddingBottom="@dimen/padding10"
                    android:text="13464646466" />

            </LinearLayout>

        </LinearLayout>
    </ScrollView>


</RelativeLayout>

Please help to fix the issue.I am using width as match_parent and height as 150dp for the RelativeLayout.

Answer 1

try like this

<ImageView
     android:id="@+id/abc"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:contentDescription="image for user"
     android:scaleType="fitCenter"
     android:src="@drawable/ur_img" >
</ImageView>

Set the scale type to fitCenter, it will way may resolve your stretching of image, i also used this in my app to make image normal.

Answer 2

Your RelativeLayout has stable width and height,but your image size doesn't suit so it will stretch.

As your need,the relativelayout should be match_parent,but the height shouldn't be stable,it will be adjusted by your size of image.For example,assume your image size is w width and h height,then your relativelayout height should be adjusted to screenwidth/width*h.

First you can get the image width and height like this:

final Bitmap bitmap = BitmapFactory.decodeFile(fileUri.getPath(), options);
int w = bitmap.getWidth();
int h = bitmap.getHeight();

then get screenwidth by:

int screen_width = getResources().getDisplayMetrics().widthPixels;

then calculate scale value:

float scaleX = (float) screen_width / w;

then calculate layout height:

float height = scaleX * h;

At last set the height value we got as relativelayout's height:

android.view.ViewGroup.LayoutParams params = relativeLayout.getLayoutParams();
params.height = height;
relativeLayout.setLayoutParams(params);

then set the image as its background:

relativeLayout.setBackgroundDrawable(dr);

There is an example in mygithub.it has many similar implements like you.