Adicionar botões ao app

Teste o Compose
O Jetpack Compose é o kit de ferramentas de interface recomendado para Android. Aprenda a adicionar componentes no Compose.

Um botão consiste em um texto, um ícone ou ambos que comunica a ação que ocorre quando o usuário toca nele.

É possível criar um botão no layout de três maneiras, dependendo se você quer um botão com texto, um ícone ou ambos:

  
  <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
      xmlns:app="http://schemas.android.com/apk/res-auto"
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      android:paddingLeft="16dp"
      android:paddingRight="16dp"
      android:orientation="vertical" >
  
      <Button
          android:id="@+id/supabutton"
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:text="I'm a button" />
  
      <ImageButton
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:contentDescription="A tiny Android icon"
          android:src="@drawable/baseline_android_24"
          app:tint="#ff0000" />
  
      <Button
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:drawableStart="@drawable/baseline_android_24"
          android:drawablePadding="4dp"
          android:drawableTint="#ff0000"
          android:text="I'm a button with an icon" />
  </LinearLayout>

O código anterior gera algo assim:

Uma imagem mostrando três tipos de botões
Figura 1. Três estilos de botões.

Responder a eventos de clique

Quando o usuário toca em um botão, o objeto Button recebe um evento de clique.

Para declarar o manipulador de eventos de maneira programática, crie um objeto View.OnClickListener e o atribua ao botão chamando setOnClickListener(View.OnClickListener), como no exemplo a seguir:

Kotlin

findViewById<Button>(R.id.supabutton)
  .setOnClickListener {
      Log.d("BUTTONS", "User tapped the Supabutton")
  }

Java

Button button = (Button) findViewById(R.id.supabutton);
button.setOnClickListener(new View.OnClickListener() {
    public void onClick(View v) {
      Log.d("BUTTONS", "User tapped the Supabutton");
    }
});

Definir o estilo do botão

A aparência do botão (a imagem de plano de fundo e a fonte) varia de acordo com o dispositivo, porque dispositivos de fabricantes diferentes geralmente têm estilos padrão distintos para controles de entrada.

Para personalizar botões individuais com um plano de fundo diferente, especifique o atributo android:background com um drawable ou um recurso de cor. Como alternativa, você pode aplicar um estilo ao botão, que funciona de maneira semelhante aos estilos HTML para definir várias propriedades de estilo, como plano de fundo, fonte e tamanho. Para saber mais sobre como aplicar estilos, consulte Estilos e temas.

Botão sem bordas

Um design que pode ser útil é o de um botão "sem bordas". Os botões sem borda são parecidos com botões básicos, exceto pelo fato de não terem bordas nem plano de fundo, mas ainda mudarem a aparência em estados diferentes, como ao ser tocado.

Para criar um botão sem bordas, aplique o estilo borderlessButtonStyle a ele, como no exemplo a seguir:

<Button
  android:id="@+id/supabutton"
  style="?android:attr/borderlessButtonStyle"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:text="I'm a button" />

Plano de fundo personalizado

Se você quiser realmente redefinir a aparência do seu botão, é possível especificar um plano de fundo personalizado. No entanto, em vez de fornecer um simples bitmap ou uma cor, o plano de fundo precisa ser um recurso de lista de estados que muda de aparência dependendo do estado atual do botão.

Você pode definir a lista de estados em um arquivo XML que defina três imagens ou cores a serem usadas para os diferentes estados de botão.

Para criar um drawable de lista de estados para o plano de fundo do botão, faça o seguinte:

  1. Crie três bitmaps para o plano de fundo do botão que representem os estados padrão, tocado e focado. Para garantir que suas imagens caibam em botões de vários tamanhos, crie os bitmaps como 9-patch (link em inglês).
  2. Coloque os bitmaps no diretório res/drawable/ do projeto. Nomeie cada bitmap para refletir o estado do botão que ele representa, como button_default.9.png, button_pressed.9.png e button_focused.9.png.
  3. Crie um novo arquivo XML no diretório res/drawable/. Dê um nome como button_custom.xml. Insira o XML como o seguinte:
    <?xml version="1.0" encoding="utf-8"?>
    <selector xmlns:android="http://schemas.android.com/apk/res/android">
        <item android:drawable="@drawable/button_pressed"
              android:state_pressed="true" />
        <item android:drawable="@drawable/button_focused"
              android:state_focused="true" />
        <item android:drawable="@drawable/button_default" />
    </selector>
    

    Isso define um único recurso drawable que muda a imagem com base no estado atual do botão.

    • O primeiro <item> define o bitmap a ser usado quando o botão for tocado (ativado).
    • O segundo <item> define o bitmap a ser usado quando o botão estiver em foco, por exemplo, quando o botão for destacado usando o trackball ou o botão direcional.
    • O terceiro <item> define o bitmap a ser usado quando o botão estiver no estado padrão, sem toque nem foco.

    Esse arquivo XML representa um único recurso drawable. Quando referenciada por um Button para o plano de fundo, a imagem exibida muda com base no estado do botão.

  4. Aplique o arquivo XML drawable como plano de fundo do botão:
    <Button
        android:id="@+id/button_send"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/button_send"
        android:onClick="sendMessage"
        android:background="@drawable/button_custom"  />
    

Para saber mais sobre essa sintaxe XML, incluindo como definir um botão desativado, passado o cursor sobre ele ou em outro estado, leia sobre StateListDrawable.