Aula 06

Prévia do material em texto

PROGRAMAÇÃO IV 
AULA 6 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
Prof. Ricardo Rodrigues Lecheta 
 
 
 
CONVERSA INICIAL 
Olá, seja bem-vindo a mais uma aula! 
Nós já aprendemos como criar telas com formulários e estudamos o ciclo 
de vida de uma activity. Nesta aula, vamos estudar sobre listas, que com certeza 
é o componente mais utilizado em aplicativos. 
Imagine que você precisa organizar suas tarefas do que fazer durante a 
semana e decidiu criar um aplicativo para ajudá-lo. Nesta aula, vamos criar um 
esboço deste aplicativo para salvar tarefas e mostrá-las em uma lista. 
Não vamos usar banco de dados para simplificar o exemplo, até porque o 
objetivo da aula é estudar listas. Todas as tarefas serão salvas em memória com 
uma HashTable, e os dados serão perdidos ao reiniciar o aplicativo. 
Aproveitando: web services e banco de dados vamos estudar em aulas práticas. 
TEMA 1 – LISTAS: CONFIGURAÇÃO 
Para iniciar, crie um novo projeto chamado HelloTarefas da mesma forma 
que fizemos nos outros exemplos. Lembre-se de selecionar o template Empty 
Activity. 
Logo depois de criar o projeto, adicione as seguintes dependências no 
arquivo app/build.gradle. No final do arquivo, você vai encontrar uma tag 
dependencies, na qual vão existir outras dependências previamente 
configuradas. Basta adicionar essas duas linhas. A lib 'material' contém classes 
do Material Design que vamos utilizar e a lib 'recyclerview' é para adicionar a 
classe RecyclerView que representa a view de uma lista. 
● app/build.gradle 
dependencies { 
 . . . 
 implementation 'com.google.android.material:material:1.2.1' 
 implementation 'androidx.recyclerview:recyclerview:1.1.0' 
} 
Na figura a seguir, podemos ver o arquivo app/build.gradle aberto no 
editor e o local onde as dependências foram adicionadas. Observe que no canto 
direito superior da figura, existe um botão Sync now, o qual vai fazer o download 
e instalação dessas dependências (libs). 
 
 
Observação: caso não esteja acostumado com o termo dependência, é 
um sinônimo utilizado para biblioteca. Na prática, uma dependência é uma 
biblioteca com vários arquivos que é baixada e instalada no projeto. 
Figura 1 – Dependência 
 
Feita essa configuração, podemos abrir o arquivo activity_main.xml e 
adicionar a view RecyclerView no layout. Observe que deixamos a tag 
LinearLayout como raiz do layout. 
Algo importante que você precisa se acostumar é que as views 
LinearLayout, FrameLayout, TextView, EditText, Button etc. são nativas do 
Android e, no nome da tag XML, precisamos colocar apenas o nome da classe 
dessa view. Como a classe/view RecyclerView foi adicionada pela dependência 
que colocamos no arquivo app/build.gradle, ao declarar a tag XML, precisamos 
colocar o nome completo da classe, incluindo o seu pacote. Observe também 
que foi dado o id @+id/recyclerView para o RecyclerView. 
● activity_main.xml 
<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout 
xmlns:android="http://schemas.android.com/apk/res/android" 
 android:layout_width="match_parent" 
 android:layout_height="match_parent"> 
 
 <androidx.recyclerview.widget.RecyclerView 
 android:id="@+id/recyclerView" 
 android:layout_width="match_parent" 
 android:layout_height="wrap_content" /> 
</LinearLayout> 
 
 
Pronto, feito isso execute o projeto novamente para validar se as 
configurações foram feitas com sucesso. Se tudo funcionar, você verá uma tela 
vazia, pois o RecyclerView é uma lista e, por enquanto, está vazia. 
Figura 2 – Lista de tarefas vazia 
 
Crédito: Brostock/Shutterstock. 
TEMA 2 – LISTAS: EXEMPLO BÁSICO 
Para que você consiga visualizar o nosso objetivo, vamos criar uma lista 
com três views, conforme mostra a próxima figura. 
Figura 3 – Lista de tarefas 
 
Crédito: Brostock/Shutterstock. 
 
 
Seguindo o mesmo raciocínio, para facilitar o seu entendimento de quais 
arquivos vamos criar neste exercício e do local que você precisa criar os 
arquivos, veja a figura a seguir. 
Figura 4 – Arquivos que vamos criar no projeto 
 
Para começar, vamos criar a classe Tarefa, que vai representar a 
entidade que vamos querer salvar. Sempre que for criar uma classe, utilize o 
wizard > New > Kotlin File/Class. A classe Tarefa contém apenas dois atributos 
(id e título) e também implementa a interface Serializable. 
package com.example.hellotarefas 
 
import java.io.Serializable 
 
data class Tarefa( 
 var id: Int = 0, 
 var titulo: String = "" 
 
) : Serializable 
Nota: é comum utilizarmos o termo entidade para referenciar uma classe 
de domínio que é mapeada para uma tabela do banco de dados, ou seja, ela 
será salva em uma tabela. Geralmente, essas classes contêm atributos com os 
mesmos nomes da tabela do banco de dados. Mais uma vez, em nosso exemplo, 
não usaremos banco de dados, pois o objetivo desta aula é aprendermos a 
utilizar o RecyclerView, que é a view que cria uma lista. 
 
 
Com a classe Tarefa criada, precisamos de uma classe que vai 
encapsular a lógica para buscar as tarefas e retornar uma lista do tipo 
List<Tarefa>. Portanto, crie a classe TarefaService. 
package com.example.hellotarefas 
 
object TarefaService { 
 
 private val tarefas = mutableListOf<Tarefa>() 
 
 init { 
 for (i in 1..3) { 
 tarefas.add(Tarefa(i,"Tarefa $i")) 
 } 
 } 
 
 fun getTarefas(): List<Tarefa> { 
 return tarefas 
 } 
} 
Mais uma vez, explicando um pouco sobre arquitetura de código, é uma 
boa prática criar esse tipo de classe para encapsular essa lógica. Atualmente, 
como você pode ver, estamos criando uma lista fixa com três tarefas apenas 
para brincar e estudar como criar listas com o RecyclerView. Mas, futuramente, 
essa classe poderia conter uma lógica para ler essas tarefas do banco de dados 
do celular Android, ou até mesmo buscar as tarefas na internet usando um web 
service (API). Mas, por enquanto, essa classe já vai criar uma lista com três 
tarefas e é suficiente para nossos estudos. Se quiser, altere o loop for, para criar 
quantas tarefas achar necessário. 
Uma vez que já temos as classes Tarefa e TarefaService criadas, 
precisamos ter uma maneira de pegar a lista de tarefas e preencher lá naquele 
RecyclerView que está no arquivo activity_main.xml. Para fazer essa ponte 
entre a lista de tarefas List<Tarefa> e o RecyclerView, precisamos criar uma 
classe chamada de Adapter, que assim como a activity, é uma dupla de uma 
classe + layout XML. 
Essa parte, aliás, já adianto que é meio chatinha e difícil de entender no 
início, portanto, recomendo que depois que fizer o exemplo funcionar, leia e 
releia tudo novamente para conseguir encaixar todos os pedaços do quebra-
cabeça. 
Uma dica é você imaginar que o RecyclerView é apenas o componente 
da lista, mas ele não sabe qual o layout que cada célula da lista vai ter. Lembra 
 
 
que na figura anterior tinha três tarefas na lista? Cada linha da lista é uma 'célula' 
que possui seu próprio layout XML, a qual o Android chama de Adapter. 
Para você ir visualizando na prática, podemos dizer que uma prévia do 
código da activity que vai preencher a lista de tarefas no RecyclerView é assim: 
package com.example.hellotarefas 
 
import androidx.appcompat.app.AppCompatActivity 
import android.os.Bundle 
import androidx.recyclerview.widget.LinearLayoutManager 
import kotlinx.android.synthetic.main.activity_main.* 
 
class MainActivity : AppCompatActivity() { 
 override fun onCreate(savedInstanceState: Bundle?) { 
 super.onCreate(savedInstanceState) 
 setContentView(R.layout.activity_main) 
 } 
 
 override fun onResume() { 
 super.onResume() 
 
 // (1) Busca a lista de tarefas 
 val tarefas = TarefaService.getTarefas() 
 
 // (2) Configura o layout do RecyclerView para Vertical 
 recyclerView.layoutManager = LinearLayoutManager(this) 
 
 // (3) Configura o adapter 
 recyclerView.adapter = TarefaAdapter(tarefas)} 
} 
A parte vermelha onde está a classe TarefaAdapter é o código que está 
faltando para o exemplo compilar, mas logo vamos ver isso. Por enquanto, segue 
explicações de cada parte do código: 
1. É uma boa prática deixar a lógica de inicialização da tela no método 
onResume() da activity. Nele, é feita a busca da lista de tarefas que 
retorna um objeto do tipo List<Tarefa>. 
2. O RecyclerView pode ter um layout de listas ou grid (várias colunas). Essa 
linha configura o template padrão de listas na vertical. 
3. O RecyclerView possui uma propriedade adapter que deve receber uma 
classe filha de RecyclerView.Adapter. É essa parte do código que está 
faltando para compilar. 
Agora, vamos falar da classe Adapter. Essa classe contém a lógica para 
preencher o conteúdo de cada célula, ou seja, preencher o conteúdo de cada 
 
 
linha da lista. O adapter também é uma dupla formada pela classe Kotlin ou Java, 
e o layout XML que será utilizado na célula. 
Lembra da figura na qual mostramos os arquivos que vamos criar neste 
exemplo? Veja-a novamente e perceba o local da classe TarefaAdapter e seu 
layout XML adapter_tarefa.xml. 
Dito isso, vamos criar o arquivo XML de layout para o adapter. Para isso, 
utilize o wizard > New > File e digite '.xml' na extensão ao criar o arquivo. Como 
padrão, os arquivos utilizados como Adapter (célula de uma lista) começam com 
a palavra 'adapter_', portanto, o nome do arquivo é adapter_tarefa.xml. 
● /res/layout/adapter_tarefa.xml 
<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout 
xmlns:android="http://schemas.android.com/apk/res/android" 
 android:layout_width="match_parent" 
 android:layout_height="wrap_content" 
 android:orientation="vertical" 
 android:padding="16dp"> 
 
 <TextView 
 android:id="@+id/tId" 
 android:layout_width="wrap_content" 
 android:layout_height="wrap_content" 
 android:textSize="20sp" /> 
 
 <TextView 
 android:id="@+id/tTitulo" 
 android:layout_width="wrap_content" 
 android:layout_height="wrap_content" 
 android:textSize="20sp" /> 
</LinearLayout> 
O layout do nosso exemplo é bem simples e contém um TextView onde 
vamos mostrar o ID (identificador) da tarefa, que no nosso caso será o número 
dela, como 1, 2, ou 3. O outro TextView é para mostrar o título da tarefa. Como 
podemos ver, o LinearLayout raiz foi configurado como vertical, assim, os textos 
vão ficar um embaixo do outro, conforme a figura com o layout da lista que 
mostramos anteriormente. 
Essa parte foi fácil, agora vamos para o código da classe do adapter. Para 
facilitar a explicação, o código está comentado com algumas cores. A classe 
TarefaAdapter recebe como parâmetro no construtor a lista de tarefas 
(List<Tarefa>) e é filha de RecyclerView.Adapter<TarefasViewHolder>. A classe 
TarefasViewHolder está declarada lá em baixo no mesmo arquivo. Precisamos 
 
 
criá-la apenas para fechar o contrato com o adapter, e dentro dela ficará 
armazenado a view da célula, que é o layout XML do adapter. 
package br.com.livroandroid.tarefas.adapter 
 
import android.view.LayoutInflater 
import android.view.View 
import android.view.ViewGroup 
import androidx.recyclerview.widget.RecyclerView 
import com.example.hellotarefas.Tarefa 
import com.example.hellotarefas.R 
import kotlinx.android.synthetic.main.adapter_tarefa.view.* 
 
// Define o construtor que recebe a lista de tarefas 
class TarefaAdapter(val tarefas: List<Tarefa>) : 
 RecyclerView.Adapter<TarefasViewHolder>() { 
 
 // (1) Retorna a quantidade de tarefas na lista 
 override fun getItemCount(): Int { 
 return this.tarefas.size 
 } 
 // (2) Infla o layout do adapter e retorna o ViewHolder 
 override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): 
TarefasViewHolder { 
 // Infla a view do adapter 
 val inflater = LayoutInflater.from(parent.context) 
 val view = inflater.inflate(R.layout.adapter_tarefa, parent, 
false) 
 val holder = TarefasViewHolder(view) 
 return holder 
 } 
 // (3) Faz o bind para atualizar o valor das views com os dados do 
Tarefa 
 override fun onBindViewHolder(holder: TarefasViewHolder, position: 
Int) { 
 // Recupera o objeto 
 val tarefa = tarefas[position] 
 // Recupera a view da linha 
 val view = holder.itemView 
 // Atualiza os dados nas views 
 view.tId.text = tarefa.id.toString() 
 view.tTitulo.text = tarefa.titulo 
 } 
} 
 
// Subclasse obrigatória de RecyclerView.ViewHolder 
// Ela é usada como tipo genérico ao criar a classe de adapter 
class TarefasViewHolder(view: View) : RecyclerView.ViewHolder(view) 
 
No código, você pode ver três métodos marcados em laranja. Esses 
métodos são obrigatórios e temos a explicação deles a seguir: 
1. getItemCount(): este método deve retornar a quantidade de linhas da 
lista, ou seja, do RecyclerView. A implementação desse método é simples 
e, geralmente, ele apenas retorna a quantidade de elementos contidos no 
array, ou lista de objetos, que foi passado como parâmetro para o 
 
 
construtor da classe do Adapter. No nosso caso, a lista contém três 
elementos. 
override fun getItemCount(): Int { 
 return this.tarefas.size 
} 
2. onCreateViewHolder(): este método deve inflar o layout XML do adapter, 
que é aquele adapter_tarefa.xml. No Android, o termo inflar um XML 
significa converter este XML para um objeto View. No código, esta linha 
faz justamente isso: 
val view = inflater.inflate(R.layout.adapter_tarefa, parent, false) 
Logo depois de inflar o XML da célula, é criado o objeto ViewHolder. 
Holder, em inglês, significa segurar, manter ou conter. Se traduzirmos, 
ViewHolder significa o objeto que "contém a view" desta célula. Veja, então, que 
ao criar o TarefasViewHolder, é passado no seu construtor o objeto view, que 
é o adapter_tarefa.xml convertido para objeto View. 
val holder = TarefasViewHolder(view) 
3. onBindViewHolder(): este é o último método que temos que implementar. 
A ideia é que o Android chame os dois primeiros métodos apenas uma 
vez, mas vai chamar o método onBindViewHolder() para o total de 
elementos na lista, que no nosso exemplo são três tarefas. 
Seguindo o raciocínio de traduzir o inglês para facilitar a explicação, a 
palavra bind significa ligação, no sentido de interligar alguma coisa a outra. 
Então, esse método onBindViewHolder() é usado para fazer a ligação entre o 
objeto Tarefa e o layout XML desta célula, lembrando que o ViewHolder é o 
objeto que “contém” este layout XML. Complicado, não é? Na prática, esse 
método vai recuperar o objeto Tarefa e vai configurar no XML da célula os 
valores desta tarefa: 
override fun onBindViewHolder(holder: TarefasViewHolder, position: 
Int) { 
 // Recupera o objeto 
 val tarefa = tarefas[position] 
 // Recupera a view da linha 
 val view = holder.itemView 
 // Atualiza os dados nas views 
 view.tId.text = tarefa.id.toString() 
 
 
 view.tTitulo.text = tarefa.titulo 
} 
Pronto! Com a classe de adapter criada, vamos atualizar o código da 
MainActivity. Veja que a lista de tarefas é passada para o construtor do adapter, 
pois ele saberá retornar aquele XML para cada célula da lista. 
package com.example.hellotarefas 
 
import androidx.appcompat.app.AppCompatActivity 
import android.os.Bundle 
import androidx.recyclerview.widget.LinearLayoutManager 
import br.com.livroandroid.tarefas.adapter.TarefaAdapter 
import kotlinx.android.synthetic.main.activity_main.* 
 
class MainActivity : AppCompatActivity() { 
 override fun onCreate(savedInstanceState: Bundle?) { 
 super.onCreate(savedInstanceState) 
 setContentView(R.layout.activity_main) 
 } 
 
 override fun onResume() { 
 super.onResume() 
 
 val tarefas = TarefaService.getTarefas() 
 recyclerView.layoutManager = LinearLayoutManager(this) 
 recyclerView.adapter = TarefaAdapter(tarefas) 
 } 
} 
Após fazer todas essas configurações,execute o projeto novamente no 
emulador e o resultado será a lista com as três tarefas, conforme mostramos 
anteriormente. 
Bom, essa foi a parte mais difícil. Os próximos exercícios serão mais 
fáceis. Até recomendamos que você prossega com todo o conteúdo da aula e 
depois fazça uma boa revisão sobre a classe do Adapter. 
Caso tenha achado difícil fazer a classe adapter, saiba que mesmo 
desenvolvedores experientes em Android utilizam a técnica do Ctrl+C + Ctrl+V 
para criar adapters, ou seja, depois que você faz um, simplesmente copia e, 
assim, para os próximos, vai apenas trocando os nomes. O adapter é aquele 
template que não muda, e logo você se acostuma. 
 
 
 
 
 
TEMA 3 – CARDVIEW + EVENTOS 
Para deixarmos o layout da lista de notas mais bonito, vamos envolver o 
layout do adapter com a classe CardView que faz parte da biblioteca do Material 
Design. 
Altere o código do do layout do adapter conforme mostrado a seguir: 
● /res/layout/adapter_tarefa.xml 
<?xml version="1.0" encoding="utf-8"?> 
<androidx.cardview.widget.CardView 
xmlns:android="http://schemas.android.com/apk/res/android" 
 android:layout_width="match_parent" 
 android:layout_height="wrap_content" 
 android:layout_margin="8dp" 
 android:foreground="?attr/selectableItemBackground"> 
 
 <LinearLayout 
 android:layout_width="match_parent" 
 android:layout_height="wrap_content" 
 android:orientation="vertical" 
 android:padding="16dp"> 
 <TextView 
 android:id="@+id/tId" 
 android:layout_width="wrap_content" 
 android:layout_height="wrap_content" 
 android:textSize="20sp" /> 
 <TextView 
 android:id="@+id/tTitulo" 
 android:layout_width="wrap_content" 
 android:layout_height="wrap_content" 
 android:textSize="20sp" /> 
 </LinearLayout> 
</androidx.cardview.widget.CardView> 
O CardView é um gerenciador de layout muito simples que cria o efeito de 
um cartão (card), deixando aquelas bordas no layout, algo que é muito comum 
hoje em dia nos aplicativos. 
 
 
 
 
 
 
 
Figura 5 – Lista de tarefas com card 
 
Crédito: Brostock/Shutterstock. 
3.1 Tratamento de eventos na lista 
Logo depois de criar a lista, com certeza o próximo passo é tratar os 
eventos de clique em cada célula. Para isso, temos que adicionar esta linha lá 
na view que é inflada do layout XML. 
view.setOnClickListener { } 
Esta linha podemos inserir lá no método onBindViewHolder() da classe 
do Adapter, conforme demonstrado abaixo: 
● TarefaAdapter.kt 
class TarefaAdapter(val tarefas: List<Tarefa>) . . . { 
 . . . 
 override fun onBindViewHolder(holder: TarefasViewHolder, position: Int) { 
 . . . 
 view.tId.text = tarefa.id.toString() 
 view.tTitulo.text = tarefa.titulo 
 . . . 
 view.setOnClickListener { } 
 } 
} 
 
 
Conforme já explicamos algumas vezes, o código que fica entre as chaves 
{ } é uma lambda, e por enquanto vamos deixar vazio. Ao executar o projeto 
novamente no emulador, você vai reparar que ao clicar em alguma célula, ela 
ficará selecionada, conforme mostra a próxima figura. 
Figura 6 – Célula selecionada ao clicar no item da lista 
 
Crédito: Brostock/Shutterstock. 
Com o evento de clique devidamente configurado na célula, vamos 
adicionar uma função de callback chamada onClick no construtor da classe do 
Adapter. Essa função vai receber como parâmetro o objeto Tarefa que foi clicado 
e não vai retornar nada, portanto, é Unit (void). 
val onClick: (Tarefa) -> Unit 
Faça a seguinte alteração no código. TarefaAdapter.kt 
class TarefaAdapter(val tarefas: List<Tarefa>, 
 val onClick: (Tarefa) -> Unit) : 
 RecyclerView.Adapter<TarefasViewHolder>() { 
 . . . 
 override fun onBindViewHolder(holder: TarefasViewHolder, position: Int) { 
 . . . 
 view.tId.text = tarefa.id.toString() 
 view.tTitulo.text = tarefa.titulo 
 . . . 
 
 
 view.setOnClickListener { onClick(tarefa) } 
 } 
} 
Pronto! Dentro do view.setOnClickListener { }, a função de callback será 
chamada passando como parâmetro a Tarefa. Isso que acabamos de fazer 
mostra como passar como parâmetro uma função, que é uma característica de 
linguagens de programação funcionais, paradigma que o Kotlin também 
implementa. 
Para finalizar o exemplo do tratamento de eventos, vamos passar como 
parâmetro uma função lambda para a classe TarefaAdapter. 
● MainActivity 
package com.example.hellotarefas 
 
import androidx.appcompat.app.AppCompatActivity 
import android.os.Bundle 
import android.widget.Toast 
import androidx.recyclerview.widget.LinearLayoutManager 
import br.com.livroandroid.tarefas.adapter.TarefaAdapter 
import kotlinx.android.synthetic.main.activity_main.* 
 
class MainActivity : AppCompatActivity() { 
 override fun onCreate(savedInstanceState: Bundle?) { 
 super.onCreate(savedInstanceState) 
 setContentView(R.layout.activity_main) 
 } 
 
 override fun onResume() { 
 super.onResume() 
 
 val tarefas = TarefaService.getTarefas() 
 recyclerView.layoutManager = LinearLayoutManager(this) 
 recyclerView.adapter = TarefaAdapter(tarefas) { 
 onClickTarefa(it) 
 } 
 } 
 
 private fun onClickTarefa(t: Tarefa) { 
 Toast.makeText(this,"Tarefa: ${t.titulo}", 
Toast.LENGTH_SHORT).show() 
 } 
} 
Pronto. Feito isso, ao clicar em uma célula da lista, o método 
onClickTarefa(tarefa) será chamado. No entanto, observe que há uma 
novidade: o Toast. 
Utilizar o Toast não requer prática nem habilidade, pois ele apenas mostra 
um breve alerta para o usuário. No Android, o Toast é aquele alerta rápido com 
um formato de balão, e que fica visível por poucos segundos. Ao criar o Toast, 
 
 
você pode informar o tempo com as constantes LENGTH_SHORT (2 segundos) 
ou LENGTH_LONG (5 segundos) 
Figura 7 – Alerta com Toast 
 
Crédito: Brostock/Shutterstock. 
Apesar de já termos estudado lambdas, vamos revisar rapidamente como 
passar funções como parâmetros. Como a classe TarefaAdapter recebe uma 
lista de objetos do tipo Tarefa e a função, podemos passar diretamente a função 
como parâmetro com a seguinte sintaxe: 
recyclerView.adapter = TarefaAdapter(tarefas, ::onClickTarefa) 
Naturalmente, a função onClickTarefa(tarefa) precisa existir e ter os 
mesmos parâmetros esperados, que neste caso é o objeto Tarefa. 
Outra maneira é usando a sintaxe da lambda, abrindo e fechando chaves 
{}. 
recyclerView.adapter = TarefaAdapter(tarefas, { 
 tarefa -> onClickTarefa(tarefa) 
}) 
 
 
 
Neste caso, aquela variável tarefa seguida da seta pode ser omitida, pois 
no Kotlin podemos usar o parâmetro it, que é implícito. Naturalmente, a variável 
it só pode ser usado se a função possui apenas um único parâmetro, que é este 
caso. 
recyclerView.adapter = TarefaAdapter(tarefas, { 
 onClickTarefa(it) 
}) 
Por fim, veja no código anterior que a lambda ficou dentro dos parênteses, 
pois ela é um argumento como outro qualquer que é enviado no construtor da 
classe TarefaAdapter. Mas, como também já estudamos, sempre que a lambda 
for o último argumento, podemos abrir e fechar as chaves depois dos parênteses 
com esta sintaxe: 
recyclerView.adapter = TarefaAdapter(tarefas) { 
 onClickTarefa(it) 
} 
Concluindo a explicação, esta última sintaxe é a mais adotada nos 
aplicativos e também é muito comum em outras linguagens. 
3.2 Criando uma extensão para o Toast 
Ao explicarmos, gostamos muito de passar nossa linha de raciocínio para 
você e algo que sempre temos em mente é não digitar códigos chatos e que são 
muito repetitivos. Aquele código para criar um Toast é um que com certeza 
merece ser abreviado. 
Lembra-se de quando criamos uma extensão para a activity para mostrar 
um alerta? Copie o arquivo Activity-Extensions.kt que fizemos naquele outro 
exemplo e adicione o método toast(). O método vai receber a mensagem que 
deveser exibida no alerta e o parâmetro 'duration' opcional, que por padrão 
possui o valor da constante Toast.LENGTH_SHORT. 
● Activity-Extensions.kt 
package com.example.hellotarefas.extensions 
 
import android.widget.Toast 
import androidx.appcompat.app.AlertDialog 
import androidx.appcompat.app.AppCompatActivity 
 
fun AppCompatActivity.alert(msg: String, callback: () -> Unit 
 
 
= {}) { 
 . . . 
} 
 
fun AppCompatActivity.toast(msg: String, duration: Int = 
Toast.LENGTH_SHORT) { 
 Toast.makeText(this,msg, duration).show() 
} 
Pronto! Agora, para fazer um toast, fica bem simples. Lembre-se que para 
utilizar extensões, precisamos fazer o import, mas isso o Android Studio sempre 
vai nos ajudar. 
package com.example.hellotarefas 
 
import com.example.hellotarefas.extensions.toast 
 
class MainActivity : AppCompatActivity() { 
 . . . 
 private fun onClickTarefa(t: Tarefa) { 
 toast("Tarefa: ${t.titulo}") 
 } 
} 
TEMA 4 – TELA DE DETALHES DA TAREFA 
Já aprendemos como criar a lista de tarefas, e agora vamos partir para a 
segunda parte do nosso exercício, que será implementar as seguintes 
funcionalidades: 
1. Ao clicar em uma tarefa, vamos abrir a tela de detalhes da tarefa; 
2. A tela da tarefa poderá ser utilizada para criar uma nova tarefa ou editar 
uma que já existe; 
3. Vamos adicionar um botão para criar uma nova tarefa na lista. Esse botão 
é aquele (+) na parte inferior direita da lista. 
4. Na tela de detalhes da tarefa, vamos adicionar um botão para remover a 
tarefa. Esse botão é aquele (X) na AppBar. 
Esta figura mostra o exercício completo para você já ir visualizando o nosso 
objetivo. 
 
 
 
Figura 8 – Cadastro de tarefas 
 
Crédito: Brostock/Shutterstock. 
4.1 Tela da tarefa 
O primeiro passo para criar o cadastro de tarefas é criar a tela que possui 
o formulário para inserir ou editar uma tarefa. Essa tela, como você já sabe, será 
uma nova activity, que vamos chamar de TarefaActivity. 
Crie essa activity com o wizard > New > Activity > Empty Activity. Ao 
utilizar o wizard, a activity será configurada automaticamente no arquivo de 
manifesto: 
<activity android:name=".TarefaActivity" /> 
Feito isso, vamos criar o formulário que vai conter o título da tarefa. No 
formulário, não vamos mostrar o id da tarefa, ele ficará escondido para simular 
o id do banco de dados. 
● /res/layout/activity_tarefa.xml 
<LinearLayout android:layout_width="match_parent" 
 android:layout_height="match_parent" 
 android:orientation="vertical" 
 android:padding="16dp" 
 xmlns:android="http://schemas.android.com/apk/res/android"> 
 <TextView 
 android:layout_width="wrap_content" 
 
 
 android:layout_height="wrap_content" 
 android:text="Título" /> 
 <EditText 
 android:id="@+id/tTitulo" 
 android:layout_width="match_parent" 
 android:layout_height="wrap_content" 
 /> 
 <Button 
 android:id="@+id/btSalvar" 
 android:layout_width="wrap_content" 
 android:layout_height="wrap_content" 
 android:layout_gravity="center" 
 android:text="Salvar" /> 
</LinearLayout> 
Por fim, vamos criar o código da classe TarefaActivity. Por enquanto, o 
botão Salvar ainda não fará nada. Neste momento, no método onCreate(), 
vamos ler o objeto Tarefa que será passado como parâmetro e estamos 
chamando o método setTarefa(t) para atualizar o formulário com os dados deste 
objeto. 
● TarefaActivity 
package com.example.hellotarefas 
 
import android.os.Bundle 
import androidx.appcompat.app.AppCompatActivity 
import kotlinx.android.synthetic.main.activity_tarefa.* 
 
class TarefaActivity : AppCompatActivity() { 
 override fun onCreate(savedInstanceState: Bundle?) { 
 super.onCreate(savedInstanceState) 
 setContentView(R.layout.activity_tarefa) 
 
 // Configura botão voltar e o título 
 supportActionBar?.setDisplayHomeAsUpEnabled(true) 
 supportActionBar?.title = "Tarefa" 
 
 // Recebe o objeto passado como parâmetro 
 val tarefa = intent.getSerializableExtra("tarefa") as 
Tarefa? 
 
 // Atualiza a tela com os dados da tarefa 
 setTarefa(tarefa) 
 } 
 
 private fun setTarefa(t: Tarefa?) { 
 if(t != null) { 
 tTitulo.setText(t.titulo) 
 } 
 } 
} 
 
 
 
Lembrando que nosso objetivo é que, ao clicar em alguma tarefa na lista, 
vamos abrir essa tela de detalhes e o objeto tarefa será passado como 
parâmetro. Por isso, quando criamos a classe Tarefa, fizemos ela implementar 
a interface Serializable. 
package com.example.hellotarefas 
 
import java.io.Serializable 
 
data class Tarefa( 
 var id: Int = 0, 
 var titulo: String = "" 
 
) : Serializable 
Observe que ao ler o parâmetro tarefa da intent, foi feito o casto para 
Tarefa? com a interrogação, o que indica que este objeto pode ser nulo. 
val tarefa = intent.getSerializableExtra("tarefa") as Tarefa? 
Pela regra deste aplicativo fictício, a tela com o formulário pode ser 
chamada em duas situações: 
1. Na tela inicial, o usuário clicou em alguma tarefa da lista. Neste caso, o 
app vai abrir a TarefaActivity passando como parâmetro o objeto tarefa. 
2. Na tela inicial, o usuário clicou no botão (+) para criar uma nova tarefa. 
Neste caso, o parâmetro tarefa estará nulo e por isso o objeto Tarefa? 
foi declarado com a interrogação. Na lógica da activity, no método 
setTarefa(t), precisamos verificar se a tarefa existe antes de mostrar os 
seus dados no formulário. 
Algo interessante deste exemplo e que ainda não tínhamos visto está lá 
no método onCreate() da activity: 
// Configura botão voltar e o título 
supportActionBar?.setDisplayHomeAsUpEnabled(true) 
supportActionBar?.title = "Tarefa" 
A primeira linha está habilitando o botão de voltar na App Bar (aquele do 
canto superior esquerdo), porém, o botão voltar ainda não vai funcionar, e vamos 
ver isso no próximo exemplo. A segunda linha está configurando o título na App 
Bar. 
 
 
Obsservação: você vai encontrar exemplos falando de Action Bar e 
outros de App Bar, mas podemos dizer que são sinônimos. 
4.1 Voltar para a tela anterior 
Até o momento, já podemos clicar em alguma tarefa na lista e abrir a tela 
de detalhes, mas o botão de voltar da App Bar ainda não funciona. Apenas para 
deixar bem claro, temos duas maneiras de mostrar o botão Voltar na App Bar: 
1. Adicionar o atributo parentActivityName no arquivo de manifesto, como 
fizemos no projeto em que criamos layouts para as telas de login, cadastro 
e esqueci senha. Neste caso, o Android implementa a ação de voltar 
automaticamente. 
2. Utilizar o método setDisplayHomeAsUpEnabled(true) da classe 
ActionBar. Neste caso, ainda temos que implementar o método 
onOptionsItemSelected(item) na activity (a fazer ainda). 
O primeiro jeito de fazer é mais simples, pois basta configurar o arquivo 
de manifesto, expliquei dessa maneira antes. Mas, ao fazer isso, o Android vai 
fechar todas as activities e vai dar um startActivity novamente na activity definida 
lá no atributo parentActivityName. Ou seja, a tela será recriada e pode perder 
o seu estado. 
Para manter o estado o desejado é que o botão Voltar da App Bar (lá de 
cima) tem o mesmo efeito do botão voltar nativo do Android (lá de baixo), que é 
apenas fechar a tela, desempilhando essa activity da pilha de atividades (activity 
stack). 
O código a seguir mostra como implementar o método 
onOptionsItemSelected(item), o qual é chamado sempre que um botão da App 
Bar é clicado, independentemente se é o botão de Voltar ou outra ação. 
class TarefaActivity : AppCompatActivity() { 
 . . . 
 
 override fun onOptionsItemSelected(item: MenuItem?): Boolean { 
 when (item?.itemId) { 
 android.R.id.home -> { 
 finish() 
 } 
 } 
 return super.onOptionsItemSelected(item) 
 } 
 
 
} 
 
Neste método, geralmente é feita uma comparação para ver o id do item 
de menu que foi clicado. Porpadrão, o id do botão voltar é android.R.id.home, 
conforme você viu no código. 
Observação: tenha atenção, pois no Android, temos duas ou mais 
classes R. Temos uma classe R que fica no nosso próprio projeto e contém 
acesso aos recursos que estão lá na pasta /res/, como imagens e strings com 
textos. Porém, veja que nesse caso usamos a classe android.R, isso significa 
que esta é a classe R nativa do Android. 
Para finalizar este tópico, veja novamente a figura que mostramos as telas 
do aplicativo de tarefas com o cadastro funcionando. Na tela da tarefa, vamos 
adicionar posteriormente o botão deletar (X) na App Bar. Apenas adiantando, a 
ação desse botão também será implementada dentro do método 
onOptionsItemSelected(item) que acabamos de fazer. Mas para excluir uma 
tarefa, antes precisamos criá-la, e isso vamos fazer no próximo tópico. 
4.2 FAB – Floating Action Button (+) 
Aquele botão (+) redondo que vamos colocar na lista de tarefas é 
conhecido como Floating Action Button (botão flutuante) e também faz parte dos 
padrões do Material Design. Como este é um botão flutuante, ele precisa ser 
adicionado dentro de um CoordinatorLayout, que é um layout especial do 
Material Design que consegue controlar a disposição dos elementos e inclusive 
fazer técnicas de scroll (rolagem) mais avançadas que um dia você vai estudar. 
Mas por enquanto, vamos criar o seguinte layout. 
<?xml version="1.0" encoding="utf-8"?> 
<androidx.coordinatorlayout.widget.CoordinatorLayout 
xmlns:android="http://schemas.android.com/apk/res/android" 
 android:layout_width="match_parent" 
 android:layout_height="match_parent" 
 xmlns:app="http://schemas.android.com/apk/res-auto"> 
 
 <androidx.recyclerview.widget.RecyclerView 
 android:id="@+id/recyclerView" 
 android:layout_width="match_parent" 
 android:layout_height="wrap_content" 
 /> 
 
 
 
 <com.google.android.material.floatingactionbutton.FloatingActionButton 
 android:id="@+id/fab" 
 android:layout_width="wrap_content" 
 android:layout_height="wrap_content" 
 android:layout_gravity="end|bottom" 
 app:tint="@android:color/white" 
 android:src="@android:drawable/ic_input_add" 
 android:layout_margin="16dp" /> 
 
</androidx.coordinatorlayout.widget.CoordinatorLayout> 
Conforme vimos, para adicionar o botão FAB (Floating Action Button), 
existe um XML ligeiramente grande que pode assustar no início, mas leia cada 
linha com atenção que logo você se acostuma e verá que cada linha faz sentido. 
Veja que foi configurado o id android:id="@+id/fab" para o botão, e vale 
lembrar também que é comum desenvolvedores Android falaram apenas "botão 
FAB" no lugar de Floating Action Button, pois é uma forma mais abreviada, 
simples de falar. No Material Design, um botão FAB representa a ação mais 
importante da tela e geralmente possui apenas um no layout. Por isso, sempre 
utilizarmos o id android:id="@+id/fab". Dito isso, vamos para o código: 
package com.example.hellotarefas 
 
. . . 
import kotlinx.android.synthetic.main.activity_main.* 
 
class MainActivity : AppCompatActivity() { 
 override fun onCreate(savedInstanceState: Bundle?) { 
 super.onCreate(savedInstanceState) 
 setContentView(R.layout.activity_main) 
 
 fab.setOnClickListener { onClickAddTarefa() } 
 } 
 
 private fun onClickAddTarefa() { 
 startActivity(Intent(this, TarefaActivity::class.java)) 
 } 
} 
Ao executar o projeto novamente no emulador, você verá que 
adicionamos o evento de clique no botão FAB e que ele está abrindo a activity 
com o formulário da tarefa. Ao abrir o formulário, ele estará vazio e pronto para 
salvar uma nova tarefa. 
 
 
 
TEMA 5 – SALVANDO AS TAREFAS 
Para salvar as tarefas, teremos que adicionar um método salvar(tarefa) 
na classe TarefaService, mas antes precisamos ter uma maneira de salvar essa 
tarefa. Como explicado anteriormente, vamos salvar as tarefas em uma 
HashTable que ficará em memória no aplicativo, ou seja, se você fechar e abrir 
o aplicativo, as tarefas serão perdidas. Mas, no momento, isso vai cumprir nosso 
objetivo: estudar listas e outros detalhes do Android. 
Para prosseguir, altere a classe TarefaService para ficar assim: 
import com.example.hellotarefas.Tarefa 
 
object TarefaService { 
 
 private var count = 0 
 // HashTable 
 private val tarefas = mutableMapOf<Int, Tarefa>() 
 
 init { 
 for (i in 1..3) { 
 tarefas.put(i, Tarefa(i,"Tarefa $i")) 
 count = i 
 } 
 } 
 fun save(t: Tarefa) { 
 if(t.id == 0) { 
 // Gera um id 
 t.id = ++count 
 } 
 tarefas.put(t.id, t) 
 } 
 fun remove(tarefa: Tarefa) { 
 tarefas.remove(tarefa.id) 
 } 
 fun getTarefas(): List<Tarefa> { 
 return tarefas.values.toList() 
 } 
} 
Observe que agora as tarefas ficam salvas em um Map (HashTable), cuja 
chave é um Int (id da tarefa) e o conteúdo é o objeto Tarefa. 
O método getTarefas() retorna a lista que está contida dentro deste Map. 
O método saveTarefa(t) adiciona a tarefa no Map utilizando o id. Caso o 
id não exista, significa que é uma nova tarefa, e por isso estamos incrementando 
a variável count para simular o id do banco de dados. 
O método remove(t) vai remover a tarefa do Map utilizando o seu id. 
 
 
Com isso, temos métodos para fazer a famosa operação de cadastro, 
conhecida como CRUD (Create, Read, Update and Delete). Futuramente, 
podemos até alterar a implementação dessa classe para usar banco de dados, 
como por exemplo, o SQLite. Essa é a vantagem de separar a lógica em várias 
classes e cada uma ter sua responsabilidade. 
5.1 Salvando e excluindo uma tarefa 
Para finalizar nosso cadastro, vamos mostrar o código final do exemplo. 
Apenas para sua conferência, segue o código completo da MainActivity – caso 
você tenha seguido todos os passos, já fez esse código. 
● MainActivity 
package com.example.hellotarefas 
 
import android.content.Intent 
import android.os.Bundle 
import androidx.appcompat.app.AppCompatActivity 
import androidx.recyclerview.widget.LinearLayoutManager 
import br.com.livroandroid.tarefas.adapter.TarefaAdapter 
import kotlinx.android.synthetic.main.activity_main.* 
 
class MainActivity : AppCompatActivity() { 
 override fun onCreate(savedInstanceState: Bundle?) { 
 super.onCreate(savedInstanceState) 
 setContentView(R.layout.activity_main) 
 
 fab.setOnClickListener { onClickAddTarefa() } 
 } 
 override fun onResume() { 
 super.onResume() 
 
 val tarefas = TarefaService.getTarefas() 
 recyclerView.layoutManager = LinearLayoutManager(this) 
 recyclerView.adapter = TarefaAdapter(tarefas) { 
 onClickTarefa(it) 
 } 
 } 
 private fun onClickTarefa(t: Tarefa) { 
 val intent = Intent(this, TarefaActivity::class.java) 
 intent.putExtra("tarefa",t) 
 startActivity(intent) 
 } 
 private fun onClickAddTarefa() { 
 startActivity(Intent(this, TarefaActivity::class.java)) 
 } 
} 
E o código da classe TarefaActivity vai ficar conforme mostramos a seguir 
(as partes novas estão destacadas em amarelo). 
 
 
package com.example.hellotarefas 
 
import android.os.Bundle 
import android.view.Menu 
import android.view.MenuItem 
import androidx.appcompat.app.AppCompatActivity 
import kotlinx.android.synthetic.main.activity_tarefa.* 
 
class TarefaActivity : AppCompatActivity() { 
 private var tarefa: Tarefa? = null 
 
 override fun onCreate(savedInstanceState: Bundle?) { 
 super.onCreate(savedInstanceState) 
 setContentView(R.layout.activity_tarefa) 
 
 // Configura botão voltar e o título 
 supportActionBar?.setDisplayHomeAsUpEnabled(true) 
 supportActionBar?.title = "Tarefa" 
 
 // Recebe o objeto passado como parâmetro 
 this.tarefa = intent.getSerializableExtra("tarefa") as Tarefa? 
 
 // Atualiza a tela com os dados da tarefa 
 setTarefa(tarefa)btSalvar.setOnClickListener { onClickSalvar() } 
 } 
 private fun setTarefa(tarefa: Tarefa?) { 
 if(tarefa != null) { 
 tTitulo.setText(tarefa.titulo) 
 } 
 } 
 // Cria os itens de menu na App Bar (ex: botão deletar) 
 override fun onCreateOptionsMenu(menu: Menu?): Boolean { 
 menuInflater.inflate(R.menu.menu_tarefa, menu) 
 val item = menu?.findItem(R.id.action_delete) 
 if(item != null) { 
 item.setVisible(tarefa != null) 
 } 
 return super.onCreateOptionsMenu(menu) 
 } 
 override fun onOptionsItemSelected(item: MenuItem?): Boolean { 
 when (item?.itemId) { 
 android.R.id.home -> { 
 finish() 
 } 
 R.id.action_delete -> { 
 onClickDeletar() 
 } 
 } 
 return super.onOptionsItemSelected(item) 
 } 
 private fun onClickSalvar() { 
 val tarefa = getTarefa() 
 
 
 
 TarefaService.save(tarefa) 
 
 finish() 
 } 
 private fun onClickDeletar() { 
 tarefa?.let { 
 TarefaService.remove(it) 
 finish() 
 } 
 } 
 private fun getTarefa(): Tarefa { 
 val n = this.tarefa?: Tarefa() 
 n.titulo = tTitulo.text.toString() 
 return n 
 } 
} 
Esperamos que a maior parte desse código seja tranquila para você, pois 
já fizemos um exemplo parecido de cadastro nas primeiras aulas. Então, vamos 
ao que é mais importante. 
Primeiramente, o método onCreateOptionsMenu(menu) é responsável 
por configurar os botões que vão aparecer na App Bar, e para isso, temos que 
criar outro arquivo XML, que vai conter essas ações. Crie uma pasta menu 
dentro da pasta res e crie o arquivo menu_tarefa.xml conforme indicado na 
figura a seguir: 
Figura 9 – Arquivo para criar um menu 
 
 
 
 
● menu_tarefa.xml 
<menu xmlns:android="http://schemas.android.com/apk/res/android" 
 xmlns:app="http://schemas.android.com/apk/res-auto"> 
 <item 
 android:id="@+id/action_delete" 
 app:showAsAction="always" 
 android:icon="@android:drawable/ic_delete" /> 
</menu> 
O XML de menu contém os itens de menu que vão aparecer na App Bar, 
que no nosso caso é apenas o botão de deletar. A figura do botão deixamos com 
aquele ícone de (X) padrão do Android e o id foi configurado como 
action_delete. Esse id é usado para tratar o evento de quando o usuário tocar 
neste item de menu lá no método onOptionsItemSelected(item). 
R.id.action_delete -> { 
 onClickDeletar() 
} 
Outro ponto importante de código: veja que o objeto Tarefa foi deixado 
como atributo da classe, pois precisamos acessar ele dentro dos métodos 
onClickSalvar() e onClickDeletar(), assim, esse objeto possui um escopo 
global dentro da classe. 
private var tarefa: Tarefa? = null 
Por isso, lá no método onCreate(bundle), estamos atribuindo o objeto 
tarefa para este atributo e não mais uma variável local, observe o 'this.tarefa': 
this.tarefa = intent.getSerializableExtra("tarefa") as Tarefa? 
Dito isso, existem duas lógicas pequenas dentro dos métodos de salvar e 
deletar. 
No método onClickSalvar(), é utilizado o operador Elvis explicado na aula 
de Kotlin para criar o objeto tarefa. O objetivo é utilizar o objeto tarefa se ele já 
existe para atualizar os dados, ou criar uma nova instância do objeto caso ele 
não exista. Isso é feito nesta linha: 
val n = this.tarefa?: Tarefa() 
 
 
No caso da atualização da tarefa, isso é importante, pois preservamos a 
mesma instância do objeto que foi passado como parâmetro para a activity e, 
portanto, é uma tarefa que já possui id. 
No método onClickDeletar(), estamos usando a palavra reservada let do 
Kotlin que ainda não tínhamos estudado. 
private fun onClickDeletar() { 
 tarefa?.let { 
 TarefaService.remove(it) 
 finish() 
 } 
} 
O let é utilizado porque o objeto Tarefa? foi declarado com a interrogação 
ao criar o atributo de classe e, portanto, pode ser nulo. A expressão entre chaves 
do let só vai executar caso esse objeto não seja nulo. 
Esse código faz o mesmo que este 'if', e podemos dizer que é uma sintaxe 
mais moderna e adotada pelos desenvolvedores Kotlin. O let também está 
presente em outras linguagens como o Swift utilizado no iOS, aliás, muito do que 
estudamos aqui funciona de forma similar no iOS. Um dia, você vai perceber que 
as linguagens são todas iguais e o que importa são os conceitos, técnicas de 
programação e design patterns que você conhece, ou seja, no final, código é só 
código. 
private fun onClickDeletar() { 
 val t = this.tarefa 
 if(t != null) { 
 TarefaService.remove(t) 
 finish() 
 } 
} 
FINALIZANDO 
Nesta aula, aprendemos a criar listas com os componentes RecyclerView 
e CardView, e fizermos um exercício de como criar um formulário de cadastro. 
 
 
 
REFERÊNCIAS 
LECHETA, R. Android Essencial com Kotlin. 2. ed. 2018.