Why do items disappear when I scroll the listView?

Question

My application use a ListView which display different items in the cell. it must have photo and name, but it happens to have description and icons.

The problem is: when I scroll the ListView and come back to the top, the description and icons have disappeared, there are only image and name. I have the impression the description and icons have been removed to have the same size for each row.

I use a custom adapter (BaseAdapter) for my ListView:

public class MyAdapterPark extends BaseAdapter {

    private ArrayList<DataPark> datapark;
    private LayoutInflater myInflater;

    public MyAdapterPark (Context context, ArrayList<DataPark> _datapark)
    {
        this.myInflater = LayoutInflater.from(context);
        this.datapark = _datapark;

    }


    @Override
    public int getCount() {
        return this.datapark.size();
    }

    @Override
    public Object getItem(int arg0) {
        return this.datapark.get(arg0);

    }

    @Override
    public long getItemId(int position) {
        return position;
    }


    public static class ViewHolder {
        ImageView image;
        TextView text01;
        ImageView facebook;
        ImageView twitter;
        ImageView linkedin;
        ImageView blog;
        ImageView music;
        TextView bio;
    }


    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        ViewHolder holder;

        if(convertView == null)
        {
            convertView = myInflater.inflate(R.layout.affichageitem, null);
            holder = new ViewHolder();
            holder.image = (ImageView)convertView.findViewById(R.id.img);
            holder.text01 = (TextView)convertView.findViewById(R.id.user);
            holder.facebook = (ImageView)convertView.findViewById(R.id.facebook);
            holder.twitter = (ImageView)convertView.findViewById(R.id.twitter);
            holder.linkedin = (ImageView)convertView.findViewById(R.id.linkedin);
            holder.blog = (ImageView)convertView.findViewById(R.id.blog);
            holder.music = (ImageView)convertView.findViewById(R.id.music);
            holder.bio = (TextView)convertView.findViewById(R.id.bio);



            convertView.setTag(holder);
        }else{
            holder = (ViewHolder) convertView.getTag();
        }

        holder.text01.setText(datapark.get(position).nickname);

        if (!(datapark.get(position).pic.equals(""))){
        try {
            //byte[] decodedString;
            //decodedString = Base64.decode(datapark.get(position).pic);
            //Bitmap bitmap = BitmapFactory.decodeByteArray(decodedString, 0, decodedString.length);
            //holder.image.setImageBitmap(bitmap);
            holder.image.setImageBitmap(telechargerImage(datapark.get(position).pic));



        } catch (Exception e) {
            // TODO Auto-generated catch block
            e.printStackTrace();
        }
        }else{
            holder.image.setImageResource(R.drawable.profilbase);

        }

        if (!(datapark.get(position).facebook.equals(""))){

            holder.facebook.setImageResource(R.drawable.fb);

            }else{
                ((ImageView)convertView.findViewById(R.id.facebook)).setVisibility(View.GONE);
            }

        if (!(datapark.get(position).twitter.equals(""))){

            holder.twitter.setImageResource(R.drawable.twitter);

            }else{
                ((ImageView)convertView.findViewById(R.id.twitter)).setVisibility(View.GONE);
            }

        if (!(datapark.get(position).linkedin.equals(""))){

            holder.linkedin.setImageResource(R.drawable.linkedin);

            }else{
                ((ImageView)convertView.findViewById(R.id.linkedin)).setVisibility(View.GONE);
            }

        if (! (datapark.get(position).blog.equals(""))){

            holder.blog.setImageResource(R.drawable.blog);

            }else{
                ((ImageView)convertView.findViewById(R.id.blog)).setVisibility(View.GONE);
            }


        if (!(datapark.get(position).music.equals(""))){

            holder.music.setImageResource(R.drawable.music);

            }else{
                ((ImageView)convertView.findViewById(R.id.music)).setVisibility(View.GONE);
            }

        if (!(datapark.get(position).bio.equals(""))){          

            holder.bio.setText(datapark.get(position).bio);

            }else{
                ((TextView)convertView.findViewById(R.id.bio)).setVisibility(View.GONE);
            }




        return convertView;
    }

    public static Bitmap telechargerImage(String url) {
        Bitmap bm = null;
        try {
            URL aURL = new URL(url);
            URLConnection conn = aURL.openConnection();
            conn.connect();
            InputStream is = conn.getInputStream();
            BufferedInputStream bis = new BufferedInputStream(is);
            bm = BitmapFactory.decodeStream(bis);
            bis.close();
            is.close();
        } catch (IOException e) {
            Log.e("Erreur","Erreur lors de la récupération de l'image : " + e.getMessage().toString());
        }
        return bm;
    }

}

And the XML of my adapter:

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

    <ImageView
        android:id="@+id/img"
        android:layout_width="70px"
        android:layout_height="70px"
        android:background="@drawable/carre"
        android:scaleType="fitXY"
        android:padding="5sp"
        android:layout_marginLeft="0sp"
        android:src="@drawable/profilbase"
        android:layout_margin="5sp"
        />

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:orientation="vertical"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:paddingLeft="0sp"
        android:layout_weight="1"
        >

        <TextView android:id="@+id/user"
             android:layout_width="fill_parent"
             android:layout_height="wrap_content"
             android:textSize="14px"
             android:textColor="#000000"
             android:textStyle="bold"
             android:text=""    
             android:layout_marginTop="5sp"  
             />

             <TextView android:id="@+id/bio"
             android:layout_width="fill_parent"
             android:layout_height="wrap_content"
             android:textSize="14px"
             android:textColor="#000000"
             android:layout_marginTop="1sp"  
             android:layout_marginRight="2sp"   
             android:text=""      
             />

        <LinearLayout 
        android:orientation="horizontal"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="4sp"
        android:layout_marginBottom="4sp"
        >
        <ImageView
        android:id="@+id/facebook"
        android:layout_width="17px"
        android:layout_height="17px"
        android:scaleType="fitXY"
        android:layout_gravity="center"
        />
         <ImageView
        android:id="@+id/twitter"
        android:layout_width="17px"
        android:layout_height="17px"
        android:scaleType="fitXY"
        android:layout_gravity="center"
        android:layout_marginLeft="5sp"
        />
         <ImageView
        android:id="@+id/linkedin"
        android:layout_width="17px"
        android:layout_height="17px"
        android:scaleType="fitXY"
        android:layout_gravity="center"
        android:layout_marginLeft="5sp"
        />
         <ImageView
        android:id="@+id/blog"
        android:layout_width="17px"
        android:layout_height="17px"
        android:scaleType="fitXY"
        android:layout_gravity="center"
        android:layout_marginLeft="5sp"
        />
         <ImageView
        android:id="@+id/music"
        android:layout_width="17px"
        android:layout_height="17px"
        android:scaleType="fitXY"
        android:layout_gravity="center"
        android:layout_marginLeft="5sp"
        />
        </LinearLayout>

    </LinearLayout>

</LinearLayout>

Thanks!

Solution

It's because you're hiding some of your views sometimes, and you never show them again. Example:

        if (!(datapark.get(position).bio.equals(""))){          
          holder.bio.setText(datapark.get(position).bio);
        }else{
          ((TextView)convertView.findViewById(R.id.bio)).setVisibility(View.GONE);
        }

instead try:

        if (!(datapark.get(position).bio.equals(""))){ 
          holder.bio.setVisibility(View.VISIBLE);         
          holder.bio.setText(datapark.get(position).bio);
        }else{
          holder.bio.setVisibility(View.GONE);
        }

Remember that views are recycled, so, unless you show the views the next time you return one, they will never be visible again. Also, remember that holder.bio is the same thing that is returned by the findViewById, so you can do holder.bio.setVisibility(View.GONE) in the else block.

Comments

[Jay Mayu]

GOd you have saved me from 1 week old mess :D