Liste à choix multiples avec vue personnalisée ?

Question

J'ai vu des exemples com.example.Android.apis.view.List11 de ApiDemos. Dans cet exemple, chaque ligne prend la vue Android.R.simple_list_item_multiple_choice . Chacune de ces vues possède un TextView et un CheckBox .

Je veux maintenant que chaque vue ait 2 TextView et 1 CheckBox , quelque peu similaire à la Liste3 exemple. J'ai essayé de créer un fichier de mise en page personnalisé row.xml comme suit :

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    >
    <CheckBox
        android:id="@+id/checkbox"
        android:layout_alignParentRight="true"
        android:layout_width="wrap_content"
        android:layout_height="fill_parent" />
    <TextView
        android:id="@+id/text_name"
        android:textSize="13px"
        android:textStyle="bold"
        android:layout_toLeftOf="@id/checkbox"
        android:layout_alignParentLeft="true"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content" />
    <TextView
        android:id="@+id/text_phone"
        android:textSize="9px"
        android:layout_toLeftOf="@id/checkbox"
        android:layout_below="@id/text_name"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content" /> 
</RelativeLayout>

Ensuite, dans Activity 's onCreate() Je l'aime bien :

public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);

    // Query the contacts
    mCursor = getContentResolver().query(Phones.CONTENT_URI, null, null, null, null);
    startManagingCursor(mCursor);

    ListAdapter adapter = new SimpleCursorAdapter(this,
            R.layout.row,
            mCursor, 
            new String[] { Phones.NAME, Phones.NUMBER}, 
            new int[] { R.id.text_name, R.id.text_phone });
    setListAdapter(adapter);
    getListView().setChoiceMode(ListView.CHOICE_MODE_MULTIPLE);
}

Le résultat ressemble un peu à ce que je veux, mais il semble que la liste ne sache pas quel élément est sélectionné. De plus, je dois cliquer exactement sur l'élément CheckBox . Dans l'exemple de la liste 11, il suffit de cliquer sur la ligne de l'élément.

Que dois-je faire pour créer une liste à choix multiples avec ma vue personnalisée pour chaque ligne ? Merci beaucoup.

Answer 1

Vous devez créer votre propre RelativeLayout qui met en œuvre le Checkable et ont une référence à l'interface CheckBox ou au CheckedTextView (ou une liste s'il s'agit d'un mode à choix multiples).

Regardez ce post : http://www.marvinlabs.com/2010/10/29/custom-listview-ability-check-items/

Answer 2

La réponse de Rahul Garg est valable pour le premier chargement de la liste, si vous souhaitez que certaines lignes soient vérifiées en fonction des données du modèle, mais après cela, vous devez gérer vous-même les événements de vérification/décontrôle.

Vous pouvez remplacer le onListItemCLick() de la ListActivity pour vérifier/décocher les lignes

@Override
protected void onListItemClick(ListView l, View v, int position, long id) {
    super.onListItemClick(l, v, position, id);
    ViewGroup row = (ViewGroup)v;
 CheckBox check = (CheckBox) row.findViewById(R.id.checkbox);            
    check.toggle();
}

Si vous le faites, ne mettez pas le ListView a CHOICE_MODE_MULTIPLE parce qu'il fait des choses étranges lors de l'appel de la fonction.

Pour récupérer la liste des lignes vérifiées, vous devez mettre en œuvre une méthode vous-même, en appelant getCheckItemIds() sur le ListView ne fonctionne pas :

ListView l = getListView();
int count = l.getCount();
for(int i=0; i<count; ++i) {
   ViewGroup row = (ViewGroup)l.getChildAt(i);
   CheckBox check = (Checked) row.findViewById(R.id.ck1);
   if( check.isChecked() ) {
      // do something
   }
}

Answer 3

Chacune de ces vues possède un TextView et un CheckBox.

Non, ce n'est pas le cas. Il a un CheckedTextView .

Que dois-je faire ? liste à choix multiples avec ma vue pour chaque ligne ?

Essayez de faire le CheckBox android:id valeur être "@android:id/text1" et voir si cela peut aider. C'est l'identifiant utilisé par Android pour le CheckedTextView en simple_list_item_multiple_choice .

Answer 4

La solution consiste à créer une vue personnalisée qui implémente l'interface Clickable.

public class OneLineCheckableListItem extends LinearLayout implements Checkable {

    public OneLineCheckableListItem(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    private boolean checked;

    @Override
    public boolean isChecked() {
        return checked;
    }

    @Override
    public void setChecked(boolean checked) {
        this.checked = checked; 

        ImageView iv = (ImageView) findViewById(R.id.SelectImageView);
        iv.setImageResource(checked ? R.drawable.button_up : R.drawable.button_down);
    }

    @Override
    public void toggle() {
        this.checked = !this.checked;
    }
}

Créez une mise en page personnalisée pour les éléments de la liste à l'aide du nouveau widget.

<?xml version="1.0" encoding="utf-8"?>
<ax.wordster.OneLineCheckableListItem xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_marginBottom="4dp"
    android:background="@drawable/selector_listitem"
    android:orientation="horizontal" >

    <ImageView
        android:id="@+id/SelectImageView"
        android:layout_width="60dp"
        android:layout_height="60dp"
        android:src="@drawable/button_friends_down" />

    <TextView
        android:id="@+id/ItemTextView"
        android:layout_width="fill_parent"
        android:layout_height="60dp"
        android:gravity="center"
        android:text="@string/___"
        android:textAppearance="?android:attr/textAppearanceLarge"
        android:textColor="@color/text_item" />

</ax.wordster.OneLineCheckableListItem>

Créez ensuite un nouvel adaptateur personnalisé en utilisant la présentation ci-dessus.

Answer 5

C'est possible grâce à une astuce

dans votre ListActivtyClass dans la méthode

protected void onListItemClick(ListView l, View v, int position, long id) {
//just set
<your_model>.setSelected(true);
}

maintenant dans votre adaptateur personnalisé

public View getView(int position, View convertView, ViewGroup parent) {
        if (convertView == null) {
            LayoutInflater inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
            convertView = inflater.inflate(textViewResourceId, parent, false);
        }       
        if (<your_model>.isSelected()) {
            convertView.setBackgroundColor(Color.BLUE);
        } else {
            convertView.setBackgroundColor(Color.BLACK);
        }
        return convertView;
    }

Vous pouvez ainsi personnaliser l'affichage de l'adaptateur lorsque l'élément est sélectionné dans la liste.