Can't display image correctly using custom item layout in ListView
I am using ListView to display my custom item layout which can contain some text items and ImageView.
This is the item layout I made (post_item.xml):
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="60dip"
android:padding="5dip"
>
<TextView android:id="@+id/listItem_title"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_weight="1"
/>
<FrameLayout android:id="@+id/listItem_frameContent"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="@id/userStream_listItem_title"
android:layout_weight="1"
>
</FrameLayout>
</RelativeLayout>
I don't put the ImageView natively in the xml layout, but I will insert it when I need the FrameLayout programmatically (I also add other views to it when needed). So there will be some items that have an ImageView and which don't.
I am getting an image to populate an ImageView from the internet (via a url), decode it as a Bitmap and store it as a Bitmap variable in a class that is a custom item layout (PostItem class).
When the activity is displayed for the first time, it looks fine, but when I scrolled through the items, there was a problem, items that shouldn't be showing an image are showing an image from another item that should, even though they are not I don't have an ImageView (because I have it did not insert).
I am using SDK 1.6 and an emulator. Haven't tried it on real device because I don't have it.
Here is my code for the adapter:
private class PostItemAdapter extends ArrayAdapter<PostItem> {
private List<PostItem> mPostItems;
public PostItemAdapter(Context context, int textViewResourceId, List<PostItem> postItems) {
super(context, textViewResourceId, postItems);
mPostItems = postItems;
}
@Override
public View getView(int position, View convertView, ViewGroup parent) {
View view = convertView;
if (view == null) {
LayoutInflater layoutInflater = (LayoutInflater) getSystemService(LAYOUT_INFLATER_SERVICE);
view = layoutInflater.inflate(R.layout.post_item, null);
}
PostItem postItem = mPostItems.get(position);
if (postItem != null) {
final FrameLayout contentFrame = (FrameLayout) view.findViewById(R.id.listItem_frameContent);
final TextView titleTextView = (TextView) view.findViewById(R.id.listItem_title);
if (titleTextView != null) {
titleTextView.setText(postItem.getTitle());
}
if (contentFrame != null) {
if (postItem.hasImagePreview()) {
final ImageView previewImageView = new ImageView(getApplicationContext());
previewImageView.setId(LIST_ITEM_IMAGEVIEW_ID);
previewImageView.setAdjustViewBounds(true);
previewImageView.setMaxHeight(75);
previewImageView.setMaxWidth(75);
previewImageView.setImageBitmap(postItem.getImagePreview());
final RelativeLayout.LayoutParams layoutParams =
new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT,
RelativeLayout.LayoutParams.WRAP_CONTENT);
layoutParams.addRule(RelativeLayout.ALIGN_PARENT_TOP);
layoutParams.addRule(RelativeLayout.ALIGN_PARENT_LEFT);
contentFrame.addView(previewImageView, layoutParams);
}
if (postItem.hasContent()) {
final TextView contentTextView = new TextView(getApplicationContext());
contentTextView.setText(postItem.getContent());
final RelativeLayout.LayoutParams layoutParams =
new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.FILL_PARENT,
RelativeLayout.LayoutParams.WRAP_CONTENT);
layoutParams.addRule(RelativeLayout.BELOW, LIST_ITEM_IMAGEVIEW_ID);
layoutParams.addRule(RelativeLayout.ALIGN_LEFT, LIST_ITEM_IMAGEVIEW_ID);
layoutParams.alignWithParent = true;
contentFrame.addView(contentTextView, layoutParams);
}
}
}
return view;
}
}
And this is the code to prepare the items:
/* inside a method to prepare the items */
mPostItems = new ArrayList<PostItem>();
for (int i=0; i<total); i++) {
/* operation to generate titleToDisplay and contentToDisplay */
/* contentToDisplay might be null */
mPostItems.add(new PostItem(
titleToDisplay,
contentToDisplay,
generateImagePreview()));
}
/* another method */
private Bitmap generateImagePreview(ActivityObject object) {
Bitmap imagePreview = null;
if (/*some condition*/) {
try {
InputStream inStream = (InputStream) (new URL("http://a1.typepad.com/6a010535617444970b0133ecc20b29970b-120si")).getContent();
imagePreview = Drawable.createFromStream(inStream, "linkHref");
}
catch (MalformedURLException ex) {
Log.e("INSIDE generateImagePreview()", ex.getMessage());
}
catch (IOException ex) {
Log.e("INSIDE generateImagePreview()", ex.getMessage());
}
catch (Exception ex) {
Log.e("INSIDE generateImagePreview()", ex.getMessage());
}
}
return imagePreview;
}
Is this a bug in the emulator or is there some bug in my code (maybe a memory issue for Bitmap)? Please help me, I am really stuck with this. Any help or advice would be much appreciated. Thanks in advance:)
a source to share
Cells are reused by lists and it looks like you are only changing the image of your content if there is an image associated with the element. This means that when there is no image and you reuse the cell, it will just show whatever was passed in the converted view. If there is no image, you must remove all child representations in the content frame.
However, you are more likely to get better answers in the future by being more concise. Injecting a bunch of code and taking a while to get to this problem makes it harder to read and therefore fewer people.
a source to share