Exemple de liste Android

Exemple Android ListView

Sous Android,ListView vous permet d'organiser les composants dans une liste déroulante verticale.

Dans ce tutoriel, nous allons vous montrer 2ListViewexemples:

  1. Manière normale d'afficher les composants enListView.

  2. Adaptateur de baie personnalisé pour personnaliser l'affichage des éléments enListView.

P.S This project is developed in Eclipse 3.7, and tested with Android 2.3.3.

1. Exemple de ListView normal

Dans cet exemple, nous vous montrons comment afficher une liste de noms de fruits viaListView, cela devrait être simple et explicite.

1.1 Android Layout file

Fichier: res / layout / list_fruit.xml



1.2 ListView

package com.example.android;

import android.app.ListActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.ArrayAdapter;
import android.widget.ListView;
import android.widget.TextView;
import android.widget.Toast;
import android.widget.AdapterView.OnItemClickListener;

public class ListFruitActivity extends ListActivity {

    static final String[] FRUITS = new String[] { "Apple", "Avocado", "Banana",
            "Blueberry", "Coconut", "Durian", "Guava", "Kiwifruit",
            "Jackfruit", "Mango", "Olive", "Pear", "Sugar-apple" };

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

        // no more this
        // setContentView(R.layout.list_fruit);

        setListAdapter(new ArrayAdapter(this, R.layout.list_fruit,FRUITS));

        ListView listView = getListView();
        listView.setTextFilterEnabled(true);

        listView.setOnItemClickListener(new OnItemClickListener() {
            public void onItemClick(AdapterView parent, View view,
                    int position, long id) {
                // When clicked, show a toast with the TextView text
                Toast.makeText(getApplicationContext(),
                ((TextView) view).getText(), Toast.LENGTH_SHORT).show();
            }
        });

    }

}

1.3 Demo

android listview example

2. Exemple d'arrayAdapter personnalisé

Dans cet exemple, nous vous montrons comment créer 4 éléments dans lesListView, et utiliser un «ArrayAdapter» personnalisé pour afficher différentes images basées sur le «nom de l'élément» dans la liste.

2.1 Images
Obtenez 4 images pour la démonstration.

images in android project

2.2 Android Layout file
Fichier: res / layout / list_mobile.xml




    
    

    
    

2.3 Custom ArrayAdapter
Créez une classe étendArrayAdapter et personnalisez l'affichage des éléments dans la méthodegetView().

package com.example.android.adaptor;

import com.example.android.R;

import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ArrayAdapter;
import android.widget.ImageView;
import android.widget.TextView;

public class MobileArrayAdapter extends ArrayAdapter {
    private final Context context;
    private final String[] values;

    public MobileArrayAdapter(Context context, String[] values) {
        super(context, R.layout.list_mobile, values);
        this.context = context;
        this.values = values;
    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        LayoutInflater inflater = (LayoutInflater) context
            .getSystemService(Context.LAYOUT_INFLATER_SERVICE);

        View rowView = inflater.inflate(R.layout.list_mobile, parent, false);
        TextView textView = (TextView) rowView.findViewById(R.id.label);
        ImageView imageView = (ImageView) rowView.findViewById(R.id.logo);
        textView.setText(values[position]);

        // Change icon based on name
        String s = values[position];

        System.out.println(s);

        if (s.equals("WindowsMobile")) {
            imageView.setImageResource(R.drawable.windowsmobile_logo);
        } else if (s.equals("iOS")) {
            imageView.setImageResource(R.drawable.ios_logo);
        } else if (s.equals("Blackberry")) {
            imageView.setImageResource(R.drawable.blackberry_logo);
        } else {
            imageView.setImageResource(R.drawable.android_logo);
        }

        return rowView;
    }
}

2.4 ListView
ListView, mais utilisez l'adaptateur personnalisé ci-dessus pour afficher la liste.

package com.example.android;

import com.example.android.adaptor.MobileArrayAdapter;
import android.app.ListActivity;
import android.os.Bundle;
import android.widget.ListView;
import android.widget.Toast;
import android.view.View;

public class ListMobileActivity extends ListActivity {

    static final String[] MOBILE_OS =
               new String[] { "Android", "iOS", "WindowsMobile", "Blackberry"};

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

        setListAdapter(new MobileArrayAdapter(this, MOBILE_OS));

    }

    @Override
    protected void onListItemClick(ListView l, View v, int position, long id) {

        //get selected items
        String selectedValue = (String) getListAdapter().getItem(position);
        Toast.makeText(this, selectedValue, Toast.LENGTH_SHORT).show();

    }

}

2.5 Demo

android custom array adapter example

Télécharger le code source

Téléchargez les deux exemples -Android-ListView-Example.zip (21 Ko)