Unlimited Plugins, WordPress themes, videos & courses! Unlimited asset downloads! From $16.50/m
Advertisement
  1. Code
  2. Android Lollipop
Code

Começando com o RecyclerView e o CardView no Android

by
Difficulty:IntermediateLength:LongLanguages:

Portuguese (Português) translation by Maurício Eduardo de Oliveira (you can also view the original English article)

Se você estiver interessado em criar um aplicativo para Android que use listas para exibir dados, o Android Lollipop apresenta dois novos widgets para facilitar sua vida, RecyclerView e CardView. Usando esses widgets, é muito fácil dar ao seu aplicativo uma aparência que esteja em conformidade com as diretrizes mencionadas na especificação do material design do Google.

Pré-requisitos

Para acompanhar, você deve usar a versão mais recente do Android Studio. Você pode obtê-lo no site do desenvolvedor Android.

1. Suporte a Versões Antigas

Até o momento, menos de 2% dos dispositivos Android executavam o Android Lollipop. No entanto, graças à  v7 Support Library, você pode usar os widgets RecyclerView e CardView em dispositivos que executam versões mais antigas do Android adicionando as seguintes linhas à seção de dependencies no arquivo build.grade do seu projeto:

2. Criando um CardView

Um CardView é um ViewGroup. Como qualquer outro ViewGroup, ele pode ser adicionado à sua Activity ou Fragment usando um arquivo XML de layout.

Para criar um CardView vazio, você teria que adicionar o seguinte código ao XML do layout, conforme mostrado no snippet a seguir:

Como um exemplo mais realista, vamos agora criar um LinearLayout e colocar um CardView dentro dele. O CardView poderia representar, por exemplo, uma pessoa e conter o seguinte:

  • um TextView para exibir o nome da pessoa
  • um TextView para exibir a idade da pessoa
  • um ImageView para exibir a foto da pessoa

É assim que o XML seria:

Se esse XML for usado como o layout de uma Activity, com os campos TextView e ImageView definidos como significativos, é assim que ele seria renderizado em um dispositivo Android:

A Stand-alone Card

3. Criando uma RecyclerView

Etapa 1: definindo-o em um layout

Usar uma instância do RecyclerView é um pouco mais complicado. No entanto, defini-lo em um arquivo XML de layout é bem simples. Você pode defini-lo em um layout da seguinte maneira:

Para obter um identificador para ele em sua Activity, use o seguinte snippet:

Se tiver certeza de que o tamanho da RecyclerView não será alterado, você poderá adicionar o seguinte para melhorar o desempenho:

Etapa 2: usando um LayoutManager

Ao contrário de um ListView, um RecyclerView precisa de um LayoutManager para gerenciar o posicionamento de seus itens. Você pode definir seu próprio LayoutManager, estendendo a classe RecyclerView.LayoutManager. No entanto, na maioria dos casos, você poderia simplesmente usar uma das subclasses do LayoutManager predefinidas:

  • LinearLayoutManager
  • GridLayoutManager
  • StaggeredGridLayoutManager

Neste tutorial, vou usar um LinearLayoutManager. Esta subclasse LayoutManager, por padrão, fará com que seu RecyclerView se pareça com um ListView.

Etapa 3: Definindo os dados

Assim como um ListView, um RecyclerView precisa de um adapter para acessar seus dados. Mas antes de criarmos um adapter, vamos criar dados com os quais possamos trabalhar. Crie uma classe simples para representar uma pessoa e, em seguida, escreva um método para inicializar um objeto List de Person:

Etapa 4: Criando um Adapter

Para criar um adapter que se possa usar no RecyclerView, você deve estender o RecyclerView.Adapter. Esse adaptador segue o padrão de design do view holder, o que significa que você define uma classe personalizada que estende RecyclerView.ViewHolder. Esse padrão minimiza o número de chamadas para o método findViewById.

Anteriormente neste tutorial, já definimos o layout XML para um CardView que representa uma pessoa. Vamos reutilizar esse layout agora. Dentro do construtor do nosso ViewHolder personalizado, inicialize as views que pertencem aos itens do nosso RecyclerView.

Em seguida, adicione um construtor ao adapter personalizado para que ele tenha um identificador para os dados que o RecyclerView exibe. Como nossos dados estão na forma de um objeto List de Person, use o seguinte código:

RecyclerView.Adapter tem três métodos abstratos que devemos substituir. Vamos começar com o método getItemCount. Isso deve retornar o número de itens presentes nos dados. Como nossos dados estão na forma de uma List, só precisamos chamar o método size no objeto List:

Em seguida, substitua o método onCreateViewHolder. Como o próprio nome sugere, esse método é chamado quando o ViewHolder personalizado precisa ser inicializado. Nós especificamos o layout que cada item do RecyclerView deve usar. Isso é feito inflando o layout usando LayoutInflater, passando a saída para o construtor do ViewHolder personalizado.

Sobrescreva o onBindViewHolder para especificar o conteúdo de cada item do RecyclerView. Esse método é muito semelhante ao método getView de um adapter de ListView. Em nosso exemplo, aqui é onde você deve definir os valores dos campos nome, idade e foto do CardView.

Finalmente, você precisa substituir o método onAttachedToRecyclerView. Por enquanto, podemos simplesmente usar a implementação da superclasse deste método como mostrado abaixo.

Etapa 5: Usando o Adapter

Agora que o adapter está pronto, inclua o seguinte código em sua Activity para inicializar e usar o adapter chamando o construtor do adapter e o método setAdapter do RecyclerView:

Etapa 6: Compilando e Executando 

Quando você executa o exemplo RecyclerView em um dispositivo Android, você deve ver algo semelhante ao seguinte resultado.

Conclusão

Neste tutorial, você aprendeu como usar os widgets CardView e RecyclerView que foram introduzidos no Android Lollipop. Você também viu exemplos de como usar esses widgets em aplicativos com Material Design. Observe que, embora um RecyclerView possa fazer quase tudo que um ListView pode, para conjuntos de dados pequenos, ainda é preferível usar um ListView, pois ele requer menos linhas de código.

Você pode consultar a Referência de Desenvolvedores do Android para obter mais informações sobre as classes CardView e RecyclerView.


Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.