imageview in gridview wrong size, after replacing loading placeholder

Question

I'm using gridview, to show a 2 column list of images.

I am using universal image loader to get the images from database, which works great, but as soon as the image is loaded, and the "loading image" placeholder is replaced, the size gets shrinked down to the images actual size, and does not fill the cell properly.

The placeholder images are scaled up properly, to fill available width, and wrap the height. All images are the same size, and need to be scaled up, or down, depending on the screen size.

Here is the list item layout(updated, I have a textview there too, which I think is irrelevant, but who knows..):

<?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" >

    <ImageView
        android:id="@+id/grid_gallery_item_imageView1"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_centerInParent="true"
        android:adjustViewBounds="true"
        android:scaleType="fitCenter"
        android:src="@drawable/loading_image" />

    <TextView
        android:id="@+id/grid_gallery_item_textView1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignBottom="@+id/grid_gallery_item_imageView1"
        android:background="#50000000"
        android:ellipsize="end"
        android:gravity="center_vertical"
        android:maxLines="3"
        android:padding="8dp"
        android:text="Bacon ipsum."
        android:textColor="#ffffff"
        android:textSize="20sp" />

</RelativeLayout>

Here is my gridview:

 <GridView
        android:id="@+id/grid_gallery_layout_gridView1"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:numColumns="2"
        android:stretchMode="columnWidth">

In my gridview adapter, I just use this to load the images:

imageLoader.displayImage("db://" + item.imageId, holder.imageView, options);

the options:

options = new DisplayImageOptions.Builder().bitmapConfig(Bitmap.Config.RGB_565).showStubImage(R.drawable.loading_image)
        .displayer(new FadeInBitmapDisplayer(Constants.GRIDVIEW_IMAGE_FADEIN_TIME)).build();

Here is a screenshot, of the problem:

enter image description here

The loaded images should be the same size, as the placeholder images.

Any ideas, why loading the images might screw up the sizing of the imageviews?

Edit: down scaling actually works fine, it's up scaling that is screwed up. For example, on a smaller screen, the images are correct size.

score 2 · Accepted Answer · answered Apr 30 '13 at 12:02

2

It seems that I have solved the problem. Apperantly ImageView does not scale up images properly, if it is inside a gridview.

This code works for me perfectly: link

answered Apr 30 '13 at 12:02

Tamas

1,765
1
16
26

score 1 · Answer 2 · answered Apr 30 '13 at 08:00

1

I bet you need

android:scaleType="centerCrop"

And no need to put the single ImageView in RelativeLayout

<ImageView
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/grid_gallery_item_imageView1"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_centerInParent="true"
    android:adjustViewBounds="true"
    android:scaleType="centerCrop"
    android:src="@drawable/loading_image" />

^ and you don't need the id attribute if you rewrite the adapter correctly, eg

if (convertView == null) {
    convertView = inflater.inflate(id, null);
}
imageView = (ImageView) convertView;

answered Apr 30 '13 at 08:00

Yaroslav Mytkalyk

16,950
10
72
99

I don't want to crop the images. There is also a textview next to the imageview, which is irrelevant to the problem, so I did not include it.. – Tamas Apr 30 '13 at 08:01
Ah, got it. Make sure the height if the "loading" image is as large in height as you want your target Image to be. – Yaroslav Mytkalyk Apr 30 '13 at 08:03
all images are the same size(loading placeholder, real images). – Tamas Apr 30 '13 at 08:05
Try adding android:verticalSpacing="0dp" and android:horizontalSpacing="0dp" to your GridView. – Yaroslav Mytkalyk Apr 30 '13 at 08:06
I've edited my question, and added the textview in the list item example, maybe it does matter.. – Tamas Apr 30 '13 at 08:11
I also noticed, that the layoutparam of the imageview has -1 width and height. Might that be a problem? Setting layout params by code, does not seem to affect it. – Tamas Apr 30 '13 at 09:34

imageview in gridview wrong size, after replacing loading placeholder

2 Answers2