0

RecyclerView 102: capture cliques dentro dos itens de uma lista

#Kotlin #Android
Francisco Rasia
Francisco Rasia

A RecyclerView permite criar listas de itens com layout sofisticado e elementos interativos como checkboxes, radiobuttons e spinners. Mas você sabe como capturar as interações do usuário com esses componentes?


Esse é o segundo artigo em uma série sobre os comportamentos da RecyclerView. No primeiro artigo, explorei como podemos capturar cliques longos e curtos nos itens de uma lista.


Nesse artigo, vamos avançar na configuração da RecyclerView e aprender a capturar a interação do usuário com um elemento interno do item, adicionando métodos à uma interface Listener.


🦁O Salto do Grande Felino


A mesma interface responsável por capturar cliques nos itens da lista pode ser usada para escutar os cliques nos componentes internos. Para isso, vamos adicionar mais comportamentos, fazer a vinculação com os componentes visuais a atualizar a Activity que implementa essa interface.


1. Adicionar comportamentos à Interface


Nesse exemplo, vamos adicionar um listener que vai escutar por mudanças em um componente do tipo CheckBox:


 interface ClickItemTarefaListener {
   fun onItemClickListener(tarefa: Tarefa)
   fun onItemLongClickListener(tarefa: Tarefa)
  
// adicionando um comportamento:
  fun onItemCheckedChangeListener(tarefa: Tarefa, isChecked: Boolean, position: Int)
 
     }


Esse membro não tem corpo, como os demais membros da Interface.


2. Vincular o elemento interno do ViewHolder ao novo membro da interface:


Nesse caso estou usando ViewBinding mas funciona de maneira similar se for empregado o `findViewById()`.

init {
    binding.root.setOnClickListener {
        listener.onItemClickListener(lista[adapterPosition])
    }
    binding.root.setOnLongClickListener {
        listener.onItemLongClickListener(lista[adapterPosition])
        true
    }

// novo Listener:
    binding.itemConcluidoCbx.setOnCheckedChangeListener { _, isChecked ->
        listener.onItemCheckedChangeListener(
            lista[adapterPosition],
            isChecked, adapterPosition
        )
    }


Repare que, como estou usando um CheckBox, usei o método `setOnCheckedChangeListener { }`. O Listener deve ser compatível com o componente a que você está vinculando.

O comportamento que será invocado é a parte que fica depois do lambda - nesse caso, ele vai invocar o método `onItemCheckedChangeListener()` da interface, passando os três parâmetros que o método espera.


3. Sobrescrever o novo membro na Activity que implementa a interface


Depois de adicionar o novo membro à Activity é preciso sobrescrevê-lo, determinando o comportamento esperado.

override fun onItemCheckedChangeListener(tarefa: Tarefa, isChecked: Boolean, position: Int) {
   // faça alguma coisa com o isChecked...
}


Et voilà! Acabamos de mapear comportamentos aos cliques em um componente interno dos nossos itens.


🚀 Um exemplo prático

Vou utilizar como exemplo o projeto inspirado pelo módulo Conceitos de Navegação, Aparência e Estilo de Aplicativos Android (instrutor Igor Ferrani) no everis Kotlin Bootcamp aqui da DIO.


Você pode baixar o projeto no meu repositório ou seguir o passo-a-passo em qualquer projeto seu que empregue RecyclerView.


💻 Repositório no github: https://github.com/chicorasia/bootcamp-lista-tarefas

Use o commit 09d28b4 e a branch recyclerview .

📼 Confira o passo-a-passo no vídeo: 💊 Pílula de Kotlin - RecyclerView: interagindo com componentes (views) internos dos itens no Android com Kotlin


🏆 Conclusão

Nesse artigo nós vimos uma maneira de escutar as interações do usuário com os elementos internos de um item da RecyclerView, por meio da adição de comportamentos a uma interface Listener e sua implementação na MainActivity.


📷

Ilustração por undraw.co

0
2

Comentários (0)

Arquiteto, urbanista, desenvolvedor Java & Android e criador em chefe na chicorialabs.com.br

Brasil