The checked Togglebuttons in my ListView aren't checked anymore when i scroll

Question

I dynamicly add Togglebuttons from an Array into my RadioGroup. The adding works fine and every different List items works fine but when I scroll the checked status is changed back. How can I fix this?

Here is my ListAdapter class:

public class BezoekverslagDetailsListAdapter extends ArrayAdapter<Vraag>{
public Context context;
public List<Vraag> vragen;
ViewHolder holder;;

public BezoekverslagDetailsListAdapter(Activity context, List<Vraag> vragen){
    super(context, R.layout.vraag_item, vragen);
    this.context = context;
    this.vragen = vragen;

}

@Override
public View getView(int position, View convertView, ViewGroup parent) {     
    convertView = null;
    if(convertView == null) {
        LayoutInflater inflater = (LayoutInflater)context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        convertView = inflater.inflate(R.layout.vraag_item, null, false);

        holder = new ViewHolder();
        holder.vraag = (TextView)convertView.findViewById(R.id.tv_vraag);
        holder.group = (RadioGroup)convertView.findViewById(R.id.toggleGroup);
        holder.position = position;
        holder.toggle = new ToggleButton(context);

        convertView.setTag(holder); 
    }
    else{
        holder = (ViewHolder) convertView.getTag(); 
    }       
    final Vraag vraag = vragen.get(position);
    holder.vraag.setText(vraag.getVraag());

    holder.group.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener(){
        public void onCheckedChanged(RadioGroup group, int checkedId){
            for (int j = 0; j < group.getChildCount(); j++) {
                final ToggleButton view = (ToggleButton) group.getChildAt(j);
                view.setChecked(view.getId() == checkedId);    

                vraag.getAntwoorden().get(view.getId()).setSelected(view.getId() == checkedId);

            }
        }
    });

    for(final Antwoord a : vraag.getAntwoorden()){
        holder.toggle = new ToggleButton(context);
        holder.toggle.setText(a.getAntwoord());
        holder.toggle.setTextOn(a.getAntwoord());
        holder.toggle.setTextOff(a.getAntwoord());
        holder.toggle.setId(a.getId());
        holder.toggle.setChecked(a.getSelected());

        if(a.getVisible() == false){
            holder.toggle.setVisibility(ToggleButton.INVISIBLE);
        }       

        holder.toggle.setOnClickListener(new OnClickListener()
        {
            @Override
            public void onClick(View view)
            {
                // your click actions go here
                ((RadioGroup)view.getParent()).check(view.getId());
            }
        });

        holder.group.addView(holder.toggle);        
    }   

    return convertView;
}

static class ViewHolder {
      TextView vraag;
      RadioGroup group;
      ToggleButton toggle;
      int position;
    }

}

Answer 1

I finally fixed it all!

This is my final code:

public class BezoekverslagDetailsListAdapter extends ArrayAdapter<Vraag>{
public Context context;
public List<Vraag> vragen;
ViewHolder holder;
int i;
public BezoekverslagDetailsListAdapter(Activity context, List<Vraag> vragen){
    super(context, R.layout.vraag_item, vragen);
    this.context = context;
    this.vragen = vragen;
}

@Override
public View getView(int position, View convertView, ViewGroup parent) {     
    View view = null;
    convertView = null;
    final Vraag vraag = vragen.get(position);

    if(convertView == null) {
        LayoutInflater inflater = (LayoutInflater)context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        view = inflater.inflate(R.layout.vraag_item, null, false);

        holder = new ViewHolder();
        holder.vraag = (TextView)view.findViewById(R.id.tv_vraag);
        holder.group = (RadioGroup)view.findViewById(R.id.toggleGroup);
        holder.position = position;
        holder.toggle = new ToggleButton(context);

        for(final Antwoord a : vraag.getAntwoorden()){
            holder.toggle = new ToggleButton(context);
            holder.toggle.setText(a.getAntwoord());
            holder.toggle.setTextOn(a.getAntwoord());
            holder.toggle.setTextOff(a.getAntwoord());
            holder.toggle.setId(i);
            holder.toggle.setChecked(a.getSelected());

            if(a.getVisible() == false){
                holder.toggle.setVisibility(ToggleButton.INVISIBLE);
            }       

            holder.toggle.setOnClickListener(new OnClickListener()
            {
                @Override
                public void onClick(View view)
                {
                    // your click actions go here
                    ((RadioGroup)view.getParent()).check(view.getId());

                    if(a.getSelected()==true){
                        a.setSelected(false);
                    }
                    else if(a.getSelected()==false){
                        for(Antwoord b: vraag.getAntwoorden()){
                            if(b.getSelected()==true){
                                b.setSelected(false);
                            }
                        }
                        a.setSelected(true);
                        vraag.setAntwoord(a.getAntwoord());
                    }
                }
            });
            i++;
            holder.group.addView(holder.toggle);                
        }

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

    viewholder.vraag.setText(vraag.getVraag());

    holder.group.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener(){
        public void onCheckedChanged(RadioGroup group, int checkedId){
            for (int j = 0; j < group.getChildCount(); j++) {
                final ToggleButton view = (ToggleButton) group.getChildAt(j);
                view.setChecked(view.getId() == checkedId);
                //vragen.get(holder.position).getAntwoorden().get(view.getId()).setSelected(view.getId() == checkedId);
            }
        }
    });

    view.setTag(viewholder);    

    return view;
}

static class ViewHolder {
      TextView vraag;
      RadioGroup group;
      ToggleButton toggle;
      int position;
    }

}

Answer 2

Instead of this :

final Vraag vraag = vragen.get(position);
holder.vraag.setText(vraag.getVraag());

try this :

final Vraag vraag = vragen.get(holder.position);
holder.vraag.setText(vraag.getVraag());

While scrolling list View it has a weird behaviour of calculating the position based on the Items which are currently there in the View . I had faced this weird View . I dynamically set the tag of that particular view to the actual position of the view and then did a View.get(tag).

Answer 3

I found an other way, now it holds the checked Togglebuttons but the problem now is that the buttons get changed from position.

Here is the code:

public class BezoekverslagDetailsListAdapter extends ArrayAdapter<Vraag>{
public Context context;
public List<Vraag> vragen;
ViewHolder holder;
public BezoekverslagDetailsListAdapter(Activity context, List<Vraag> vragen){
    super(context, R.layout.vraag_item, vragen);
    this.context = context;
    this.vragen = vragen;

}

@Override
public View getView(int position, View convertView, ViewGroup parent) {     
    View view;
    //convertView = null;

    if(convertView == null) {
        LayoutInflater inflater = (LayoutInflater)context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        view = inflater.inflate(R.layout.vraag_item, null, false);

        holder = new ViewHolder();
        holder.vraag = (TextView)view.findViewById(R.id.tv_vraag);
        holder.group = (RadioGroup)view.findViewById(R.id.toggleGroup);
        holder.position = position;
        holder.toggle = new ToggleButton(context);

        for(final Antwoord a : vragen.get(holder.position).getAntwoorden()){
            holder.toggle = new ToggleButton(context);
            holder.toggle.setText(a.getAntwoord());
            holder.toggle.setTextOn(a.getAntwoord());
            holder.toggle.setTextOff(a.getAntwoord());
            holder.toggle.setId(a.getId());
            holder.toggle.setChecked(a.getSelected());

            if(a.getVisible() == false){
                holder.toggle.setVisibility(ToggleButton.INVISIBLE);
            }       

            holder.toggle.setOnClickListener(new OnClickListener()
            {
                @Override
                public void onClick(View view)
                {
                    // your click actions go here
                    ((RadioGroup)view.getParent()).check(view.getId());
                    a.setSelected(holder.toggle.isChecked());
                }
            });

            holder.group.addView(holder.toggle);    

        }

        holder.group.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener(){
            public void onCheckedChanged(RadioGroup group, int checkedId){
                for (int j = 0; j < group.getChildCount(); j++) {
                    final ToggleButton view = (ToggleButton) group.getChildAt(j);
                    view.setChecked(view.getId() == checkedId);      
                }
            }
        });
        view.setTag(holder);    
    }
    else{
        view = convertView;
    }       

    ViewHolder viewholder = (ViewHolder)view.getTag();

    viewholder.vraag.setText(vragen.get(holder.position).getVraag());

    return view;
}

static class ViewHolder {
      TextView vraag;
      RadioGroup group;
      ToggleButton toggle;
      int position;
    }

}