Android: ListView with expanding LinearLayouts as items causes duplicates

Question

I'm trying to write a test application that consists of a few fragments.
One fragment should contain a listView of all music artists from the device.
Each item of this list is a linearlayout starting with a TextView with the artist name and an empty linearlayout under it as follows:
The list is of this layout:

<ListView
    android:id="@+id/artistsLists"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_centerHorizontal="true"
    android:layout_centerVertical="true" >
</ListView>

Each item is of the following layout:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical" >

    <TextView
        android:id="@+id/artistName"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:textSize="24sp"
        android:text="" />

    <LinearLayout
        android:id="@+id/artistsAlbums"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical" >
    </LinearLayout>

</LinearLayout>

I'm populating the list using a SimpleCursorAdapter in the following way:

public class MusicTabFragment extends Fragment 
{

public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState)
{
    View view = inflater.inflate(R.layout.fragment_music_tab,container,false);

    Cursor artistsCursor = getActivity().getContentResolver().query(Audio.Artists.EXTERNAL_CONTENT_URI, new String[]{Audio.Artists.ARTIST,Audio.Artists._ID}, null, null,Audio.Artists.ARTIST);

    SimpleCursorAdapter adapter = new SimpleCursorAdapter(view.getContext(), R.layout.music_artist_list_item_layout, artistsCursor, new String[]{Audio.Artists.ARTIST},new int[]{R.id.artistName},0 );

    ListView lView = (ListView)view.findViewById(R.id.artistsLists);
    lView.setAdapter(adapter);
    lView.setOnItemClickListener(new OnItemClickListener()
        {
            public void onItemClick(AdapterView<?> parent, View view, int position, long id) 
            {
                ((LinearLayout)view.findViewById(R.id.artistsAlbums)).removeAllViews();


                Cursor albumsCursor = getActivity().getContentResolver().query(Audio.Artists.Albums.getContentUri("external", ((Cursor)parent.getItemAtPosition(position)).getLong(1)), new String[]{Audio.Albums.ALBUM, Audio.Albums._ID},null,null,null);


                LinearLayout artistLayout = (LinearLayout)view.findViewById(R.id.artistsAlbums);

                for(albumsCursor.moveToFirst();!albumsCursor.isAfterLast();albumsCursor.moveToNext())
                {
                    View albumView = LayoutInflater.from(view.getContext()).inflate(android.R.layout.simple_list_item_1,artistLayout,false);
                    ((TextView)albumView.findViewById(android.R.id.text1)).setText(albumsCursor.getString(0));
                    artistLayout.addView(albumView);
                }

                Log.d("POPULATE","populated again!");
                albumsCursor.close();
            }
        });



    return view;
}
}

This works just fine. when i click an artist name, the linearlayout populates with all of this artist album names. the problem is, that once a linearLayout scrolls out of view, it shows again from the other edge of the view (PacMan Style) as if another list item's linearLayout was populated. It happens every time the expanded layout goes out of sight. the funny part is that some times when scrolling back up, the linearLayout shows under a different artist name.
example

I'll be glad to hear how should I implement this fragment. But i will also like to know why this behavior is caused.

Thanks,
Maor.

Answer 1

I have found the solution here at stackoverflow.com It appears that the view shouldn't hold any data, since it is being used for different data when i scroll back and fourth.

I think holding an external data structure to save each virtual view state is not nice programming. is there a way to keep this data anyway? (for this i will be looking now)