Cómo agregar botones a tu app

Prueba el método de Compose
Jetpack Compose es el kit de herramientas de IU recomendado para Android. Aprende a agregar componentes en Compose.
Botón →

Un botón consiste en texto o un ícono, o ambos, que comunica qué acción ocurre cuando el usuario lo presiona.

Puedes crear un botón en tu diseño de una de tres maneras, según si quieres un botón con texto, un ícono o 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>

El código anterior genera algo como esto:

Una imagen que muestra tres tipos de botones
Figura 1: Tres estilos de botones.

Cómo responder a eventos de clic

Cuando el usuario presiona un botón, el Button recibe un al hacer clic.

Para declarar el controlador de eventos de forma programática, crea un View.OnClickListener objeto y asignarlo al botón llamando setOnClickListener(View.OnClickListener), como en el siguiente ejemplo:

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");
    }
});

Elige un estilo para tu botón

La apariencia de tu botón (la imagen de fondo y la fuente) varía según el dispositivo, ya que los dispositivos de distintos fabricantes suelen tener diferentes estilos predeterminados de entrada. controles de seguridad.

Para personalizar botones individuales con un fondo diferente, especifica el Atributo android:background con un elemento de diseño o un recurso de color. También puedes aplicar un estilo para el botón que funciona de manera similar a los estilos HTML para definir varias propiedades de estilo, como el fondo, la fuente y el tamaño. Para obtener más información sobre cómo aplicar estilos, consulta Estilos y temas.

Botón sin bordes

Un diseño que puede ser útil es el botón "sin bordes". Los botones sin bordes se parecen a los botones básicos salvo que no tienen bordes ni fondo, pero aun así cambian de apariencia en diferentes estados, como cuando se presiona.

Para crear un botón sin bordes, aplica el borderlessButtonStyle estilo para el botón, como en el siguiente ejemplo:

<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" />

Fondo personalizado

Si realmente quieres redefinir la apariencia de tu botón, puedes especificar un fondo personalizado. Sin embargo, en lugar de proporcionar un mapa de bits o color simple, tu fondo debe ser una lista de estados recurso que cambia la apariencia según el estado actual del botón.

Puedes definir la lista de estados en un archivo en formato XML que defina tres imágenes o colores para usar en el diferentes estados del botón.

Para crear un elemento de diseño de lista de estados para el fondo de tu botón, haz lo siguiente:

  1. Crea tres mapas de bits para el fondo del botón que representen el valor predeterminado, el presionado y el enfocado. estados de los botones. Para asegurarte de que tus imágenes se ajusten a botones de varios tamaños, crea los mapas de bits como nine-patch.
  2. Coloca los mapas de bits en el directorio res/drawable/ de tu proyecto. Nombra cada mapa de bits para reflejar el estado del botón que representa, como button_default.9.png, button_pressed.9.png y button_focused.9.png.
  3. Crea un archivo en formato XML nuevo en el directorio res/drawable/. Ponle un nombre, como button_custom.xml Inserta un XML como el siguiente: 
    <?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>

    Esto define un único recurso de elemento de diseño que cambia su imagen según el estado actual de el botón.

    • El primer <item> define el mapa de bits que se debe usar cuando se presiona el botón. (activado).
    • El segundo <item> define el mapa de bits que se debe usar cuando el botón está enfocado, como como cuando el botón se resalta con la bola de seguimiento o el mando de dirección.
    • El tercer <item> define el mapa de bits que se debe usar cuando el botón está en la configuración predeterminada. de estado, ni presionado ni enfocado.

    Este archivo en formato XML representa un único recurso de elementos de diseño. Cuando hace referencia a Button para el fondo, la imagen que se muestra cambia en función del estado del botón.

  4. Aplica el archivo en formato XML de elemento de diseño como fondo del botón: 
    <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 obtener más información sobre esta sintaxis XML, incluso sobre cómo definir un botón que está inhabilitado, haz lo siguiente: colocado el cursor sobre un elemento o en otro estado, puedes leer acerca StateListDrawable