Question

I am not clear whether this is an issue with different versions of Android, or different screen sizes, but I am getting some unpredictable behavior.

I am testing the UI of the dropdown of a MultiAutoCompleteTextView on a Nexus S which is on Android v4.1.2 and I am testing on a Nexus 4 which is on Android v4.2.1.

When I begin to enter text into the MultiAutoCompleteTextView it returns some results. I have created a custom view which contains an ImageView to the left of a TextView. When the a row is first displayed, the ImageView will have a certain height and width (image on left).

However once you scroll through the list of results and back up to that original row one, of two things happens. Either the ImageView stays the same dimensions, or the dimensions of the ImageView will change (image on right).

This specific behavior, and the screenshots provided, are what is happening on the Nexus 4, but I cannot reproduce this issue on the Nexus S.

I am loading Bitmaps into ImageViews just like it is done in the developer training Loading Large Bitmaps Efficiently.

Here is the layout resource for the contact row:

contact_entry2.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="fill_parent"
    android:orientation="horizontal" >

    <ImageView
        android:id="@+id/contactPic"
        android:layout_width="wrap_content"
        vandroid:layout_height="fill_parent"
        android:contentDescription="@string/contact_pic_desc"
        android:focusable="false"
        android:focusableInTouchMode="false"
        android:src="@drawable/ic_contact_picture" />

    <CheckedTextView
        android:id="@+id/contactInfo"
        style="@style/CheckedTextViewStyle" >
    </CheckedTextView>

</LinearLayout>

styles.xml

<?xml version="1.0" encoding="utf-8"?>
<resources xmlns:android="http://schemas.android.com/apk/res/android">

    <style name="CheckedTextViewStyle">
        <item name="android:layout_width">fill_parent</item>
        <item name="android:layout_height">match_parent</item>
        <item name="android:textColor">@color/black</item>
        <item name="android:background">@color/white</item>
        <item name="android:gravity">center_vertical</item>
        <item name="android:paddingLeft">10dp</item>
    </style>

</resources>

And RecipientsCursorAdapter is a grandchild class of the SimpleCursorAdapter (BaseContactsAdapter extends SimpleCursorAdapter):

RecipientsCursorAdapter

package com.sendit.adapters;

import android.app.Activity;
import android.content.Context;
import android.database.Cursor;
import android.provider.ContactsContract;
import android.view.View;
import android.view.ViewGroup;
import android.widget.CheckedTextView;
import android.widget.ImageView;

import com.sendit.Contact;
import com.sendit.R;
import com.sendit.util.ContactsUtils;
import com.sendit.util.ImageFetcher;

public class RecipientsCursorAdapter extends BaseContactsAdapter {

    private final String DEBUG_TAG = getClass().getSimpleName().toString();
    private Cursor mCursor;
    private ImageFetcher mImageFetcher;

    public RecipientsCursorAdapter(Context context, int layout, Cursor c,
        String[] from, int[] to, Activity a, int flags, ImageFetcher imageFetcher) {
            super(context, layout, c, from, to, a, flags);
            mImageFetcher = imageFetcher;
    }

    public View getView(final int position, View convertView, ViewGroup parent) {
        ViewHolder holder;
        if (convertView == null) {
            convertView = mInflater.inflate(R.layout.contact_entry2, null);
            // Creates a ViewHolder and store references to the children views
            // we want to bind data to.
            holder = new ViewHolder();
            holder.contactInfo = (CheckedTextView) convertView
                .findViewById(R.id.contactInfo);
            holder.contactPic = (ImageView) convertView
                .findViewById(R.id.contactPic);

            convertView.setTag(holder);

        } else {
            // Get the ViewHolder back to get fast access to the TextView
            // and the ImageView.
            holder = (ViewHolder) convertView.getTag();
        }

        holder.position = position;

        mCursor = getCursor();

        mCursor.moveToPosition(position);

        int contactId = mCursor.getInt(mCursor
            .getColumnIndex(ContactsContract.Contacts._ID));

        if (mContactCache.get(contactId) == null) {
            String name = mCursor.getString(mCursor.getColumnIndex(ContactsContract.Contacts.DISPLAY_NAME));
            String number = ContactsUtils.getPhoneNumber(mContext, contactId);
            mContactCache.put(contactId, new Contact(name, number));
        }

        Contact c = mContactCache.get(contactId);

        CharSequence contactInfo = getContactInfoSpan(c.getName(), c.getPhoneNumber());

        holder.contactInfo.setText(contactInfo);

        mImageFetcher.loadImage(contactId, holder.contactPic);

        return convertView;
    }

}

Can anyone point me in the right direction as far as what to look into? Is this a screen resolution issue, or does the latest version of Android handle this situation differently than previous versions?

Answer 1

Thanks @Andrew for the suggestions. Here’s how I fixed the image resizing issue. I called the ImageView setScaleType() and setLayoutParams() methods when instantiating the ViewHolder references.

public class RecipientsCursorAdapter extends BaseContactsAdapter {

    private final String DEBUG_TAG = getClass().getSimpleName().toString();
    private Cursor mCursor;
    private ImageFetcher mImageFetcher;
    private final Drawable mDefaultContactPic;
    private LinearLayout.LayoutParams mImageViewLayoutParams;

    public RecipientsCursorAdapter(Context context, int layout, Cursor c,
        String[] from, int[] to, Activity a, int flags, ImageFetcher imageFetcher) {

        super(context, layout, c, from, to, a, flags);
        mImageFetcher = imageFetcher;
        mDefaultContactPic = context.getResources().getDrawable(R.drawable.ic_contact_picture);
        mImageViewLayoutParams = new LinearLayout.LayoutParams(mDefaultContactPic.getIntrinsicWidth(), mDefaultContactPic.getIntrinsicHeight());
    }

    public View getView(final int position, View convertView, ViewGroup parent) {
        ViewHolder holder;
        if (convertView == null) {
            convertView = mInflater.inflate(R.layout.contact_entry2, null);
            // Creates a ViewHolder and store references to the children views
            // we want to bind data to.
            holder = new ViewHolder();
            holder.contactInfo = (CheckedTextView) convertView.findViewById(R.id.contactInfo);
            holder.contactPic = (ImageView) convertView.findViewById(R.id.contactPic);

            holder.contactPic.setScaleType(ImageView.ScaleType.CENTER_CROP);
            holder.contactPic.setLayoutParams(mImageViewLayoutParams);

            convertView.setTag(holder);

        } else {
            // Get the ViewHolder back to get fast access to the TextView
            // and the ImageView.
            holder = (ViewHolder) convertView.getTag();
        }

        holder.position = position;

        mCursor = getCursor();

        mCursor.moveToPosition(position);

        int contactId = mCursor.getInt(mCursor.getColumnIndex(ContactsContract.Contacts._ID));

        /*...*/

        mImageFetcher.loadImage(contactId, holder.contactPic);

        return convertView;
    }

}