Customizando botões

Olá,

No post de hoje vou mostrar como customizar a aparência dos botões em aplicativos feitos para Android.

É um recurso bem simples de implementar e dá a sua aplicação uma aparência mais bonita e atrativa aos usuários. Como aplicativo de exemplo disponibilizei uma calculadora, como a apresentada na imagem:

Os arquivos de estilos são arquivos XML e podem ser criados na pasta drawable do aplicativo. Abaixo, peguei um dos arquivos do projeto para analisarmos:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" >
    <corners
        android:radius="10dp"
        />
    <solid
        android:color="@android:color/holo_red_light"
        />
    <stroke
        android:width="1dp"
        android:color="@android:color/background_light"
        />
</shape>

Como você pode verificar, o arquivo que será utilizado como background para customizar a aparência do botão monta um shape (forma geométrica) que nesse exemplo, é um retângulo. No elemento <corners /> usamos propriedade android:radius para definir o valor de arredondamento dos cantos do retângulo, em <solid /> definimos a cor do fundo por meio da propriedade android:color e finalmente em <stroke /> definimos a espessura da borda: android:width e a cor da borda: android:color.

Feito isso, o próximo passo é passar o arquivo para propriedade background do componente Button:

<Button
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:text="@string/clear_all"
    android:id="@+id/button14"
    android:layout_weight="1"
    android:textSize="@dimen/font_size"
    android:background="@drawable/button_cca"
    android:layout_margin="3dp"
    android:onClick="clearAll"/>

Outras propriedades podem ser alteradas dentro do arquivo XML do shape e existem inclusive, vários sites como o http://angrytools.com/android/button/ onde você pode ir alterando estas propriedades, visualizar o resultado e no final copiar o código e colar no seu projeto.

Baixe a calculadora e confira a pasta drawable do projeto.

É uma calculadora bem simples mas muito funcional. Analise o código, faça alterações na aparência e nas funcionalidades deixando-a do seu gosto. Compile para o emulador ou para o celular para conferir o resultado.

Hoje é isso, até o próximo post.