31: Android: barra de acciones (ActionBar)

-

Barra de acciones (ActionBar)

Por defecto, las aplicaciones Android muestran una barra donde se pueden añadir acciones.

 
En el caso de disponer de menos tamaño de pantalla, el sistema puede redestribuir los elementos y pasar alguna accioón al menu de "overflow" (tres puntos de la parte superior derecha en la imagen).

Añadir un menú


Para añadir un menú, pulsamos botón derecho del ratón sobre la carpeta "res" y seleccionamos "Android resource file".

En el formulario que aparece a continuación, escribimos un nombre para el archivo (campo "File name"), por ejemplo "menu.xml", y en el 2º campo "Resource type" seleccionamos "Menu". Después pulsamo "OK".

A continuación, en la carpeta "res"se habrá creado un nueva carpeta "menu", y dentro de ella hayaremos el archivo "menu.xml".


Si abrimos el archivo "menu.xml" encontraremos una interfaz de edición para el editar el menú. Como se puede ver, la interfaz tiene dos vistas "Text" y "Design" del mismo modo que ocurre cuando editamos "layouts". Es decir, tenemos también una paleta de elementos. En esta paleta vamos a pinchar sobre "Menu item" y los arrastramos hasta el "component tree" de nuestro menu. Quedará así:



Por último, es necesario incluir en la actividad donde se mostrará el menú, las siguientes lineas:


¡OJO!: Si a continuación ejecutamos la aplicación y nos aparece un mensaje de este estilo: "cannot find symbol variable menu", deberemos ir a la barra de menús y seleccionar "Build > Clean proyect" y despues "Build > Rebuild project". Esta misma operación podemos hacerla en el caso de que no veamos reflejados los cambios en el emulador cuando hagamos otro tipo de cambios en el código.

Si seleccionamos el item en el arbol de componenetes o en el area de previsualización,  aparecerá el panel de propiedades:


Las propiedades son (se puede hacer selección multiple de ellas):
  • id: identificador el elemento. Para poder seleccionar el elemento y hacer que cuando se pulse sobre él, aparezca una "activity".
  • title: texto que aparece en el "item".
  • icon: icono que asociado al item. OJO: los iconos no se muestran dentro del menu "overflow", es decir sólo se mostrarán si el item está visible "En el actionBar" (showAsAction: always). Pulsa sobre los tres puntos ("...") que aparecen en la derecha del campo para poder escoger un icono.
  • showAsAction:  (al final de esta lista).
  • visible: si el item se visualizará o no por defecto.
  • enabled:  si el item se muestra desactivado o no (no clicable).
  • checkable: si queremos añadir un checkbox.
La propiedad "showAsAction" permite establecer la manera en que se visualizará el item en el "ActionBar".


  • never: el item nunca se muestra en el "ActionBar", sino en el menú "overflow".
  • ifRoom: el item se muestra en el "ActionBar" si hay espacio, sino se muestra en el menú "overflow".
  • always: el botón se muestra siempre en el "ActionBar".
  • withText: muestra el item con el texto.
Y a continuación, pulsamos sobre "Run" y veremos en el emulador el item en el menú "overflow".



 Otros tipos de podemos añadir son:

  • Cast button: permite añadir un boton para mandar las imágenes o videos que estemos visualizando en nuestro dispositivo hasta un dispositivo "Chrome Cast".


  • Search item: botón para realizar busquedas. Para que este botón funcione, es necesario asociarle un "activity" que realice la busqueda.

  • Swith item: botón para cambiar de estado algo (Activo/inactivo).

ScrollView

En muchos casos, el contenido que muestra una actividad, es más grande que el alto de la pantalla del dispositivo, en ese caso tendremos que mostrar una barra de "scroll" vertical. En el caso de que vaya a ocurrir dicho desbordamiento de contenido, vamos a englobar TODO el contenido del "layout" en un elemento "ScrollView".

Como recordamos, no es posible eleminar el "layout" que aparece por defecto en la interfaz de usuario, así que para añdir el "ScrollView" tendremos que reemplazar el "layout" que aparezca por defecto, por un "ScrollView" a través del código XML de manera manual.



Si intettamos añadir más de 1 elemento dentro del "ScrollView", veremos que aparece la señal amarilla de aviso en el arbol de componentes, ya que el elemento "ScrollView" sólo puede tener un hijo en su interior.

Por tanto, vamos a meter un "layout" dentro del "ScrollView", y dentro de él, un "layout" cualquiera, por ejemplo "LinearLayout", y dentro de este último los elementos que nos plazca.

Podemos ver en la siguiente image la barra de scroll que aparece (marco rojo):
















Comentarios

Publicar un comentario

Entradas populares de este blog

5. CSS: formatear un documento HTML

-
Imagen
Las hojas de estilos CSS permiten formatear los elementos HTML y/o cambiar el lugar en que estos se visualizan por defecto en el navegador. Al igual que HTML, CSS es un lenguaje que interpreta el navegador. El código CSS tiene este aspecto: Añadir CSS en un documento HTML Existen 3 métodos , para incluir hojas de estilos CSS a un documento HTML: Mediante el atributo style="..." . Mediante la etiqueta <style></style> Mediante archivos con extensión ".css" externos (RECOMENDADO) . Veamos a continuación cada una de ellas en detalle. Añadir CSS mediante el atributo style="..." Este método consiste en escribir las reglas CSS directamente en la etiqueta HTML a través del atributo style="..." . El siguiente enlace se visualizará de color rojo y tamaño de letra 8 píxeles. <a href="..." style="color: red; font-size: 8px" > Añadir CSS mediante la etiqueta <style></style> Ot...
Leer más

34. Java: final, static, constantes, colecciones

-
Imagen
El modificador "final" La palabra clave " final " se puede aplicar en: variables métodos clases 1. Variables : cuando se aplica " final " en variables , quiere decir que la variable sólo podrá ser inicializada una vez, es decir una vez asignado un valor, este no podrá ser cambiado, y si en algún sitio se intenta cambiarlo el compilador dará error . Ejemplo: En el cuerpo del enumerado anterior, se declaran dos atributos de tipo " final ". Es aconsejable añadir "final" a un atributo cuando sabemos que su valor no debería de ser modificado una vez inicializado , tal y como ocurre en este enumerado. Es decir, en este caso, las constates que se declaran dentro del enumerado, se inicializaran dentro del constructor TipoLugar(),  y ya no deberían de cambiarse , por tanto nos puede venir bien declarar esos dos atributos como final para evitar la posiblidad de que se puedan cambiar el valor de ambos atributos una vez inicializa...
Leer más

29. Android: tipos de layouts

-
Imagen
Uno de los elementos de los que estan compuestas la interfaces de usuario en Android son los " layouts ". Los "layout" son elementos invisibles de la interfaz de usuario. En realidad son como un contenedor que establece la manera en que se dispondrán los elementos que coloquemos en su interior. Por lo general, cada interfaz de usuario tendrá un "layout" que actuará como contenedor general de toda nuestra interfaz , es decir, englobando al resto de los elementos que la componen. Los tipos de "layouts" que podemos añadir a nuestras interfaces de usuario son los siguientes: LinearLayout TableLayout RelativeLayout AbsoluteLayout FrameLayout ConstraintLayout GridLayout Los veremos en detalle cada uno de ellos en este mismo artículo. El "layout" por defecto de la interfaz de usuario Como ya hemos visto anteriormente, cuando creamos un nuevo proyecto Android, se genera un archivo XML para la interfaz de usuario llamado ...
Leer más