Linearlayout Android com estilo de cards

Postado em por Wolmir Cezer Garbin em Android | 74 Visualizações
Última atualização em:

Com o material designer do Android surgiram algumas opções bastante interessantes para o desenvolvimento de interfaces visuais no Android

Linearlayout Android com estilo de cards

Uma destas opções são os cards. Para utilizar cards em seu projeto, você precisa adicionar bibliotecas de compatibilidade além de uma biblioteca específica para cards. Neste tutorial apresentaremos uma alternativa simples para simular um card usando o LinearLayout e estilos personalizados.

A primeira coisa a ser feita, é criar um arquivo na pasta drawable do seu projeto com o nome linearlayout_card_shadow.xml e adicionar o conteúdo conforme segue abaixo:

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
   <item>
       <shape android:shape="rectangle">
           <solid android:color="#CABBBBBB"/>
           <corners android:radius="2dp" />
       </shape>
   </item>
 
   <item
       android:left="0dp"
       android:right="0dp"
       android:top="0dp"
       android:bottom="2dp">
       <shape android:shape="rectangle">
           <solid android:color="@android:color/white"/>
           <corners android:radius="2dp" />
       </shape>
   </item>
</layer-list>

Após criado este arquivo, fica muito simples utilizar como background no LinearLayout que fará o papel de card, fazendo e adicionando o conteúdo dentro do elemento, conforme segue o exemplo abaixo:

<LinearLayout
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:orientation="vertical"
  android:paddingRight="16dp"
  android:paddingTop="5dp"
  android:paddingLeft="16dp"
  android:paddingBottom="16dp">
 
    <TextView
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:text="Gostou do Aplicativo?"
  android:textColor="#999"
  android:paddingBottom="10dp"
  android:textStyle="bold"
  android:textSize="16sp"
  android:gravity="center" />
 
<TextView
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:text="Ajude a melhorar para fazer mais para você!"
  android:textColor="#999"
  android:gravity="center"
  android:layout_marginBottom="5dp"/>
 
</LinearLayout>

Como exemplo de utilização deste código, podemos falar sobre a modal de sobre encontrada nos Aplicativos da Garbo Software, onde foi criada uma divisão para facilitar a visualização das opções, deixando a visualização mais agradável e organizada.

A imagem abaixo foi extraída do aplicativo Calcular Horas Extras disponível gratuitamente na Google Play.

Calcular Horas Extras

Note que este estilo foi utilizado nesta aplicação levando em conta que é gerada por um framework que precisa ser compatível com versões anteriores ao desenvolvimento. Indicamos que em projetos mais atuais utilize a própria api disponibilizada pelo Google.

Esta é uma maneira simples de simular cards no Android e funciona em qualquer versão para deixar suas interfaces mais interessantes aos olhos dos usuários com o mínimo de esforço de programação.

Qualquer dúvida deixe nos comentários.

Wolmir Cezer Garbin

Wolmir Cezer Garbin


Sou formado em Desenvolvimento de Sistemas para Internet pela faculdade Mater Dei e Pós graduado em Desenvolvimento de sistemas em Java pela UTFPR. Trabalho a mais de 9 anos com desenvolvimento em Java, Android e Web utilizando as principais tecnologias do mercado. Atuo como professor na faculdade Mater Dei, programador na Garbo Software e criador do Receitas de Código.

Ver mais

Posts relacionados


É comum em um aplicativo desenvolvido para android precisam persistir dados e o SQLite é a escolha natural para Banco de Dados em Aplicações Android.

Ler mais

Code Conference

Esta é uma conferência de código realizada na cidade de Pato Branco para dissiminar tendências e informações sobre programação e novas tecnológias

Veja mais sobre o Code Conference

Publique seu post no Receitas de Código

Agora você pode publicar seu post no Receitas de Código e compartilhar seu conhecimento com muitas pessoas!

Quero publicar