Question

I am developing a soundboard application which extends ListActivity. I have a play button image and the text next to it. Now when the user clicks on a textview, I change the play image to pause image using the following code.

@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
  try
    {
    setListAdapter(new ArrayAdapter<String>(this, R.layout.list_item, Sounds));
     final ListView lv = getListView();
     lv.setTextFilterEnabled(true);
     lv.setCacheColorHint(Color.WHITE);
     lv.setSoundEffectsEnabled(false);
     lv.setFastScrollEnabled(true);
     lv.setFocusableInTouchMode(true);
     lv.setBackgroundColor(Color.WHITE);
  lv.setOnItemClickListener(new OnItemClickListener() {
    public void onItemClick(AdapterView<?> parent, View view,
           int position, long id) {
          TextView tv1 = (TextView) view;
           int u = (int)meMap.get(position+1); // meMap--> HashMap which contains corresponding resids
           playSample(u,tv1);

       }
     });    
}
private void playSample(int resid,TextView ttvv)
{
final Resources res = getBaseContext().getResources();
    final Drawable myImage = res.getDrawable(R.drawable.pause);
  //  myImage.
    final Drawable myImage1 = res.getDrawable(R.drawable.play);

    MediaPlayer.OnCompletionListener listener = new MediaPlayer.OnCompletionListener(){
  public void onCompletion(MediaPlayer mp) {
 // tv --> (TextView) view; From onItemClick(AdapterView<?> parent, View view,int position, long id)
     tv.setCompoundDrawablesWithIntrinsicBounds(myImage1, null, null, null);

      }
    };

This code works, but with a small error which I noted. Suppose if I select third row in my list, the play image changes to pause image and if I scroll my list while it is playing, I can see that the third row of the second scroll page, the third row of the third scroll page and so on gets affected i.e they also change to pause image. Why is this happening? Am I doing something wrong? I hope you understand my question. Your help is appreciated. Thanks.

Answer 1

I have a similar UI (play/pause in a list view). I avoided the issues you are talking about by using ToggleButtons in my list view and setting the background to an xml drawable like this:
Create a file drawable/play_pause_toggle.xml:

<?xml version="1.0" encoding="utf-8"?>
 <selector xmlns:android="http://schemas.android.com/apk/res/android">
     <item android:state_enabled="false"
           android:drawable="@drawable/pause"/>
     <item android:state_checked="true" 
           android:drawable="@drawable/pause" />
     <item android:state_focused="true"
           android:drawable="@drawable/pause" />
     <item android:drawable="@drawable/play" />
 </selector>

Then set your ToggleButton background to @drawable/play_pause_toggle. It will change automatically each time the ToggleButtons isChecked state changes