Tutorial Android #4 – Adicionando uma Lista

Olá pessoal! No tutorial de hoje da série sobre Android, vamos começar a adicionar funcionalidade ao nosso aplicativo. Com o post de hoje, conseguiremos adicionar os restaurantes, que serão listados no aplicativo.

Começando a colocar a mão na massa, o primeiro passo é trocarmos a instância única da classe Restaurante por uma lista de objetos. Porém, a simples mudança acarretará alguns erros no código. Assim, também precisaremos montar o objeto no método onClick e o adicionarmos na lista. Com essas alterações, o nosso arquivo ListaRestaurantes.java vai ficar assim:

	package net.rafaeltoledo.restaurante;
	import java.util.ArrayList;
	import java.util.List;
	import net.rafaeltoledo.restaurante.model.Restaurante;
	import android.app.Activity;
	import android.os.Bundle;
	import android.view.View;
	import android.view.View.OnClickListener;
	import android.widget.Button;
	import android.widget.EditText;
	import android.widget.RadioGroup;
	public class ListaRestaurantes extends Activity {
	List<Restaurante> listaRestaurantes = new ArrayList<Restaurante>();
	@Override
	public void onCreate(Bundle savedInstanceState) {
	super.onCreate(savedInstanceState);
	setContentView(R.layout.main);
	Button salvar = (Button) findViewById(R.id.salvar);
	salvar.setOnClickListener(onSave);
	}
	private OnClickListener onSave = new OnClickListener() {
	public void onClick(View arg0) {
	Restaurante r = new Restaurante();
	EditText nome = (EditText) findViewById(R.id.nome);
	EditText endereco = (EditText) findViewById(R.id.end);
	r.setNome(nome.getText().toString());
	r.setEndereco(endereco.getText().toString());
	RadioGroup tipos = (RadioGroup) findViewById(R.id.tipos);
	switch (tipos.getCheckedRadioButtonId()) {
	case R.id.rodizio:
	r.setTipo("rodizio");
	break;
	case R.id.fast_food:
	r.setTipo("fast_food");
	break;
	case R.id.a_domicilio:
	r.setTipo("a_domicilio");
	break;
	}
	listaRestaurantes.add(r);
	}
	};
	}

view raw ListaRestaurantes.java hosted with ❤ by GitHub

Basicamente, o que fizemos foi retirar o objeto r que estava no escopo da classe e o colocamos no método onClick. Além disso, criamos a lista chamada listaRestaurantes como um atributo da classe, e ao final do método onClick, adicionamos o objeto à lista.

O próximo passo é implementarmos o método toString() da classe Restaurante, já que ele será chamado quando os restaurantes forem listados. Para o nosso objetivo, nos interessa apenas o nome do restaurante, de forma que o método toString() pode retornar o método getNome(). Dessa forma, nossa classe Restaurante fica assim:

	package net.rafaeltoledo.restaurante.model;
	public class Restaurante {
	private String nome = "";
	private String endereco = "";
	private String tipo = "";
	public String getNome() {
	return nome;
	}
	public void setNome(String nome) {
	this.nome = nome;
	}
	public String getEndereco() {
	return endereco;
	}
	public void setEndereco(String endereco) {
	this.endereco = endereco;
	}
	public String getTipo() {
	return tipo;
	}
	public void setTipo(String tipo) {
	this.tipo = tipo;
	}
	@Override
	public String toString() {
	return getNome();
	}
	}

view raw Restaurante.java hosted with ❤ by GitHub

Agora temos a parte mais desafiadora, que é exatamente mostrar a lista de restaurantes na tela de acordo que formos adicionando-os. Uma forma de fazer isso é utilizando o RelativeLayout, de forma que o formulário permaneça na parte de baixo da tela e os restaurantes adicionados sejam listados na parte superior. Vamos alterar o arquivo main.xml para que fique com esse aspecto:

	<?xml version="1.0" encoding="utf-8"?>
	<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android&quot;
	android:layout_width="fill_parent"
	android:layout_height="fill_parent">
	<TableLayout
	android:id="@+id/detalhes"
	android:layout_width="fill_parent"
	android:layout_height="wrap_content"
	android:layout_alignParentBottom="true"
	android:stretchColumns="1">
	<TableRow>
	<TextView android:text="Nome:" />
	<EditText android:id="@+id/nome" />
	</TableRow>
	<TableRow>
	<TextView android:text="Endereço:" />
	<EditText android:id="@+id/end" />
	</TableRow>
	<TableRow>
	<TextView android:text="Tipo:" />
	<RadioGroup android:id="@+id/tipos">
	<RadioButton
	android:id="@+id/rodizio"
	android:text="Rodízio" />
	<RadioButton
	android:id="@+id/fast_food"
	android:text="Fast Food" />
	<RadioButton
	android:id="@+id/a_domicilio"
	android:text="A Domicílio" />
	</RadioGroup>
	</TableRow>
	<Button
	android:id="@+id/salvar"
	android:layout_width="fill_parent"
	android:layout_height="wrap_content"
	android:text="Salvar" />
	</TableLayout>
	<ListView
	android:id="@+id/restaurantes"
	android:layout_width="fill_parent"
	android:layout_height="wrap_content"
	android:layout_alignParentTop="true"
	android:layout_above="@id/detalhes" />
	</RelativeLayout>

view raw main.xml hosted with ❤ by GitHub

Basicamente o que fizemos foi englobar o TableLayout que tínhamos dentro do RelativeLayout, ajustando suas dimensões. Além disso, tivemos também um item chamado ListView, definido pelo nome restaurantes, que será quem armazenará a nossa lista de restaurantes. Um importante parâmetro é o android:layout_above que indicará que nosso TableLayout, agora nomeado como detalhes, será exibido logo em seguida ao nosso RelativeLayout.

Se executarmos nosso aplicativo agora, ele deverá ter essa aparência:

Agora, precisamos fazer alguns ajustes na nossa Activity para que os elementos sejam adicionados e listados. Abra o arquivo ListaRestaurantes.java novamente e edite-o:

	package net.rafaeltoledo.restaurante;
	import java.util.ArrayList;
	import java.util.List;
	import net.rafaeltoledo.restaurante.model.Restaurante;
	import android.app.Activity;
	import android.os.Bundle;
	import android.view.View;
	import android.view.View.OnClickListener;
	import android.widget.ArrayAdapter;
	import android.widget.Button;
	import android.widget.EditText;
	import android.widget.ListView;
	import android.widget.RadioGroup;
	public class ListaRestaurantes extends Activity {
	List<Restaurante> listaRestaurantes = new ArrayList<Restaurante>();
	ArrayAdapter<Restaurante> adaptador = null;
	@Override
	public void onCreate(Bundle savedInstanceState) {
	super.onCreate(savedInstanceState);
	setContentView(R.layout.main);
	Button salvar = (Button) findViewById(R.id.salvar);
	salvar.setOnClickListener(onSave);
	ListView lista = (ListView) findViewById(R.id.restaurantes);
	adaptador = new ArrayAdapter<Restaurante>(this,
	android.R.layout.simple_list_item_1, listaRestaurantes);
	lista.setAdapter(adaptador);
	}
	private OnClickListener onSave = new OnClickListener() {
	public void onClick(View arg0) {
	Restaurante r = new Restaurante();
	EditText nome = (EditText) findViewById(R.id.nome);
	EditText endereco = (EditText) findViewById(R.id.end);
	r.setNome(nome.getText().toString());
	r.setEndereco(endereco.getText().toString());
	RadioGroup tipos = (RadioGroup) findViewById(R.id.tipos);
	switch (tipos.getCheckedRadioButtonId()) {
	case R.id.rodizio:
	r.setTipo("rodizio");
	break;
	case R.id.fast_food:
	r.setTipo("fast_food");
	break;
	case R.id.a_domicilio:
	r.setTipo("a_domicilio");
	break;
	}
	adaptador.add(r);
	}
	};
	}

view raw NewListaRestaurantes.java hosted with ❤ by GitHub

O que fizemos foi adicionar o elemento adaptador, do tipo ArrayAdapter. É ele quem fará a montagem dos restaurantes adicionados na tela. Definimos a forma como ele funcionará em seu construtor, na linha 31, indicando o segundo parâmetro android.R.layout.simple_list_item_1, dizendo que será uma lista da classe Restaurante, e passando o parâmetro listaRestaurantes. Vinculamos o adaptador, então, ao item ListView que foi declarado no main.xml, e que o obtemos através do método findViewById(). Assim, chamamos seu método setAdapter e passamos o nosso adaptador.

Ao final, no método onClick, ao invés de adicionarmos o restaurante à lista, adicionamos ao adaptador. O resultado será a lista de restaurantes sendo criada em nosso aplicativo:

Bom, por hoje é isso! Pra quem teve problemas, pode baixar o projeto aqui.

Até a próxima!