Crear una ActionBar en Android

Hey! Hoy veremos como agregar una barra de acción o ActionBar en Android a todas nuestras aplicaciones que desarrollaremos de hoy en adelante, ¿No sabes que es una actionBar? Simple! Ana actionbar es una barra superior que aparece en toda actividad (pantalla) de algunas aplicaciones android la cual muestra el titulo de la aplicación, iconos y acciones que se pueden realizar dentro de esta pantalla, vistas adicionales y otros elementos interactivos. Una ActionBar en android le da un toque de profesionalidad a toda aplicación, hoy en día las mejores aplicaciones tienen esta barra y hoy veremos como agregar una actionbar en android a nuestro proyecto móvil, ¿te animas?

Un poco de conocimiento

Para quedar mas en claro lo que es una actionbar en android puedes echar un ojo a la imagen de cabecera asociada a este tutorial en la parte superior, esta barra negra con iconos que representan las acciones que el usuario puede realizar en esa pantalla y el submenu desplegable forman parte de la actionbar de esa aplicación.

Esta actionbar por defecto puede utilizarse en dispositivos con sdk 11 o superior, en caso de no contar con tal soporte simplemente aparecerá un menú con las mismas opciones que la actionbar al pulsar sobre el botón opciones del dispositivo en caso de contar con este, la actionbar se introdujo en android 3.0 por lo que si se desea utilizar esta barra en versiones anteriores se tienen dos opciones:

Utilizar el proyecto opensource Sherlock
Hacer uso de la libreria appcombat v7

En resumen para crear la actionbar en android necesitamos realizar los siguientes pasos:

Tener nuestro proyecto creado – Puedes ver como realizar nuestro primer programa en android aqui.
Crear nuestro xml con las acciones de nuestro menú en res/menu/main.xml
Tener nuestros iconos en sus respectivos folders, si haces uso de un recurso string también deberá estar bien declarado.
Sobreescribir el método onCreateOptionsMenu para hacer uso de nuestro menú.
Sobreescribir el método onOptionsItemSelected para capturar el evento de cada acción.
Ejecutar nuestro proyecto y disfrutar.

Vamos a verlo en detalle!

Añade profesionalismo a tus aplicaciones – ActionBar en Android

Una vez que tengamos algun cascaron de proyecto creado vamos a crear/editar nuestro archivo xml de menu, nos vamos a res -> menu -> main.xml

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:id="@+id/action_add"
android:icon="@drawable/ic_action_new"
android:showAsAction="ifRoom"
android:title="@string/agregar" />

<item android:id="@+id/action_remove"
android:icon="@drawable/ic_action_remove"
android:showAsAction="ifRoom"
android:title="@string/eliminar" />

<item android:id="@+id/action_search"
android:icon="@drawable/ic_action_search"
android:showAsAction="ifRoom"
android:title="@string/buscar" />

<item android:id="@+id/action_refresh"
android:icon="@drawable/ic_action_refresh"
android:showAsAction="never"
android:title="@string/refrescar" />

<item android:id="@+id/action_undo"
android:icon="@drawable/ic_action_undo"
android:showAsAction="never"
android:title="@string/deshacer" />

</menu>

Como puedes ver agregamos varios items con su respectivo id para hacer referencia a el botón en nuestro código java, nuestro icono que deberá estar en su respectivo folder, la opcion showAsAction que puede tener 2 valores:

ifRoom -> Mostrar icono si hay espacio disponible.
never -> Nunca mostrar en la actionbar (lo mostrara en el menú desplegable)

también agregamos el android:title que mostrara tal texto en caso de no caber en pantalla y ser mostrado en el menú desplegable.

Recuerda que si hiciste uso de algun recurso string deberas establecerlo en res -> values -> strings.

Ahora en nuestro código java de nuestra vista principal sobre escribimos el código de onCreateOptionsMenu para hacer uso de nuestra actionbar.

@Override
public boolean onCreateOptionsMenu(Menu menu){
getMenuInflater().inflate(R.menu.main, menu);
return true;
}

Con esto decimos que utilizaremos nuestro archivo res -> menu -> main.xml como actionbar.

También sobre escribimos el método onOptionsItemSelected para capturar los eventos de nuestros botones y mandar a realizar la acción deseada.

@Override
public boolean onOptionsItemSelected(MenuItem item){
 int id = item.getItemId();
 switch(id){
  case R.id.action_add:
    Toast.makeText(getApplicationContext(), "Agregando nuevo registro.", Toast.LENGTH_LONG).show();
    return true;
  case R.id.action_remove:
    Toast.makeText(getApplicationContext(), "Eliminando registro.", Toast.LENGTH_LONG).show();
    return true;
  case R.id.action_search:
    Toast.makeText(getApplicationContext(), "Buscando registro.", Toast.LENGTH_LONG).show();
    return true;
  case R.id.action_refresh:
     Toast.makeText(getApplicationContext(), "Refrescando registros.", Toast.LENGTH_LONG).show();
     return true;
  case R.id.action_undo:
    Toast.makeText(getApplicationContext(), "Deshaciendo ultima accion.", Toast.LENGTH_LONG).show();
    return true;
  default:
    return super.onOptionsItemSelected(item);
}
}

En mi caso únicamente muestro un mensaje flotante por medio de la clase Toast.

Resultado y conclusiones

Al ejecutar nuestro proyecto podremos ver nuestra actionbar en acción.

Si eres seguidor de este blog puedes notar que en la pasada entrega de android vimos como cambiar el icono de una aplicacion en android y ahora como crear una actionbar en android, en ambas con este icono y titulo de android y sqlite, esto es porque mas adelante realizaremos un tutorial de operaciones de base de datos en android con sqlite asi que esperalo!