03 Out, 2011 15:24

Criando lista com seções em Android

Primeiramente, precisamos definir o comportamento do adapter da nossa lista. Eu o chamei de ListaAdapter. Segue seu código:

private class ListaAdapter extends BaseAdapter {

    private static final int TIPO_ITEM = 0;
    private static final int TIPO_ITEM2 = 1;
    private static final int TIPO_SEPARADOR = 2;

    private ArrayList<String> itens = new ArrayList<String>();
    private LayoutInflater inflater;

    private TreeSet<Integer> separadores = new TreeSet<Integer>();

    public ListaAdapter() {
        inflater = (LayoutInflater)getSystemService(Context.LAYOUT_INFLATER_SERVICE);
    }

    public void adicionarItem(final String item) {
        itens.add(item);
        notifyDataSetChanged();
    }

    public void adicionarSeparador(final String item) {
        itens.add(item);
        separadores.add(itens.size() - 1);
        notifyDataSetChanged();
    }

    @Override
    public int getItemViewType(int position) {
        if (separadores.contains(position)) 
            return TIPO_SEPARATOR;
        else {
            if (position % 2 == 0)
                return TIPO_ITEM;
            else
                return TIPO_ITEM2;
        }
    }

    @Override
    public int getViewTypeCount() {
        return 3;
    }

    @Override
    public int getCount() {
        return itens.size();
    }

    @Override
    public String getItem(int position) {
        return itens.get(position);
    }

    @Override
    public long getItemId(int position) {
        return position;
    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        ViewHolder holder = null;
        int tipo = getItemViewType(position);

        if (convertView == null) {
            holder = new ViewHolder();
            switch (tipo) {
                case TIPO_ITEM:
                    convertView = inflater.inflate(R.layout.item1, null);
                    holder.textView = (TextView)convertView.findViewById(android.R.id.text1);
                    break;
                case TIPO_ITEM2:
                    convertView = inflater.inflate(R.layout.item2, null);
                    holder.textView = (TextView)convertView.findViewById(android.R.id.text1);
                    break;
                case TIPO_SEPARATOR:
                    convertView = inflater.inflate(R.layout.separador, null);
                    holder.textView = (TextView)convertView.findViewById(android.R.id.text1);
                    break;
            }
            convertView.setTag(holder);
        } else {
            holder = (ViewHolder)convertView.getTag();
        }

        holder.textView.setText(itens.get(position));
        return convertView;
    }
}

public static class ViewHolder {
    public TextView textView;
}

O que eu fiz foi definir os tipos de componentes que a minha lista tem. São eles: ITEM1, ITEM2 e SEPARADOR. O tipo SEPARADOR é que define que meu item na lista é uma seção e aparecerá sempre acima de um conjunto de itens. A diferença dos tipos ITEM1 e ITEM2 é a cor de fundo.

Depois, criei dois métodos adicionarItem(final String item) e adicionarSeparador(final String item) que serão utilizados para montar a lista.

Os demais métodos são do BaseAdapter que eu sobrescrevi para determinar o comportamento do meu adapter. O grande truque está em definir o método getItemViewType(int position). É nele que eu disse que item seria ou uma seção/separador, ou do tipo item1 ou item2. Já no getView(int position, View convertView, ViewGroup parent) eu implementei que para cada tipo de item, um layout diferente seria referenciado.

Para montar a nossa lista, segue o código:

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

    ListaAdapter adapter = new ListaAdapter();
    adapter.addSeparatorItem("Seção");
    for (int i = 1; i < 10; i++) {
        adapter.addItem("Item " + i);
        if (i % 2 == 0) {
            adapter.addSeparatorItem("Seção");
        }
    }
    setListAdapter(adapter);
}

Na criação da minha activity, eu instanciei o ListaAdapter e disse que a cada dois itens da minha lista, o próximo seria uma seção. Abaixo o resultado final:

Lista com seções

Você pode conseguir o código fonte clicando aqui!

Ao navegar neste site, você consente o uso de cookies nossos e de terceiros, que coletam informações anônimas e são essenciais para melhorar sua experiência em nosso site.