Tutorial Android 4 #7 – Aprimorando a Listagem – Rafael Toledo
O primeiro passo é criarmos o nosso próprio adaptador para exibir os itens na lista. Assim, na classe MeusContatos, vamos criar uma classe interna, chamada ContatoAdapter. Vai ficar assim:
private class ContatoAdapter extends ArrayAdapter {
public ContatoAdapter() {
super(MeusContatos.this, android.R.layout.simple_list_item_1,
contatos);
O próximo passo é ajustar nosso layout para a nossa nova lista, já que nessa nova listagem teremos nome, e-mail e tipo (representado por uma imagem). Vamos, primeiramente, criar um layout que represente cada um dos itens da nossa listagem de forma a abrigar os três elementos. Na pasta res/layout crie o arquivo elemento_lista.xml com o seguinte conteúdo:
android:contentDescription="@string/desc_icone" />
Resumidamente, este layout divide cada item de listagem em duas partes (dois itens LinearLayout), sendo a primeira divisão de forma horizontal, onde à esquerda ficará a nossa imagem e, à direita, teremos outro LinearLayout, dessa vez vertical, que exibirá o nome do contato e seu e-mail.
O próximo passo é colocar as imagens em res/drawable. Você deve perceber que na estrutura do projeto, temos as pastas drawable-hdpi, drawable-ldpi, drawable-mdpi e drawable-xhdpi. Esses sufixos indicam a densidade de pixel dos vários tipos de tela que um dispositivo Android pode ter. Ele está diretamente ligado ao tamanho e resolução da tela. Por exemplo, o emulador que estou utilizando tem densidade hdpi (alta densidade), enquanto que meu celular pessoal (LG Optimus One) tem densidade mdpi (média densidade). Mais informações sobre esse assunto podem ser encontradas na documentação oficial. Então, pra fecharmos esse assunto por hoje, as pastas servem para colocar imagens em diferentes resoluções, para deixá-las mais nítidas nas várias densidades e evitar problemas de exibição com o redimensionamento automático que o Android faz. No caso do nosso exemplo, vou colocar as imagens em drawable-hdpi (resolução do emulador). No final do post eu mostro como ficou também no meu celular. Então, baixe as imagens (academico.png, pessoal.png e profissional.png) aqui e coloque-as na pasta drawable-hdpi.
Agora, vamos sobrescrever o método getView() na classe ContatoAdapter. Este método é o responsável por exibir os itens na tela. Assim, vamos através dele utilizar o layout definido em elemento_lista.xml. A classe ContatoAdapter fica assim:
ArmazenadorDeContatos armazenador = null;
linha = inflater.inflate(R.layout.elemento_lista, null);
Contato contato = contatos.get(position);
((TextView) linha.findViewById(R.id.titulo)).setText(contato.getNome());
((TextView) linha.findViewById(R.id.subtitulo)).setText(contato.getEmail());
ImageView icone = (ImageView) linha.findViewById(R.id.icone);
switch (contato.getTipo()) {
icone.setImageResource(R.drawable.academico);
icone.setImageResource(R.drawable.pessoal);
icone.setImageResource(R.drawable.profissional);
Prosseguindo, precisamos agora vincular os itens da lista à nossa lista de restaurantes adicionados. Para isso, vamos criar uma classe estática que armazenará os valores para que sejam adicionados à lista exibida na tela. Adicione-a após a declaração do nosso adaptador a classe estática ArmazenadorDeContatos:
static class ArmazenadorDeContatos {
private TextView email = null;
public ArmazenadorDeContatos(View linha) {
email = (TextView) linha.findViewById(R.id.subtitulo);
void popularFormulario(Contato contato) {
nome.setText(contato.getNome());
email.setText(contato.getEmail());
Por fim, vamos fazer o método getView utilizar a classe ArmazenadorDeContatos para montar os objetos na lista, e alteramos as referências ao ArrayAdapter para o nosso ContatoAdapter, finalizando o nosso tutorial. Corrija a chamada ao construtor do adaptador no método onCreate() da activity também. A listagem completa da classe MeusContatos fica assim:
private List contatos = new ArrayList();
armazenador = new ArmazenadorDeContatos(linha);
armazenador = (ArmazenadorDeContatos) linha.getTag();
armazenador.popularFormulario(contatos.get(position));
E ao rodar, temos o seguinte:
rodando no emulador… (clique para ampliar)
… e rodando no meu celular (mdpi)
Deu pra perceber que o redimensionamento automático não ficou ruim. No caso, quando for fazer seus aplicativos, é sempre bom verificar como fica a visualização em diversas resoluções pra não ter problemas 🙂