ImageView with wrap_content height shows very skinny / cropped photo instead of full height

Question

I have a screen where the user can read an article (with large photo at the top.

It's general structure is:

LinearLayout -> ScrollView -> LinearLayout -> ImageViews,TextViews...etc

The ImageView I'm having problems with is the large image at the top (below the Article's title, but above it's text:

        <ImageView
            android:id="@+id/article_photo"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:background="@color/super_light_gray"
            android:scaleType="centerCrop"
            android:contentDescription="@string/articlePhoto"
            android:cropToPadding="true"
            android:layout_marginBottom="10dp"
            android:padding="1dp"/>

The problem is, the photos appear, but are cropped vertically A LOT so that even vertical-oriented photos show up very skinny and wide. I assumed that "wrap_content" should make it the full height of the photo... but I'm obviously wrong :)

How can I make the photo show up full width (already working), but also full height?

I'm using the UniversalImageLoader to load the images:

        if(lrgPhoto != null && !lrgPhoto.filepath.equals(""))
        {
            imageLoader.displayImage(
                "http://img.mysite.com/processes/resize_android.php?image=" + lrgPhoto.filepath + "&size=640&quality=90",
                imageView,
                imgDisplayOptions
                );
            imageView.setVisibility(View.VISIBLE); //show photo
        }
        else
        {
            imageView.setVisibility(View.GONE); //hide photo
            imageView.invalidate();
        }

Edit:

If I change 'scaleType' to 'fitXY', then the image shows correct dimensions without being cropped, but then it's not full-width. Is there a way I can have both full-width AND not-cropped strangely?

It appears the "crop" is because it's using the original height of the image for the height, but it's enlarging the image to fit full-width...

@raydowe - but I want the width to be the width of the screen. — Dave, Nov 09 '12 at 17:05
@raydowe - though - that does make it so they don't get cropped strangely - so - that's a good start...but then they're not full width. :/ — Dave, Nov 09 '12 at 17:21

score 30 · Accepted Answer · edited Nov 13 '13 at 23:34

30

Add this to the imageview xml:

android:adjustViewBounds="true"

edited Nov 13 '13 at 23:34

Sander Steffann

9,509
35
40

answered Nov 13 '13 at 23:15

George Mincila

529
5
17

7

Wow, this should be the real answer. I can't believe this isn't on by default. – Jade Nov 17 '13 at 19:14

score 1 · Answer 2 · answered Nov 09 '12 at 16:57

1

Change

android:scaleType="centerCrop"

to

android:scaleType="fitXY"

answered Nov 09 '12 at 16:57

baconcheese113

843
2
13
27

score 0 · Answer 3 · edited May 23 '17 at 12:18

0

I would have thought this was straightforward, but it looks like it might not be possible with xml layout alone:

ImageView - have height match width?

edited May 23 '17 at 12:18

Community

1
1

answered Nov 09 '12 at 17:23

raydowe

1,285
1
16
31

I agree that it may not be possible w /xml alone, but I also don't just want them to be fixed-width square images like the link provided. – Dave Nov 09 '12 at 17:36
Right, I was just linking to show the answers that all say it's not possible in XML. Since you're going to be writing java code, if you can get the original image dimensions it should be relatively straight forward to find the new, full size width and apply the same ratio to the height. – raydowe Nov 09 '12 at 18:08

ImageView with wrap_content height shows very skinny / cropped photo instead of full height

3 Answers3