ImageView loading high resolution image as very poor quality

Question

I am using a ListFragment to display a ListView of Lazy Loaded ImageView objects using the Android Universal Image Loader. The correct data is coming from my datasource and I have the URL to my fairly high resolution images (about 1000px wide, 150kb). I am using these to completely fill each row that is 110dp high.

The problem I am having is the images are loading at a very poor resolution:

The problem isn't the source image as it is high enough quality:

http://www.puc.edu/__data/assets/image/0006/127581/IMG_5155.jpg

I am centering the image and then cropping it:

<?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:minHeight="110dp">

    <TextView
        android:id="@+id/galleryTitle"
        android:layout_width="wrap_content"
        android:layout_height="80dp"
        android:layout_marginLeft="95dp"
        android:layout_marginRight="5dp"
        android:gravity="center_vertical"
        android:hint="16dp"
        android:lineSpacingExtra="0dp"
        android:lines="3"
        android:text="TextView"
        android:textSize="16sp"
        android:textStyle="bold" />

    <ImageView
        android:id="@+id/galleryImageView"
        android:layout_width="fill_parent"
        android:layout_height="110dp"
        android:scaleType="centerCrop"
        android:src="@drawable/default_background" />

</RelativeLayout>

Displaying the image in the row:

public View getView(int position, View convertView, ViewGroup parent) {

        View itemView;
        TextView title;

        // Get the news item object
        PUCObjects.PUCPhotoGalleryItem item = items.get(position);

        // Inflater Service
        inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);

        itemView = inflater.inflate(R.layout.photos_gallery_row, parent, false);
        title = (TextView) itemView.findViewById(R.id.galleryTitle);
        ImageView imageView = (ImageView) itemView.findViewById(R.id.galleryImageView);

        // Set the Image
        imageLoader.DisplayImage(item.imageUrlExtraLarge, imageView);

        // Set the text
        title.setText(item.title);

        return itemView;
    }

Any ideas why it is displaying such poor resolution images?

Answer 1

The pictures appear to be down scaled. Looking at that library the default functionality is power of 2 image sampling. I would reckon this is source of your issue.

• ImageScaleType
• DisplayOptions

For instance:

DisplayImageOptions opts = new DisplayImageOptions.Builder().imageScaleType(ImageScaleType.NONE).build();

imageLoader.DisplayImage(item.imageUrlExtraLarge, imageView, opts);