LinuxParty

La creación de menús adecuados para su aplicación es vital para crear una buena experiencia de usuario. Desarrollo para aplicaciones Android: Cómo crear opciones del menú. y también en la adición de elementos mediante programación. En este tutorial, vamos a ver los menús contextuales - menús que se refieren a una parte específica de la vista.

A partir de Android 3.0, hay dos tipos de menú contextuales: Los menús que flotan a la vieja usanza, que flotan en la pantalla, anclados al elemento activo; y el modo de acción contextual (Android 3.0 o superior), en el que aparece una Barra de Acción Contextual (Contextual Action Bar, por sus siglas en inglés) (CAB) en la parte superior de la pantalla. El CAB es ahora la forma preferida de proporcionar un menú contextual, pero si su código es compatible con Android 2.3 o una versión anterior, también debe proporcionar una versión flotante a recuperar. Vamos a cubrir las dos opciones y también buscaremos la forma de incluir el código.

Vamos a utilizar el mismo código GridView básico como en el último tutorial, y nuestra entrada en el menú contextual se utilizará el código del tutorial GridView, que dispara una URL asociada cuando se hace click sobre la imagen.

Menús Flotantes

Vamos a empezar con el menú contextual flotante que vamos a usar para los dispositivos que ejecutan una versión anterior a la API. 11 En primer lugar, vamos a crear nuestro menú XML, en res/menu/grid_element_menu.xml :

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android" >
    <item 
         android:id="@+id/showUrl"
         android:title="@string/showUrl_title"/>
</menu>

A continuación, lo controlamos con el código GridViewTestActivity. Tenemos que añadir una llamada a registrar los "grid items" o "elementos de la cuadrícula" para el menú contextual, e implementamos onCreateContextMenu() :

protected void onCreate(Bundle savedInstanceState) {
 // as before
 gridview.setAdapter(gridadapter);
 registerForContextMenu(gridview);
 // rest as before
}
public void onCreateContextMenu(ContextMenu menu, View v,
                                ContextMenuInfo menuInfo) {
  super.onCreateContextMenu(menu, v, menuInfo);
  MenuInflater inflater = getMenuInflater();
  inflater.inflate(R.menu.grid_element_menu, menu);
}

registerForContextMenu() asocia las vistas proporcionadas View ( gridview ) con un menú contextual. Si la vista es GridView o ListView, registra todos sus artículos para el mismo menú contextual. Para otras vistas, usted tendría que registrarse en cada vista para su propio menú contextual individual.

onCreateContextMenu() funciona exactamente de la misma manera que como el último de tutorial onCreateOptionsMenu() , inflando el menú de XML.

Por último, con el fin de hacer lo correcto cuando el usuario hace clic en un elemento de menú, necesitamos implementar onContextItemSelected() :

public boolean onContextItemSelected(MenuItem item) {
  AdapterContextMenuInfo info = (AdapterContextMenuInfo) item.getMenuInfo();
  switch (item.getItemId()) {
    case R.id.showUrl:
      Intent i = new Intent(Intent.ACTION_VIEW);
      i.setData(Uri.parse(gridadapter.getItem(info.position).
                          getImageUrlString()));
      startActivity(i);
      return true;
    default:
      return super.onContextItemSelected(item);
  }
}

Aquí sólo tenemos una opción de menú hasta ahora, pero añadiremos más mediante el uso de una sentencia switch. Esto también permite la entrega de los elementos del menú hasta una superclase.

Compilar y ejecutar, y verás el menú flotante cuando haga clic en un elemento del menú flotante android

Menú de acciones contextuales

Pasando desde el menú contextual flotante a la ahora preferida barra de acción contextual (CAB). Hay dos formas de crear una CAB. Si desea adjuntar el CAB a una vista simple específica, puede utilizar ActionMode.Callback. (Esto se discute en detalle en los documentos de los menús de Android) Sin embargo, esto no funciona tan bien con un ListView o GridView. Para aquellos, es mejor implementar un MultiChoiceModeListener. Esto permite al usuario escoger varios elementos y luego aplicar una única opción para ellos. Aquí sin embargo, sólo estamos aplicando nuestra elección a un solo tema, para demostrar la interfaz. Al crear su aplicación, considere cuidadosamente qué menús usar y qué circunstancias son mejores para crear la mejor experiencia de usuario.

El MultiChoiceModeListener tiene este aspecto (en GridViewTestActivity):

private MultiChoiceModeListener modeListener = new MultiChoiceModeListener() {
    	
  int itemSelectedPosition; 
  public boolean onCreateActionMode(ActionMode mode, Menu menu) {
    MenuInflater inflater = mode.getMenuInflater();
    inflater.inflate(R.menu.grid_element_menu, menu);
    return true;
  }
        
  public void onItemCheckedStateChanged(ActionMode mode, int position,
                                        long id, boolean checked) {
    itemSelectedPosition = position;
  }
  public boolean onPrepareActionMode(ActionMode mode, Menu menu) {
 	// Used for updates to CAB after invalidate() request
    return false; 
  }
  public boolean onActionItemClicked(ActionMode mode, MenuItem item) {
    switch (item.getItemId()) {
      case R.id.showUrl:
        Intent i = new Intent(Intent.ACTION_VIEW);
        i.setData(Uri.parse(gridadapter.getItem(itemSelectedPosition).
                            getImageUrlString()));
       	startActivity(i);
       	mode.finish();
        return true;
      default:
        return false;
    }
  }
  public void onDestroyActionMode(ActionMode mode) {
    // do nothing
  }
        
};

Si se comparas este código con el menú contextual flotante o el menú de opciones, verás una gran cantidad de similitudes. Inflar el menú cuando se creó por primera vez, y onActionItemClicked() una vez más tiene el código switch que hemos visto antes. Esta vez, sin embargo tenemos que obtener la posición del elemento seleccionado desde otro método, onItemCheckedStateChanged(). Tenga en cuenta que tan sólo tenemos un único int para almacenar la posición de elemento en, cada vez que se selecciona un elemento o no seleccionado, este int será sobrescrito. Esto significa que sólo enviamos siempre un solo URL (del tema hecho clic más reciente) con la Intención. Si quisiéramos ser capaz de actuar en varios elementos (por ejemplo, para eliminarlos, o para compartir con todos ellos), necesitaríamos hacer un seguimiento de todos los elementos seleccionados.

Después de haber creado el MultiChoiceModeListener, sólo toma dos líneas  configurarlo en GridViewTestActivity:

protected void onCreate(Bundle savedInstanceState) {
  // as before
  gridview.setChoiceMode(GridView.CHOICE_MODE_MULTIPLE_MODAL);
  gridview.setMultiChoiceModeListener(modeListener);
}

Compilar y ejecutar, y un click producirá el CAB.

También puede utilizar la ActionMode para hacer cambios en la barra de acción contextual. Por ejemplo, puede establecer un título o subtítulo de encargo:

public boolean onCreateActionMode(ActionMode mode, Menu menu) {
  // as before
  mode.setTitle("Action Bar!");
  mode.setSubtitle("Subtitle");
  return true;
}

Esta captura de pantalla muestra donde aparecerán. Consulte la documentación ActionMode para otras opciones.

Otra de las mejoras en el código sería para cambiar el color de fondo de cualquier elemento seleccionado, o para configurar una casilla de verificación, para mostrar qué elemento (s) han sido seleccionados. Manejo de repliegue

Si se codifican tanto el menú flotante y el CAB, y ejecutarlo en un dispositivo Android corriendo API 11 o superior, el menú flotante será ignorada en favor de la CAB, que ahora es la opción preferida para los menús contextuales. Para hacer su carrera de código usando el menú flotante, en las versiones anteriores de la API, así, puede codificar una verificación de la API:

protected void onCreate(Bundle savedInstanceState) {
  // as before
  // next line replaces setChoiceMode() and setMultiChoice..() lines
  setUpContextualActionBar(); 
}
private void setUpContextualActionBar() {
  if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.HONEYCOMB) {
    gridview.setChoiceMode(GridView.CHOICE_MODE_MULTIPLE_MODAL);
    gridview.setMultiChoiceModeListener(new MultiChoiceModeListener() {
      // code to set up MultiChoiceModeListener as before
  });
  }
}

Usted también necesitará añadir una nota al comienzo de la clase, para suprimir las advertencias de compatibilidad de la API y de permitir que el código para compilar:

@SuppressLint("NewApi") public class GridViewTestActivity extends Activity 

Sólo debe hacer esto si usted está muy seguro de que usted ha envuelto toda su nuevo código de API en su caso if las cláusulas o de lo contrario lo protegían. Para más información sobre el apoyo a múltiples plataformas y API, consulte la documentación de Android.

Para más de esta serie, véase:

Desarrollo para aplicaciones Android: Cómo crear opciones del menú.