fill server Image to NetworkImageview without Stretching it android

Question

What I have

I have ImageUri from server , & I am setting it to my NetworkImageview Volley library

What I want

I want the image to occupy full width & height of the NetworkImageview (wanted similar to facebook)

My problem

I see width of my NetworkImageview in white colour left

My code

xml layout

<RelativeLayout
        android:id="@+id/relative_profile_hotot"
        android:layout_width="match_parent"
        android:layout_height="250dp"
        android:layout_below="@+id/relative_profile_header"
        android:padding="0dp">

        <com.android.volley.toolbox.NetworkImageView
            android:id="@+id/img_post_photo"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:adjustViewBounds="true"
            android:scaleType="center"
            android:src="@drawable/image_palce" />

        <RelativeLayout
            android:id="@+id/relative_profile_footer"
            android:layout_width="match_parent"
            android:layout_height="50dp"
            android:layout_alignParentBottom="true"
            android:background="@color/profile_footer_bg">

            <TextView
                android:id="@+id/tv_profile_photo_location"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentLeft="true"
                android:drawableLeft="@drawable/ic_home_place"
                android:drawablePadding="5dp"
                android:paddingLeft="5dp"
                android:paddingTop="5dp"
                android:textColor="@color/grey_dark"
                android:textSize="@dimen/txt_small"
                tools:text="Paris France" />

            <TextView
                android:id="@+id/tv_profile_photo_description"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentLeft="true"
                android:layout_below="@+id/tv_profile_photo_location"
                android:layout_marginLeft="20dp"
                android:ems="40"
                android:padding="2dp"
                android:singleLine="true"
                android:textColor="@color/grey_light"
                android:textSize="@dimen/txt_very_small"
                tools:text="Effel Tower,...Read more" />
            />


            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@+id/img_foot"
                android:src="@drawable/ic_home_footstep_color"
                android:padding="5dp"
                android:layout_alignParentTop="true"
                android:layout_toEndOf="@+id/tv_profile_comment" />

            <TextView
                android:id="@+id/tv_profile_foot"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:paddingRight="10dp"
                android:paddingTop="0dp"
                android:textColor="@color/grey_light"
                android:textSize="@dimen/txt_small"
                tools:text="150"
                android:layout_alignBottom="@+id/tv_profile_photo_description"
                android:layout_alignEnd="@+id/tv_profile_photo_description" />
            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@+id/img_cheers"
                android:src="@drawable/ic_home_cheers_color"
                android:padding="5dp"
                android:layout_alignParentTop="true"
                android:layout_toStartOf="@+id/img_comment"
                android:layout_marginEnd="14dp" />


            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@+id/img_comment"
                android:src="@drawable/ic_home_coments"
                android:padding="5dp"
                android:layout_alignParentTop="true"
                android:layout_alignStart="@+id/tv_profile_comment" />

            <TextView
                android:id="@+id/tv_profile_comment"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:paddingRight="10dp"
                android:paddingTop="0dp"
                android:textColor="@color/grey_light"
                android:textSize="@dimen/txt_small"
                tools:text="264"
                android:layout_alignBottom="@+id/tv_profile_photo_description"
                android:layout_toStartOf="@+id/tv_profile_foot" />


            <TextView
                android:id="@+id/tv_profile_cheers"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:gravity="center"
                android:paddingRight="10dp"
                android:paddingTop="0dp"
                android:textColor="@color/grey_light"
                android:textSize="@dimen/txt_small"
                tools:text="3164"
                android:layout_alignBottom="@+id/tv_profile_photo_description"
                android:layout_toStartOf="@+id/img_comment" />

        </RelativeLayout>

    </RelativeLayout>

Adapter.java

myBucketListViewHolder.imgPostPic.setImageUrl(model.Uri, imageLoader);
        myBucketListViewHolder.imgPostPic.setDefaultImageResId(R.drawable.im_default_cover);

screen shot :(

score 2 · Answer 1 · answered Feb 26 '16 at 06:26

2

Replace

android:scaleType="center"

with

android:scaleType="centerCrop"

in your NetworkImageView

answered Feb 26 '16 at 06:26

Mohib Irshad

1,940
23
18

1

YOU have not posted your question clearly. Rephrase your problem, doesn't make much sense – Mohib Irshad Feb 26 '16 at 06:47
If I use centerCrop, my full image won't be visible. – karthik kolanji Feb 26 '16 at 07:00
You want a square image to fit inside a rectangle without modifying aspect ratio ? or is it ok if image stretch? (Which isn't similar to facebook) – Mohib Irshad Feb 26 '16 at 07:04
the image shouldn't stretch . I have http://stackoverflow.com/questions/6202000/imageview-one-dimension-to-fit-free-space-and-second-evaluate-to-keep-aspect-rat – karthik kolanji Feb 26 '16 at 07:06
I would have answered immediately if you mentioned this in question. Any ways this is the cleanest solution in my opinion: https://github.com/solusoftinnova/app_android_carnavalea/blob/master/src/es/solusoft/santosinocentes/widget/ResizableImageView.java just extend it from NetworkImageView instead of ImageView – Mohib Irshad Feb 26 '16 at 07:18
May I know what id does . it resizes my Imageview OR image ? – karthik kolanji Feb 26 '16 at 07:21
GOT " android.view.InflateException: Binary XML file line #86: Error inflating class utils.ResizableImageView " – karthik kolanji Feb 26 '16 at 07:26

score 0 · Answer 2 · answered Apr 20 '18 at 15:15

The same thing happened to me using NetworkImageView the problem is that it behaves a little different to ImageView and not enough with android: scaleType = "centerCrop" to fill the width when the density of the screen is greater than the width of the image you want insert. Try this code, at runtime change the width of the image adjusting it to the density of the screen.

In your layout.xml

<com.android.volley.toolbox.NetworkImageView
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:scaleType="fitCenter"
        android:background="@android:color/transparent"
        android:id="@+id/imagePagerView"/>

In your activity (i have in adapter)

    Display display = ((Activity) context).getWindowManager().getDefaultDisplay();
    DisplayMetrics outMetrics = new DisplayMetrics();
    display.getMetrics(outMetrics);
    float scWidth = outMetrics.widthPixels;
    float scHeigh = outMetrics.heightPixels;
    mImageView.getLayoutParams().width = (int) scWidth;
    mImageView.getLayoutParams().height = (int) scHeigh;

fill server Image to NetworkImageview without Stretching it android

2 Answers2