Cómo utilizar la ActionBar de Sherlock en Android

Buenas, la semana pasada hable sobre como añadir a nuestros proyectos la librería de soporte de Google y la expansión de ActionBarSherlock. Esta librería está muy bien ya que nos va a permitir utilizar todo aquello que se fue implementando en HoneyComb y Ice Cream Sandwich en nuestras aplicaciones con Android 2.x.

Los que os decidáis a utilizar la librería de Sherlock, no vais a tener problemas en utilizar la librería que proporciona Google, ya que esta Sherlock contiene a la de Google.

La librería de Sherlock permite hacer bastantes cosas, los que os descargasteis e instalasteis las aplicaciones de ejemplo seguramente ya visteis algo. Tenéis a vuestra disposición Fragments, Loaders y sobre todo la Action Bar, hoy vamos a ver un ejemplo de como funciona. Yo he cogido varios ejemplos, los he simplificado, y alguna cosilla más que he buscado por internet que no encontré en la documentación y me he creado un menú. Vamos a ver como hacerlo.

Vamos a abrir un proyecto y siguiendo los pasos de la semana pasada vamos a añadir la librería ActionBarSherlock. Una vez hecho esto abriremos la activity donde queremos crear el menú y cambiamos el extends Activity por SherlockActivity o SherlockFragmentActivity, para nuestro ejemplo da igual cual escojáis.

Para que no tengáis que repetir el código del menú a través de todas vuestras activities, podéis crearos una clase que herede de activity donde tengáis el código común a todas, como puede ser este menú, y vuestras activities «de verdad», en vez de heredar de Activity, SherlockActivity o SherlockFragmenActivity que herede de esta clase. De esta forma, un cambio en el menú es muy fácil y rápido.

Bueno, vamos a ver como añadir el menú a nuestra aplicación:

public class ActivityManager extends SherlockFragmentActivity {
 
@Override
public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        getSupportActionBar().setDisplayShowCustomEnabled(true);
        shareTitle = "Titulo de lo que compartimos por defecto";
        shareUrl = "Url de lo que compartimos por defecto";
} 
  
protected void setTitle(String title){
  getSupportActionBar().setTitle(title);
}
  
protected void setSubTitle(String subtitle){
  getSupportActionBar().setSubtitle(subtitle);
}
  
private String shareTitle;
private String shareUrl;
protected void setShare(String shareTitle, String shareUrl) {
  this.shareTitle = shareTitle;
  this.shareUrl = shareUrl;
  actionProvider.setShareIntent(shareIntent(this.shareUrl, this.shareTitle));
}
 
ShareActionProvider actionProvider;
  
protected SubMenu subMenu;
 
@Override
public boolean onCreateOptionsMenu(Menu menu) {
        getSupportActionBar().setDisplayHomeAsUpEnabled(true);
  
        getSupportMenuInflater().inflate(R.menu.share_action_provider, menu);

        MenuItem actionItem = menu.findItem(R.id.menu_item_share_action_provider_action_bar);
        actionProvider = (ShareActionProvider) actionItem.getActionProvider();
        actionProvider.setShareHistoryFileName(ShareActionProvider.DEFAULT_SHARE_HISTORY_FILE_NAME);
        
        actionProvider.setShareIntent(shareIntent(shareUrl, shareTitle));
  
        subMenu = menu.addSubMenu("Opciones");
         subMenu.add("Home")
         .setOnMenuItemClickListener(new OnMenuItemClickListener() {    
    public boolean onMenuItemClick(MenuItem item) {
     //Implementar aquí la navegación necesaria
     return false;
    }
   });
          subMenu.add("Otro")
      .setOnMenuItemClickListener(new OnMenuItemClickListener() {   
    public boolean onMenuItemClick(MenuItem item) {
     //Implementar aquí la navegación necesaria
     return false;
    }
   });

        subMenu.getItem().setIcon(R.drawable.abs__ic_menu_moreoverflow_holo_light);
        subMenu.getItem().setShowAsAction(MenuItem.SHOW_AS_ACTION_IF_ROOM);


        return super.onCreateOptionsMenu(menu);
}
  
public void addSubMenu(String title, OnMenuItemClickListener l){
   subMenu.add(title)
     .setOnMenuItemClickListener(l);
}
      
@Override
public boolean onOptionsItemSelected(MenuItem item) {
  switch (item.getItemId()) {
        case android.R.id.home:            
            //Implementar aquí la navegación necesaria
            return true;               
        default:
            return super.onOptionsItemSelected(item);
        }  
    }

private Intent shareIntent(String linkShare, String titleShare){
 final Intent intent = new Intent(Intent.ACTION_SEND);
 intent.setType("text/plain");
 intent.putExtra(Intent.EXTRA_SUBJECT, titleShare);
 intent.putExtra(Intent.EXTRA_TEXT, linkShare);
 return intent;
}
}

Antes de explicar nada, si escribís este código, vais a notar que despues de añadir todos los import necesarios os dará un error en la línea donde aparece el menú R.menu.share_action_provider, esto es porque hay que crear una especie de layout para este menú. La forma de hacerlo es muy sencilla, simplemente en la carpeta res creais una subcarpeta llamada menu, y a continuación un archivo nuevo llamado share_action_provider.xml. En este archivo colocáis el siguiente código:

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:id="@+id/menu_item_share_action_provider_action_bar"
        android:showAsAction="always"
        android:title="@string/action_bar_share_with"
        android:actionProviderClass="com.actionbarsherlock.widget.ShareActionProvider" />
</menu>

Como os decía, un menú es una especie de layout donde se ponen las opciones de un menú. En este caso estamos añadiendo un widget que ya está listo y preparado en la librería ActionBarSherlock y que nos va a permitir compartir en las diferentes redes sociales. El ejemplo de la ActionBarSherlock es un poco más elaborado y comparten una imagen, podéis echarle un ojo en los ejemplos que pone a disposición de todos.

Vamos ahora a ver el código que nos quedó pendiente por explicar. Empezamos por el onCreate, en el definimos el titulo y la url de lo que compartiremos en esta activity por defecto. También accedemos por primera vez a la action bar con getSupportActionBar. En este caso únicamente le decimos que muestre la barra. Echadle un ojo a todos los métodos de getSupportActionBar, tiene muchos métodos interesantes que por espacio no vamos a comentar aquí.

Con los métodos setTitle y setSubTitle podremos setear el título de la action bar en cualquier Activity que herede de esta, y con setShare vamos a cambiar el título y el enlace de lo que queremos compartir. Para compartir se utiliza el método shareIntent, está al final de todo, le pasamos el titulo y el enlace para crear un Intent que se le pasa al widget que se encarga del resto.

El siguiente método, onCreateOptionsMenu, es un evento asociado a una activity que se encarga de construir las opciones del menú. Aquí el menú como lo conocemos en las versiones 2.x de Android desaparece y se pasan a la Action Bar. Lo primero de todo, le decimos que el icono de la aplicación sea un botón para volver hacia la pantalla principal o hacia atrás, esto luego veremos como se hace.

Después hacemos un inflate, es decir, añadimos la plantilla del menú que creamos antes a nuestro menú. Luego se inicializa nuestro objeto ShareActionProvider, y seteamos dos cosas, por un lado, la última red social donde se compartió con setShareHistoryFileName y lo que vamos a compartir con setShareIntent.

Hasta aquí ya podríamos tener un menú, ahora añadiremos alguna opción más. Nosotros lo haremos a través de un submenú. Para ello definimos subMenu y la hacemos protected para poder utilizar en las clases que hereden de esta. Añadimos opciones con subMenu.add(«titulo») y seteamos la acción que hará en el onClick, puede ser una navegación a otro sitio o una acción, aquí vais a poner lo que vosotros necesitéis. Al final de todo seteais el icono de este submenú, y como se verá, yo aquí solo quiero que se vea el icono, no el texto.

El icono que he seleccionado está incluido en la librería de ActionBarSherlock, y es el que se pone ahora en ICS en aplicaciones como GMail entre otras. Antes de poneros a buscar iconos por internet echadle un ojo a los que hay aquí.

Como no podía ser de otra forma, en cualquier aplicación siempre vais a tener excepciones y seguro que hay alguna activity que necesita alguna opción más que no son las de siempre, para ello tenéis el método addSubmenu. Con este podéis incluir cualquier otra opción con su correspondiente acción sin tener que hacer nada raro en esta clase.

El último método que os voy a explicar es el onOptionsItemSelected, desde aquí podeis controlar cuando se hace click sobre una determinada opción del menú, esto no sería necesario ya que como visteis antes al crear cada una de las opciones también seteabamos el onClick. Aún así existe una excepción, el click de la imagen de la aplicación que antes dijimos que actuaría para volver hacia la home. En la documentación no encontré como hacerlo, pero buscando en internet vi que simplemente comparando el getItemId() del item que se ha pulsado con el integer que nos da android.R.id.home deben coincidir, y es aquí cuando podemos lanzar una llamada para navegar a la home o lo que vosotros queráis.

Bueno, hasta aquí por esta semana, ahora ya es cosa vuestra el investigar que más se puede hacer con esta librería. Desde mi punto de vista es muy útil y os ahorrará bastante trabajo. Os dejo dos pantallas sacadas desde mi HTC Desire con la versión 2.2 con algunos de los ejemplos.

Bio
Latest Posts

Daniel Ferrer Delgado

Técnico en Administración de Sistemas y Desarrollo de Aplicaciones. Amigo de sus amigos, y una mente inquieta que no puede dejar un ordenador de lado porque necesita programar aplicaciones Android o aplicaciones en general, además de páginas web. Nuestro programador de cabecera y espero que también el vuestro.