La barra de acciones (ActionBar)

video[Tutorial] La barra de acciones (ActionBar)

Desde la versión 3.0, se introdujo en Android un nuevo elemento en la interfaz de usuario: la barra de acciones o ActionBar. Situada en la parte superior de la pantalla, fue creada para que el usuario tuviera una experiencia unificada a través de las distintas aplicaciones. La barra de acciones aglutina varios elementos; los más habituales son el icono de la aplicación con su nombre y los botones de acciones frecuentes. Las acciones menos utilizadas se sitúan en un menú desplegable, que se abrirá desde el botón Overflow. Si la aplicación dispone de pestañas (tabs), estas podrán situarse en la barra de acciones. También pueden añadirse otros elementos, como listas desplegables y otros tipos de widgets incrustados, como el widget de búsqueda que veremos más adelante.

En caso de disponer de menos tamaño de pantalla el sistema puede redistribuir los elementos y pasar alguna acción al menú de «Overflow». Por ejemplo, en un móvil la barra de acciones anterior se podría ver de la siguiente manera:

Existen dos clases que nos permiten añadir la barra de acciones: ActionBar y ToolBar. La clase ActionBar aparece en la versión 3.0. Por defecto la barra de acciones es incluida en todas las actividades. Si queremos que no aparezca tenemos que asignar un tema especial a la actividad. Por ejemplo Theme.AppCompat.NoActionBar o cualquiera que acabe en .NoActionBar.
La clase ToolBar aparece con la versión 5.0. Cambia el diseño de la barra de acciones para que siga las especicicaciones de Material Design. Puede usarse en veriones anteriores dado que no se incorpora al API de la versión 5.0, sino a una la librería de compatibilidad appcompat-v7. A diferencia de ActionBar, la barra de acciones no es incrustado de forma automática, si no que hay que incluirla en el layout con la etiqueta <Toolbar>. Esto nos permite situarla en la posición que queramos y nos da más opciones de configuración.

Añadir un ToolBar a la aplicación es muy sencillo. Normalmente no es necesario realizarlo si al crear un proyecto has seleccionado Basic Activity o Scrolling Activity, dado que en este caso ya se ha añadido un Toolbar. Se ha incluido el siguiente ejercicio para los casos en que partes de un proyecto donde se ha incluido un ActionBar (seleccionando Empty Activity) o en proyectos creados con versiones anteriores.

Ejercicio: Añadir una barra de acciones con Toolbar.

1. Crea un nuevo proyecto basado en Empty Activity o abre uno que en su layout no aparezca la etiqueta <Toolbar>. Ejecuta el proyecto y verifica que aparece la barra de acciones.

2. El primer paso va a ser anular la creación automática de la barra de acciones basada en ActionBar. Para eso, accede a res/values/styles.xml y cambia el tema de la aplicación por Theme.AppCompat.Ligth.NoActionBar. Verifica que al ejecutar la barra desaparece.

3. También puedes ocultar la barra de estado de Android, donde se muestran las notificaciones y la hora. Para ello añade el siguiente ítem al tema de la aplicación:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context="com.example.primerasvistas.MainActivity">
    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <item name="android:windowFullscreen">true</item>
    …

4. Añade al layout de la actividad el código siguiente dentro del contenedor raíz:

<android.support.v7.widget.Toolbar
     android:id="@+id/toolbar"
     android:layout_width="match_parent"
     android:layout_height="?attr/actionBarSize"
     android:background="?attr/colorPrimary"
     android:elevation="4dp"
     android:theme="@style/ThemeOverlay.AppCompat.ActionBar"
     app:popupTheme="@style/ThemeOverlay.AppCompat.Light"/>

Con los dos últimos atributos podemos controlar el tema aplicado al Toolbar y al menú de overflow.
5. Si lo añades dentro de un ConstraintLayout aseguraté de indicar las restricciones de posición:

   app:layout_constraintTop_toTopOf="parent"
     app:layout_constraintLeft_toLeftOf="parent"

6. Verifica que la actividad desciende de AppCompatActivity. 7. Añade en el método onCreate() el siguiente código:

Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);

setSupportActionBar(toolbar)

Has de utilizar el import android.support.v7.widget.Toolbar.
8. Comprueba que el resultado es equivalente a crear la barra de acciones de forma implícita con ActionBar.
9. Puedes situar libremente la barra de acciones dentro del layout. Trata de que aparezca en la parte inferior.

Ejercicio: Añadiendo una barra de acciones a nuestra aplicación.

1. Reemplaza el contenido del fichero res/menu/menu_main.xml por:

<menu xmlns:android="http://schemas.android.com/apk/res/android"
      xmlns:app="http://schemas.android.com/apk/res-auto"
      xmlns:tools="http://schemas.android.com/ tools"
      tools:context=".MainActivity">
   <item android:id="@+id/action_settings"
         android:title="Configuración"
         android:icon="@android:drawable/ic_menu_preferences"
         android:orderInCategory="5" 
         app:showAsAction="never"/>
   <item android:title="Acerca de..." 
         android:id="@+id/acercaDe"
         android:icon="@android:drawable/ic_menu_info_details"
         android:orderInCategory="10"
         app:showAsAction="ifRoom|withText"/>
   <item android:title="Buscar"
         android:id="@+id/menu_buscar"
         android:icon="@android:drawable/ic_menu_search"
         android:orderInCategory="115"
         app:showAsAction="always|collapseActionView"/>
</menu>

En este fichero se define los iconos y las acciones a mostrar en la barra. Las acciones que indiquen en el atributo showAsAction la palabra always se mostrarán siempre, sin importar si caben o no. El uso de estas acciones debería limitarse, lo ideal es que haya una o dos, ya que al forzar que se visualicen todas podrían verse incorrectamente. Las acciones que indiquen ifRoom se mostrarán en la barra de acciones si hay espacio disponible, y se moverán al menú de Overflow si no lo hay. En esta categoría se deberían encontrar la mayoría de las acciones. Si se indica never, la acción nunca se mostrará en la barra de acciones, sin importar el espacio disponible. En este grupo se deberían situar acciones como modificar las preferencias, que deben estar disponibles para el usuario, pero no visibles en todo momento.
Las acciones se ordenan de izquierda a derecha según lo indicado en orderInCategory, con las acciones con un número más pequeño más a la izquierda. Si no caben todas las acciones en la barra, las que tienen un número mayor se mueven al menú de Overflow.
2. Ejecuta la aplicación. Podrás ver como aparece la barra de acciones en la parte de arriba, con los botones que hemos definido.

Android Studio incorpora un editor visual de menús que nos permite crear menús sin necesidad de escribir código xml.