¿Cómo agregar y personalizar el botón Atrás de la barra de acción en Android?

La barra de acción (a veces denominada barra de la aplicación), si existe para una actividad, estará en la parte superior del área de contenido de la actividad, generalmente directamente debajo de la barra de estado. Es una barra de menú que se encuentra en la parte superior de la pantalla de actividad en Android. Android ActionBar puede contener elementos de menú que se vuelven visibles cuando el usuario hace clic en el botón «menú». En general, una ActionBar compuesta por los siguientes cuatro componentes:

• Ícono de la aplicación: aquí se mostrará el logotipo o ícono de la marca de la aplicación
• Ver control: un espacio dedicado para mostrar el título de la aplicación. También proporciona la opción de cambiar entre vistas agregando navegación giratoria o con pestañas
• Botones de acción: aquí se pueden agregar las principales acciones de la aplicación
• Desbordamiento de acción: todas las acciones sin importancia se mostrarán como un menú

A continuación se muestra una imagen de muestra para mostrar dónde está presente la barra de acciones/barra de herramientas/barra de aplicaciones en un dispositivo Android.

La barra de acción es una barra de herramientas principal dentro de una actividad que se puede usar para mostrar un título de actividad y otros elementos interactivos. Uno de los elementos más utilizados es un botón de navegación hacia atrás . El botón Atrás se utiliza para retroceder desde la pantalla visitada previamente por el usuario. La mayoría de los dispositivos Android tienen un botón de retroceso dedicado; un botón de retroceso en la barra de acción mejora la experiencia del usuario.

Agregar botón Atrás en la barra de acción

Para crear un nuevo proyecto en Android Studio, consulte Cómo crear/iniciar un nuevo proyecto en Android Studio . No es necesario cambiar nada en el archivo activity_main.xml . El único archivo con el que tenemos que trabajar es Trabajar con el archivo MainActivity.

• Cree la variable de la barra de acción y llame a la función getSupportActionBar() en el archivo java/kotlin.
• Muestre el botón Atrás usando actionBar.setDisplayHomeAsUpEnabled (true) , esto habilitará el botón Atrás.
• Personalice el evento de retroceso en onOptionsItemSelected . Esto habilitará la función de retroceso al botón en la prensa. Consulte el siguiente código como referencia. Hemos proporcionado el código java y kotlin para MainActivity .

import android.os.Bundle;
import android.view.MenuItem;
import androidx.annotation.NonNull;
import androidx.appcompat.app.ActionBar;
import androidx.appcompat.app.AppCompatActivity;
  
public class MainActivity extends AppCompatActivity {
  
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
  
        // calling the action bar
        ActionBar actionBar = getSupportActionBar();
  
        // showing the back button in action bar
        actionBar.setDisplayHomeAsUpEnabled(true);
    }
  
    // this event will enable the back
    // function to the button on press
    @Override
    public boolean onOptionsItemSelected(@NonNull MenuItem item) {
        switch (item.getItemId()) {
            case android.R.id.home:
                this.finish();
                return true;
        }
        return super.onOptionsItemSelected(item);
    }
}

import android.os.Bundle
import android.view.MenuItem
import androidx.appcompat.app.AppCompatActivity
  
class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
          
          // calling the action bar
        var actionBar = getSupportActionBar()
          
          // showing the back button in action bar
        if (actionBar != null) {
            actionBar.setDisplayHomeAsUpEnabled(true)
        }
    }
      
    // this event will enable the back 
      // function to the button on press
    override fun onContextItemSelected(item: MenuItem): Boolean {
        when (item.itemId) {
            android.R.id.home -> {
                finish()
                return true
            }
        }
        return super.onContextItemSelected(item)
    }
}

Producción:

Personalizar el botón Atrás en la barra de acción

Podemos personalizar fácilmente el botón Atrás usando la biblioteca getSupportActionBar() y configurando el archivo dibujable usando setHomeAsUpIndicator en el archivo java/kotlin. 

// Personaliza el botón Atrás

actionBar.setHomeAsUpIndicator(R.drawable.mybutton);

El código completo se da a continuación.

import android.os.Bundle;
import android.view.MenuItem;
import androidx.annotation.NonNull;
import androidx.appcompat.app.ActionBar;
import androidx.appcompat.app.AppCompatActivity;
  
public class MainActivity extends AppCompatActivity {
  
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
  
        // calling the action bar
        ActionBar actionBar = getSupportActionBar();
  
        // Customize the back button
        actionBar.setHomeAsUpIndicator(R.drawable.mybutton);
  
        // showing the back button in action bar
        actionBar.setDisplayHomeAsUpEnabled(true);
    }
  
    // this event will enable the back
    // function to the button on press
    @Override
    public boolean onOptionsItemSelected(@NonNull MenuItem item) {
        switch (item.getItemId()) {
            case android.R.id.home:
                this.finish();
                return true;
        }
        return super.onOptionsItemSelected(item);
    }
}

import android.os.Bundle
import android.view.MenuItem
import androidx.appcompat.app.AppCompatActivity
  
class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
          
        // calling the action bar
        var actionBar = getSupportActionBar()
          
        if (actionBar != null) {
            
              // Customize the back button
            actionBar.setHomeAsUpIndicator(R.drawable.mybutton);
            
              // showing the back button in action bar
            actionBar.setDisplayHomeAsUpEnabled(true);
        }
    }
      
    // this event will enable the back 
      // function to the button on press
    override fun onContextItemSelected(item: MenuItem): Boolean {
        when (item.itemId) {
            android.R.id.home -> {
                finish()
                return true
            }
        }
        return super.onContextItemSelected(item)
    }
}

Producción: