Android

Introducción al entorno de Android
En este curso, desarrollaremos aplicaciones para teléfonos y tabletas. Además. Es recomen-

dable seleccionar la API mínima de Android 4.0.3 como versión mínima (API 15) ya que a fecha de
escritura del documento es una versión muy extendida y que dispone de mucha funcionalidad. Si 41
bien, puedes usar la última versión de Android que esté disponible en este momento,
La versión mínima que seleccionemos en esta ventana implicará que la aplicación desarrolla-
da se pueda ejecutar en más o menos dispositivos de los futuros usuarios. Sin embargo, si la versión
es muy baja y sea compatible con más dispositivos, más difícil será desarrollarla correctamente para
que se ejecute en todas las versiones de Android ya que hay funciones de las APIs incompatibles.
Para que puedas comparar el alcance de instalaciones posibles con cada versión de Android
podemos pulsar sobre el enlace “Help me choose” y aparecerá una ventana que mostrará el porcen-
taje de dispositivos que ejecutan actualmente cada versión de Android. Por ejemplo, en el momento
de escribir este documento, si seleccionamos como API mínima la 15 conseguiríamos cubrir un 82.6%
de los dispositivos actuales (a fecha de escritura de este documento):
Copyright © 2017. Ministerio de Educación de España. All rights reserved.
Robledo, David. <i>Desarrollo de aplicaciones para Android I</i>, Ministerio de Educación de España, 2017. ProQuest Ebook Central,
http://ebookcentral.proquest.com/lib/bibliotecauptsp/detail.action?docID=5214411.
Created from bibliotecauptsp on 2019-09-28 08:57:05.
Aula Mentor
Nota: como información adicional, si hacemos clic sobre cada versión de Android podremos ver
una lista de las novedades introducidas.
En la siguiente ventana elegimos el tipo de Actividad principal de la aplicación. Para empezar

seleccionamos BlankActivity, que es el tipo más sencillo:
42
Para acabar, en el último paso del asistente indicamos los datos asociados a esta Actividad
principal escribiendo el nombre de su clase java asociada (Activity Name) y el nombre de su layout
xml, su título, y el nombre del recurso XML correspondiente a su menú principal.
ATENCIÓN: el nombre de la Actividad no puede incluir tildes, la letra “ñ”, ni caracteres raros.
Más adelante en el curso explicaremos el significado y aplicaciones de estos elementos.

Para crear el proyecto, pulsamos el botón “Finish”. A continuación, Android Studio crea toda
la estructura del proyecto:
Si pulsamos el botón “Finish” se creará el proyecto y se abrirá el entorno completo de An-

droid Studio:
Finalmente, aparece la pantalla principal de este entorno de desarrollo con este nuevo pro-
yecto creado:
43
Verás que aparece una ventana de tipo popup que ofrece un consejo diario. Si la cerramos,
ya vemos el entorno completo de desarrollo:
Editores:
La ventana principal (la más grande) se llama “Editor”. El Editor es el espacio donde se escribe el
código fuente de los programas que estamos desarrollando.
Es posible tener varios ficheros de código fuente abiertos a la vez, apilados uno encima de
otro. En la parte superior de la ventana del Editor se muestran las pestañas que permiten acceder a
cada uno de los ficheros abiertos (o bien cerrarlos directamente):
Aula Mentor
Vistas
Además del Editor, existe un segundo tipo de ventanas “secundarias”, que denominaremos
44
Vistas.
Las Vistas son ventanas auxiliares para mostrar información, introducir datos, etcétera. Las
Vistas se usan con múltiples propósitos, desde navegar por un árbol de directorios, hasta mostrar el
contenido de una consulta SQL, depurar una aplicación, etcétera:
En la ventana anterior hay dos Vistas:
-- La Vista vertical de la izquierda muestra el árbol de directorios y ficheros del proyecto.

-- La Vista horizontal inferior muestra una pequeña “ventana” con la información de determinados
eventos de desarrollo como, por ejemplo: compilación del proyecto, depuración de código, etcé-
tera.
Barras de Herramientas principal y secundarias
La barra de herramientas principal contiene los accesos directos a las operaciones más comunes,
como abrir y guardar archivos. Además, también es posible ejecutar herramientas externas y tareas
relacionadas con el Editor activo, como ejecutar un programa, depurar el código fuente, etcétera.
Además de la barra de herramientas principal (imagen anterior), cada Vista puede tener su
propia barra de herramientas secundaria:
45
En la parte izquierda de este entorno podemos ver todos los ficheros y carpetas que compo-
nen el proyecto Android:
Aula Mentor
Es importante conocer la opción “Project Structure” mediante un botón de acceso rápido:
46
Si lo pulsamos, aparece una nueva ventana donde podemos seleccionar la versión de Android
con la que vamos a compilar el proyecto y la versión mínima en la que la aplicación es compatible:
IMPORTANTE
En todos los ejemplos del curso se ha establecido la versión mínima 4.4.4. Si el alumno o alumna
desea probar estos ejemplos en un AVD o dispositivo real de una versión inferior, deberá modificar
este parámetro del proyecto. 47
Si el alumno tiene dudas sobre el uso avanzado de Android Studio, en Internet existen mu-
chos tutoriales que indican cómo utilizarlo.
Además, es posible usar el menú “Help” o la tecla [F1] para solicitar ayuda. Desgraciadamente,
a día de hoy, esta ayuda sólo se encuentra en inglés.
B. Ejecución de un proyecto android
Una vez hemos creado el proyecto, vamos a explicar cómo ejecutamos esta aplicación de prueba con
Android Studio y el emulador de Android (AVD: Android Virtual Device).
Para ello, hacemos clic en el botón “Run ‘app’” de la barra de herramientas principal:
Aula Mentor
O en la opción "Run" de menú “Run ‘app’”. También disponemos del atajo del teclado
[Mayúsculas+F11]:
Si no aparece ningún problema de compilación, entonces aparecerá la siguiente ventana:
48
A continuación, Android Studio permite elegir el dispositivo que estemos ejecutando (AVD) o
conectado al ordenador mediante cable USB (dispositivo real) donde queremos instalar la aplicación
mediante la opción “Choose a running device”:
O ejecutar un nuevo ADD mediante la opción “Launch virtual device”:
49
La opción “Use same device for future launches” permite marcar que siempre se use el mismo
dispositivo cada vez que ejecutemos el proyecto. En general, es conveniente, marcar esta opción.
A continuación, se inicia el emulador de Android AVD en el ordenador que estés utilizando,
para que puedas probar el proyecto que has desarrollado. Ten en cuenta que el dispositivo virtual
tarda un rato en cargar cada vez que lo inicias. Hay que tener un poco de paciencia hasta que pa-
rezca la ventana de inicio:
Aula Mentor
En la consola de Android Studio puedes ir viendo el progreso de todo el proceso. Android

Studio instala automáticamente la nueva aplicación en el AVD y la ejecuta:
Cuando accedemos por primera vez al emulador, aparece la pantalla de bienvenida con el
terminal bloqueado:
50
Para desbloquear la pantalla hay que arrastrar el icono "candado" con el ratón hacia arriba.
Esto depende de la versión de Android con la que hayamos creado el AVD.
Una vez desbloqueado el AVD, podemos ver el aspecto de la aplicación instalada:
Además, en Android Studio se puede ver la vista “Logcat” que permite ver los mensajes de 51
error de la aplicación y poder depurar una aplicación cuando falla y se cierra:
Más adelante en el curso veremos cómo depurar una aplicación.
Nota: Si te quedas bloqueado en un error al desarrollar una aplicación durante el curso, no dudes
en leer este apartado de teoría que aparece en la Unidad 8 del curso para que te ayude a encontrar
el problema.
Aula Mentor
MUY IMPORTANTE
En general, cada vez que modifiquemos el código fuente y deseemos probar de nuevo nuestro
proyecto no es necesario parar el emulador de aplicaciones y arrancarlo de nuevo; simplemente
hacemos clic de nuevo en el botón “Run ‘app’” y Android Studio compilará, reinstalará y ejecutará
la aplicación modificada.
Una vez hayamos acabado de probar nuestro proyecto, es necesario cerrar el emulador de Android.
ATENCIÓN: En el Emulador de Android es posible probar varios proyectos a la vez.
Nota: en esta Unidad 1 puedes encontrar el vídeo “Cómo cargar un proyecto en Android Studio
y ejecutarlo”, que muestra cómo usar Android Studio para compilar y ejecutar los proyectos que
son los ejemplos del curso.
C. ¿Cómo usar el emulador de android (AVD)?
52
Como puedes observar, el Emulador de Android simula un teléfono con botones (¡con la foto
del terminal y todo!). Si ya sabes utilizar este tipo de dispositivos no tendrás ningún problema en
manejar el emulador como si fuera un teléfono más y no tienes que seguir leyendo este apartado.
Si no conoces Android, lee las siguientes instrucciones para ver cómo se maneja. En este
ejemplo, cambiaremos el idioma del sistema operativo.
El botón “Volver a atrás”, permite cerrar la aplicación y volver al “Escritorio” de Android:
Después, aparece la pantalla denominada “Pantalla Inicial” (en inglés se denomina Home
Screen), podemos acceder a todas las aplicaciones instaladas haciendo clic en el icono marcado con
una flecha roja en la imagen siguiente:
53
Si lo hacemos, veremos las aplicaciones instaladas. A esta pantalla se la denomina Pantalla

de lanzamiento (en inglés se denomina Launcher Screen):
Aula Mentor
Para movernos en esta pantalla, podemos usar el ratón como si fuera el dedo de tu mano. Es
decir, para ver los iconos que están abajo hay que hacer clic en la pantalla y, sin soltar el botón del
ratón, arrastrar la ventana hacia arriba:
54
Haciendo clic con el ratón sobre el icono de una de las aplicaciones, el emulador la ejecutará.
A continuación, vamos a modificar el idioma del sistema operativo. Para ello, haciendo clic
en el icono “Settings” aparece la siguiente pantalla:
Arrastrar hacia abajo

con el ratón
Desplazando con el ratón hacia arriba esta ventana hacemos clic en “Language & input”:
55
En la siguiente pantalla hacemos clic en “Language”:

Aula Mentor
Para acabar, desplazamos de nuevo la pantalla hacia arriba hasta que veamos el idioma en el
que deseamos configurar Android:
Arrastrar hacia abajo

con el ratón
56
Hacemos clic sobre el idioma correspondiente y el sistema operativo queda configurado.
Si usamos el botón “Volver atrás”, veremos que el idioma del sistema operativo ha cambiado
en la Pantalla Inicial (Home Screen):
Nota: En el apartado “Uso del emulador de Android” de la Unidad 2 puedes encontrar una des-
cripción más ampliada y detallada del AVD.
1.4 Cómo crear la primera aplicación con Android
A continuación, vamos a explicar cómo crear un proyecto sencillo usando Android Studio.
Vamos a partir del proyecto de ejemplo que hemos creado en la instalación del entorno de
desarrollo con Android Studio.
El primer proyecto Android consiste en una pantalla muy sencilla que muestra un mensaje
de bienvenida.
Se trata del primer proyecto que el alumno va a realizar, por lo que es muy importante prestar
atención a los pasos seguidos, ya que los proyectos siguientes se crean de manera similar
En la parte izquierda de este entorno podemos ver todos los ficheros y carpetas que compo-
nen el proyecto Android anteriormente creado. Sin embargo, por defecto, esta vista es algo peculiar
y podría llevarnos a confusión. Para entender mejor la estructura del proyecto vamos a cambiar la
forma en la que Android Studio la muestra. Para ello, hacemos clic sobre la lista desplegable situada
en la parte superior izquierda y cambiamos la vista a “Project”. 57
Al hacerlo, veremos que la presentación de la estructura del proyecto cambiará y tendrá este
aspecto:
Aula Mentor
58
En Android Studio existe la entidad única Proyecto que engloba a todos los demás elementos.
Dentro de un Proyecto podemos incluir varios Módulos que pueden representar diferentes aplicacio-
nes, versiones de una misma aplicación o distintos componentes de un proyecto como son la propia
aplicación móvil, el programa del servidor, bibliotecas, etcétera.
En general, trabajaremos con un proyecto que contendrá un único módulo que corresponde
a la aplicación principal. Así, en este caso, el proyecto contiene al módulo “app” que incluye todo el
código fuente de la aplicación de ejemplo.
A. Descripción de los ficheros por defecto del proyecto
Seguidamente, vamos a explicar la estructura y contenido de los ficheros del proyecto.
Carpeta /app/src/main/java
Contiene todo el código fuente de la aplicación, código de la interfaz gráfica, clases auxilia-
res, etcétera. Inicialmente, Android Studio crea el código básico de la Actividad (Activity) princi-
pal de la aplicación, debajo del paquete Java definido:
En este directorio es donde se almacenan los archivos de código fuente Java (con extensión
.java).
Carpeta /app/src/androidTest/
Contiene todos los ficheros que definen las pruebas automatizadas con JUnit. Se integra con
JUnit. JUnit es un software de Java que permite realizar la ejecución de clases Java de manera contro-
lada, para evaluar si el funcionamiento de cada uno de los métodos de la clase funciona tal y como
se esperaba en el desarrollo y así se puede realizar una depuración automatizada del código fuente 59
escrito en Java.
Carpeta /app/src/main/res/
Contiene todos los ficheros de recursos (resources) necesarios para el proyecto: imágenes,
vídeos, cadenas de texto (para internacionalización de la aplicación), etcétera. Los diferentes tipos de
recursos se deben distribuir entre las siguientes subcarpetas:
CARPETA DESCRIPCIÓN
Contiene las imágenes y otros elementos gráficos utilizados por la aplicación. Las imágenes
asociadas a las diferentes resoluciones y densidad de pantalla de distintos dispositivos se
suele dividir en varias subcarpetas:

• /drawable (independiente de la densidad)
• /drawable-ldpi (densidad baja)
/res/drawable/ • /drawable-mdpi (densidad media)
• /drawable-hdpi (densidad alta)
• /drawable-xhdpi (densidad muy alta)
• /drawable-xxhdpi (densidad muy muy alta)
Contiene los ficheros de definición en formato XML de las diferentes pantallas de la interfaz
gráfica. Se pueden definir distintos layouts dependiendo de la orientación del dispositivo
que se incluyen en las subcarpetas:
/res/layout/ • /layout (vertical, valor por defecto)
• /layout-land (horizontal)
Aula Mentor
CARPETA DESCRIPCIÓN
/res/anim/ Albergan la definición de las animaciones utilizadas por la aplicación.
/res/color/ Contiene ficheros en formato XML con definición de colores.
/res/menu/ Contiene la definición XML de los menús de la aplicación.
/res/xml/ Contiene otros ficheros XML de datos utilizados por la aplicación.
Contiene recursos adicionales, normalmente en formato distinto a XML, que no se

/res/raw/ incluyan en el resto de carpetas de recursos.
Contiene otros ficheros XML de recursos de la aplicación, como, por ejemplo, cadenas
/res/values/ de texto (strings.xml), estilos (styles.xml), colores (colors.xml), matrices (arrays.xml),
tamaños (dimens.xml), etcétera.
Nota: No es obligatorio que un proyecto tenga todas las carpetas, únicamente las que sean nece-
sarias.
Como ejemplo, para este nuevo proyecto Android que hemos creado por defecto veremos los
siguientes recursos para la aplicación:
60
Se puede observar que existen algunas carpetas cuyo nombre incluye un sufijo adicional
como, por ejemplo, “values-w820dp”. Estos sufijos se usan para definir recursos para determinados
dispositivos en función de sus características. Así, por ejemplo, los recursos incluidos en la carpeta
“values-w820dp” se aplicarán únicamente a pantallas con más de 820dp de ancho o los incluidos en
una carpeta llamada “values-v11” se aplicarán a dispositivos cuya versión de Android sea la 3.0 (API
11) o superior. Tal y como ocurre con los sufijos “-w” y “–v” existen otros para referirse a más carac-
terísticas del terminal. Puedes consultar la lista completa en la documentación oficial del Android.
Entre los recursos generados por defecto, es importante destacar el layout “bienvenido_la-
yout.xml” que define la interfaz gráfica de la pantalla principal de la aplicación. Si haces doble clic
sobre este archivo, Android Studio mostrará en el diseño de la interfaz interpretada en el editor grá-
fico que, inicialmente, incluye una etiqueta de texto con el mensaje “Hello World!”:
61
Además, si pulsas sobre la pestaña inferior “Text” puedes cambiar al editor XML que se mues-
tra en la imagen siguiente:
Aula Mentor
Atención: aunque puede parecer más sencillo de utilizar el editor visual gráfico, desde el
punto de vista didáctico, es mejor modificar directamente su fichero XML asociado ya que así podrás
aprender muchos de los conceptos de Android más rápidamente.
Fichero /app/src/main/AndroidManifest.xml
Contiene la definición en formato XML de las características principales de la aplicación,

como, por ejemplo, su identificación (nombre, versión, icono, etcétera), sus componentes (Activida-
des, Mensajes, Servicios, etcétera) o los permisos necesarios para su ejecución. Veremos más adelante
otros detalles de este fichero.
Fichero /app/build.gradle
Contiene la información necesaria para la compilación del proyecto como la versión del SDK
de Android utilizada para compilarlo, la versión mínima de Android que soportará la aplicación, las
referencias a las bibliotecas externas utilizadas, etcétera.
En un mismo proyecto pueden existir varios archivos build.gradle que definen determinados
parámetros a distintos niveles. Por ejemplo, en este proyecto puedes ver que existe un archivo build.
gradle a nivel de proyecto y otro a nivel de módulo dentro de la carpeta /app. El primero de ellos
establece parámetros globales a todos los módulos del proyecto y el segundo sólo afectará al módulo
correspondiente.
Carpeta /app/libs
62 Contiene las bibliotecas JAVA externas (ficheros .jar) que utiliza la aplicación. Debemos hacer
referencia a dichas bibliotecas en el fichero build.gradle descrito en el punto anterior de forma que
se incluyan en el proceso de compilación de la aplicación. Esta funcionalidad se aplica en el curso
Android II de Mentor.
Carpeta /app/build/
Contiene los ficheros de código generados automáticamente al compilar el proyecto.
IMPORTANTE: dado que estos ficheros se crean automáticamente tras cada compilación del
proyecto es importante que no se modifiquen manualmente bajo ninguna circunstancia.
El archivo más importante es el que se puede observar en la imagen anterior, el fichero

R.java que define la clase Java denominada R.
Esta clase R contiene un conjunto de constantes con los ID de todos los recursos de la apli-
cación incluidos en la carpeta /res/, de forma que el programador pueda acceder fácilmente a estos
recursos desde el código fuente a través de esta clase. Así, por ejemplo, la constante R.drawable.
icon define el ID de la imagen “icon.png” contenida en la carpeta /res/drawable/.
IMPORTANTE: Esta clase la crea automáticamente Android por lo que no debemos modificarla.
Haciendo doble clic sobre estos ficheros podemos abrirlos en el Editor de Android Studio.
Es importante que el alumno se familiarice con este entorno de desarrollo y pruebe las distintas op-
ciones del mismo.
Al abrir los distintos ficheros veremos la siguiente ventana:
63
Si abrimos el fichero BienvenidoActivity.java, veremos el código fuente de la apli-

cación Android. A continuación, añadimos las siguientes sentencias:
Aula Mentor
package es.mentor.ejemplo.bienvenido;
import android.app.Activity;
import android.os.Bundle;
import android.widget.TextView;
public class BienvenidoActivity extends Activity {

/** Método que se llama cuando se crea una actividad. */
public void onCreate(Bundle savedInstanceState)
{
// Llamamos al método de la clase superior (Activity)
super.onCreate(savedInstanceState);
// Establecemos los contenidos de la Intefaz de usuario
// de forma “programada”.
TextView tv = new TextView(this);
tv.setText("¡Bienvenido al curso de Android de Mentor!");
setContentView(tv);
// Descomentar la siguiente sentencia para usar los layout en el
// diseño de la Interfaz Usuario. Si lo haces, debes comentar
// las 3 sentencias anteriores.
// setContentView(R.layout.bienvenido_layout);
}
}
Fíjate en que la clase principal BienvenidoActivity de la aplicación se basa en la clase

64 Activity de Android.
Nota: puede ocurrir que al añadir las nuevas sentencias aparezca este error en Android Studio:
Esto sucede porque es necesario importar la clase TextView. Para hacerlo, basta con selec-
cionar en el código fuente esta clase y hace clic en el bocadillo que aparece a continuación (o pulsar
la combinación de teclas Alt+INTRO):
Una actividad (Activity) es el componente de la aplicación que realiza acciones. Una apli-
cación puede tener muchas actividades, si bien el usuario sólo interactúa con ellas de una en una.
Android llama al método onCreate() cuando una actividad se inicia. En este método se lleva a
cabo toda la inicialización de variables y configuración de la interfaz de usuario. Una actividad no
está obligada a tener una interfaz de usuario, aunque generalmente la suele tener. En la Unidad 2
veremos en detalle todos los métodos disponibles en esta clase básica de Android.
La interfaz de usuario de Android se compone de vistas (Views). Una vista es un objeto
que define el diseño de la interfaz de usuario, como un botón, una imagen, una etiqueta de texto,
etcétera. Cada uno de estos objetos se hereda de la clase principal View. En este ejemplo hemos
utilizado la subclase TextView, que crea una etiqueta de texto.
En el ejemplo se crea una etiqueta TextView en el constructor de la Actividad. Para crear
esta etiqueta es necesario pasar como parámetro una instancia del Contexto (Context) de la apli-
cación Android. Un Contexto es un identificador del sistema que sirve para tener acceso a recursos,
a preferencias, a bases de datos, etcétera, de la aplicación. La clase Actividad se hereda de la clase
Contexto; por lo tanto, se puede pasar esta Actividad como el Contexto de la aplicación escribiendo 65
this.
Con el método setText() establecemos el texto contenido en la etiqueta.
Para acabar, usamos el método setContentView() para indicar a la Actividad el contenido

de la interfaz de usuario.
Si ejecutas la aplicación en Android Studio deberás ver la siguiente ventana en el emulador:

Aula Mentor
B. Modificar la interfaz de usuario con Layout
Los Layout son elementos no visibles que establecen cómo se distribuyen en la interfaz del usuario
los componentes (widgets) que incluyamos en su interior. Podemos pensar en estos elementos
como paneles donde vamos incorporando, de forma diseñada, los componentes con los que inte-
racciona el usuario.
NOTA: La clase Layout se hereda, como el resto de componentes, de la clase Vista.

A lo largo del curso nos referiremos a los componentes de Android como Vistas (Views) o
como Widgets, tanto si son visibles (botones, texto, menús…) como si son elementos de diseño
(layout).
En el ejemplo anterior hemos utilizado un diseño de interfaz de usuario “programado”, es

decir, se construye esta interfaz con sentencias Java en el código fuente. Si ya has desarrollado in-
terfaces de esta manera, sabrás que pequeños cambios en su diseño pueden dar lugar a grandes
modificaciones en el código fuente.
Al ser Android un lenguaje nuevo, permite desarrollar interfaces usando archivos de diseño
(Layout) XML. La forma más fácil de explicar este concepto es mostrar un ejemplo. El fichero res/
layout/bienvenido_layout.xml define el diseño de la interfaz del usuario:
<?xml version=”1.0” encoding=”utf-8”?>

<RelativeLayout
66 xmlns:android=”http://schemas.android.com/apk/res/android”
xmlns:tools=”http://schemas.android.com/tools”
android:layout_width=”match_parent”
android:layout_height=”match_parent”
android:paddingLeft=”@dimen/activity_horizontal_margin”
android:paddingRight=”@dimen/activity_horizontal_margin”
android:paddingTop=”@dimen/activity_vertical_margin”
android:paddingBottom=”@dimen/activity_vertical_margin”
tools:context=”.BienvenidoActivity”>
<TextView android:text=”@string/hello_world”
android:layout_width=”wrap_content”
android:layout_height=”wrap_content” />
</RelativeLayout>
La estructura general de un archivo de diseño de interfaz XML de Android es simple. Se trata

de un árbol de elementos XML, donde cada nodo es el nombre de una clase Vista (en este ejemplo,
usamos las clases LinearLayout y TextView). Puedes utilizar el nombre de cualquier clase de
tipo Vista (View) de Android o, incluso, una clase Vista personalizada por el programador.
El Layout RelativeLayout apila todos sus elementos hijos de forma relativa entre ellos. En
el apartado siguiente veremos diferentes tipos de paneles de diseño y sus características en detalle.
Esta estructura XML hace que sea más fácil y rápido crear las interfaces de usuario. Este mo-
delo se basa en el modelo de desarrollo web, donde se separa la presentación (interfaz de usuario)
de la lógica de la aplicación (encargada de leer y escribir la información).
En el ejemplo de XML anterior sólo hay un elemento Vista: TextView, que tiene tres
atributos y un elemento de diseño Layout: RelativeLayout, que tiene nueve atributos.
A continuación, mostramos una descripción de todos los atributos:
ATRIBUTO DESCRIPCIÓN
xmlns:android Esta declaración indica que vamos a usar el espacio de nombres (la terminología) de
Android para referirnos a los atributos que se definen a continuación.
xmlns:tools Esta declaración indica que podemos utilizar el atributo tools (herramientas) que
permite a los diseñadores añadir nuevas etiquetas de diseño en las interfaces de usuario.
Define el largo que debe ocupar la Vista. En este caso, indicamos que el Layout
android:layout_width debe ocupar toda la pantalla con “match_parent” (igualar al padre). Y que el
TextView debe ocupar lo que su contenido albergue con “wrap_content” (envolver
al contenido).
android:layout_height Similar al atributo anterior, en este caso, se refiere al ancho de la Vista.
android:paddingLeft
android:paddingRight
Separación izquierda/derecha/arriba/abajo entre vistas dentro del Layout.
android:paddingTop
android:paddingBottom
tools:context Indica la actividad que va a utilizar este layout.
android:text Establece el texto que la Vista TextView debe mostrar. En este ejemplo se utiliza una
cadena que se establece en el archivo res/values/strings.xml.
67
El título de la aplicación “Bienvenido”, que aparece en el área del usuario, se define en el

fichero res/values/strings.xml.
ATENCIÓN: es importante definir siempre los literales de la aplicación en este fichero de recursos.
Así, podemos cambiar los mensajes y etiquetas al usuario de una forma centralizada en un único
fichero y, además, cuando queramos traducir la aplicación a otro idioma, será más sencillo modificar
este fichero exclusivamente.
Por ejemplo, en lugar de haber escrito la sentencia Java:

tv.setText(“¡Bienvenido al curso de Android de Mentor!”);
Podríamos haber definido el literal en el fichero res/values/strings.xml:
<string name=”mensaje”>¡Bienvenido al curso de Android de Mentor</string>
Y modificar la sentencia Java así:
<string name=”mensaje”>¡Bienvenido al curso de Android de Mentor

</string>
Aula Mentor
Como hemos visto, Android Studio permite definir los ficheros de tipo XML de dos formas:
a través de un editor visual o directamente en el archivo XML. Se puede cambiar entre las dos
formas haciendo clic en la pestaña de la parte inferior de la ventana. Por ejemplo, si abrimos el
archivo res/layout/bienvenido_layout.xml y hacemos clic en “Design”:
68
En esta ventana podemos diseñar visualmente la pantalla de la aplicación Android arrastran-
do con el ratón los componentes que aparecen en el apartado “Palette”.
Si abrimos el fichero de literales res/layout/strings.xml y hacemos clic en “Open
editor”:
Podemos añadir visualmente nuevas cadenas de texto en el editor que se abre a continuación:
Usando en esta ventana el botón “Add” podemos añadir visualmente los diferentes tipos de
recursos de Android.
Para crear la primera aplicación hemos usado componentes (Vistas sencillas) usuales de An-
droid. En el siguiente apartado de teoría explicaremos en detalle el tipo de componentes disponibles
por defecto y cómo usarlos para diseñar las pantallas que servirán de interfaz gráfica al usuario.
Fichero AndroidManifest.xml: contiene la definición en formato XML de las características
principales de la aplicación, como su identificación (nombre, versión, icono, etcétera), sus compo-
nentes (Actividades, Mensajes, Servicios, etcétera) o los permisos necesarios para su ejecución. Más
adelante veremos otros detalles de este fichero.
En este fichero hay que declarar la Actividad para que Android tenga acceso a la misma. Si
abres el archive manifest, verás que existe el siguiente elemento <activity>:
<?xml version=”1.0” encoding=”utf-8”?>

<manifest xmlns:android=”http://schemas.android.com/apk/res/android”
...
<activity android:name=”.BienvenidoActivity”
android:label=”@string/app_name”>
...
</manifest>
En este fichero se pueden definir varios atributos para establecer la etiqueta de la actividad, su
icono o el tema de estilo de la interfaz de usuario. El único atributo obligatorio es android:name,
que especifica el nombre de clase de la actividad. Hay que tener en cuenta que otra aplicación puede 69
iniciar la Actividad que definamos aquí.
MUY IMPORTANTE
Aunque el código fuente de este ejemplo se encuentra disponible en la carpeta de ejemplos de esta
unidad, es fundamental que crees este proyecto Android desde el principio para entender la secuencia
de pasos dados y los ficheros necesarios.
Además, si no has usado nunca el entorno de desarrollo Android Studio, adquirirás soltura utilizándolo.
1.5 Cómo cargar los ejemplos del curso en Android Studio

Si el entorno de Android Studio ya está abierto, para abrir otro proyecto Android debemos usar la
opción del menú principal: File -> Open:
Aula Mentor
A continuación, emerge una ventana donde podemos buscarlo en nuestro disco duro:
70
Finalmente, seleccionamos el directorio de trabajo donde debemos haber copiado previa-

mente los ficheros con el código fuente de los ejemplos: “C:\cursosMentor\Android\proyectos”,
seleccionamos un proyecto y hacemos clic en “OK”:
NOTA: Los proyectos de tipo Android Studio se marcan con un icono en color verde.
Existe otra forma de abrir proyectos desde la ventana de inicio de Android Studio, para ello,
hacemos clic en el botón “Open an existing Android Studio project”:
De igual forma, seleccionamos el directorio de trabajo donde debemos haber copiado pre-
viamente los ficheros con el código fuente de los ejemplos: “C:\cursosMentor\Android\pro-
yectos”, seleccionamos un proyecto y hacemos clic en “OK”:
71
Después, puede aparecer el siguiente mensaje para que se configure el compilador del pro-
yecto:
Debemos pulsar el botón “OK” para, seguidamente, ver que Android Studio abre y compila
el proyecto:
Aula Mentor
72
Finalmente, aparece el proyecto en Android Studio:

Si deseamos importar un proyecto Android escrito con otro entorno de desarrollo como, por
ejemplo, Eclipse ADT, debemos hacer clic en la ventana de inicio de Android Studio en el botón
“Import project (Eclipse ADT, Gradle, etc)”:
73
Nota: si ya está abierto el entorno Android Studio puedes llegar la ventan anterior haciendo
clic en la opción del menú principal: File -> Close Project.
Después, seleccionamos el proyecto y pulsamos en el botón “OK”:

Aula Mentor
Fíjate que los proyectos que deseamos importar muestran el icono de una carpeta en color
marrón.
Después, Android Studio solicita el directorio destino donde va a generar la estructura del
nuevo proyecto:
74
Si pulsamos el botón “OK” vemos que aparece la siguiente ventana:

A continuación, pulsamos el botón “Finish” para acabar la operación. Además, indicamos que
se deben actualizar las bibliotecas estándar de Android cuando sea posible.
Para acabar, se abre el entorno Android Studio con una nota que informa de los cambios
ejecutados al importar el proyecto:
75
En el directorio de trabajo podemos ver que aparecen el proyecto anterior y el nuevo:

Nota: en esta Unidad 1 puedes encontrar el vídeo “Cómo cargar un proyecto de Android
Studio y ejecutarlo”, que muestra cómo se importan los ficheros con el código fuente de los
proyectos que son los ejemplos del curso.
Aula Mentor
Importante
En el apartado “Problemas al cargar proyectos de Android” de Preguntas y Respuestas (FAQ) de la Unidad 1

puedes encontrar soluciones a los problemas que ocurren al abrir el código fuente de los ejemplos del curso.
1.6 Cómo diseñar la interfaz de usuario con Vistas

Una de las características más importante de Android es la posibilidad de usar componentes
gráficos dinámicos y reutilizables (en inglés se denominan Views).
Mediante el SDK de Android, el programador puede utilizar clases prediseñadas para imple-
mentar elementos y comportamientos en la interfaz del usuario, que, de otra forma, éste tendría que
crear desde cero, tales como botones, cuadros de edición complejos, arrastrar y soltar, o menús en
árbol.
Nota: Como en la literatura inglesa de Android se habla genéricamente de Vista (View) para
referirse a estos componentes visuales y en Internet siempre aparecen referencias a esta palabra,
vamos a usar esta nomenclatura a partir de ahora.
Importante
76 Es importante no confundir los widgets (componentes o Vistas) que usamos al desarrollar las
interfaces de usuario en Android con “Widget de la pantalla principal” (Screen Home) o “pantalla
de bloqueo” (Lock Screen), que son pequeñas aplicaciones que el usuario del teléfono puede
añadir a estas pantallas, tales como un calendario dinámico, previsión meteorológica, etcétera.
A. Vistas disponibles en Android
Construir interfaces de usuario en las aplicaciones de Android es muy sencillo y rápido gra-
cias a que podemos utilizar Vistas.
Como hemos visto en el apartado anterior, las Vistas visibles deben situarse dentro de otro
tipo de Vista denominada Layout (Panel de diseño).
Estos paneles de diseño (Layout) de Android se usan para diseñar la interfaz gráfica del usua-
rio de la aplicación y separan simbólicamente el área de la aplicación. Dentro de estos paneles se

incluyen la mayoría de las Vistas, como botones, cuadros de texto, etcétera. Además, dentro de un
panel se pueden incluir otros paneles para hacer diseños complejos.
Nota: Cuando se describan los métodos más importantes de cada Vista (View), sólo se incluirán
aquéllas que no se hayan señalado con anterioridad o se invoquen con diferentes argumentos.
Además, el entorno de Android Studio dispone de una ventana emergente de ayuda que,
al escribir código fuente, muestra los diferentes métodos disponibles para esa clase. De esta forma,
evitamos errores de codificación y el desarrollo de las aplicaciones web es mucho más rápido y
eficiente.
En la siguiente imagen mostramos el aspecto que tiene esta ventana de ayuda.
Con el atajo de teclado [CTRL+BARRA_ESPACIADORA] podemos acceder a esta ventana de
ayuda emergente.
Además, podemos marcar un método y aparecerá una ayuda emergente:
77
B. Tipos de paneles
PANEL DE MARCO (FrameLayout)
Éste es el panel más sencillo de todos los Layouts de Android. Un panel FrameLayout coloca
todos sus componentes hijos alineados pegados a su esquina superior izquierda de forma que cada
componente nuevo añadido oculta por el componente anterior. Por esto, se suele utilizar para mos-
trar un único control en su interior, a modo de contenedor (placeholder) sencillo para un único ele-
mento, por ejemplo, una imagen.
Los componentes incluidos en un FrameLayout pueden establecer las propiedades
android:layout_width y android:layout_height, que pueden establecerse con los va-
lores:
--fill_parent para que el componente hijo tenga la dimensión del layout que lo contiene.
--wrap_content para que el componente hijo ocupe el tamaño de su contenido.
Aula Mentor
EJEMPLO:
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<EditText android:id="@+id/TextoNombre"
android:layout_width="fill_parent"
android:layout_height="fill_parent" />
</FrameLayout>
Además, el panel FrameLayout permite superponer en el área de la pantalla varios compo-

nentes hijos. Por lo general, este panel debe contener pocos componentes hijos, ya que puede ser
difícil organizarlos sin que se superpongan unos con otros en los diferentes tamaños de pantalla de
los teléfonos. El atributo más importante de los componentes hijos que contiene es layout_gra-
vity, que permite controlar su posición relativa,
EJEMPLO:
<FrameLayout
xmlns:android=”http://schemas.android.com/apk/res/android”
78
android:layout_width=”fill_parent”
android:layout_height=”fill_parent”>
<ImageView
android:layout_height=”fill_parent”
android:scaleType=”center”
android:src=”@drawable/imagen” />
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_marginBottom=”20dip”
android:layout_gravity=”center_horizontal|bottom”
android:padding=”12dip”
android:background=”#AA000000”
android:textColor=”#ffffffff”
android:text=”Imagen” />
</FrameLayout>
En este ejemplo, mostramos una imagen que ocupa todo el área de la pantalla usando el
atributo android:scaleType="center" y una etiqueta superpuesta en la parte inferior de la
pantalla con el atributo android:layout_gravity="center_horizontal|bottom".
Panel lineal (LinearLayout)

Vertical y Horizontal
El panel LinearLayout apila todos sus componentes hijos de forma horizontal o vertical,
según se establezca la propiedad android:orientation con el valor “vertical” u “hori-
zontal”.
De igual forma que en un FrameLayout, se pueden establecer las propiedades
android:layout_width y android:layout_height. Además, existe la propiedad
android:layout_weight, en el caso de un panel LinearLayout, que permite establecer las
dimensiones de los componentes contenidos proporcionales entre ellos.
EJEMPLO:
<LinearLayout
android:orientation=”vertical”>
<EditText android:id=”@+id/TextoDato1”
android:layout_weight=”1” />
<EditText android:id=”@+id/TextoDato2”
79
android:layout_weight=”2” />
</LinearLayout>
Si incluimos en un panel vertical dos cuadros de texto (EditText) y en uno de ellos estable-
cemos un layout_weight=”1” y en el otro un layout_weight=”2”, conseguiremos que toda
la superficie del panel esté ocupada por los dos cuadros de texto y, además, que el segundo sea el
doble (relación entre sus propiedades weight) de alto que el primero.
Panel Tabla (TableLayout)
El panel TableLayout permite distribuir todos sus componentes hijos como si se tratara
de una tabla mediante filas y columnas.

La estructura de la tabla se define de manera similar a una tabla en formato HTML, es decir,
indicando las filas que compondrán la tabla (objetos TableRow) y las columnas de cada una de
ellas.
Por norma general, el ancho de cada columna corresponde al ancho del mayor componente
de dicha columna, pero existen una serie de propiedades pueden modificar este comportamiento:
--android:stretchColumns: indica el número de columna que se expande para ocupar el

espacio libre que dejan el resto de columnas a la derecha de la pantalla.
--android:shrinkColumns: indica las columnas que se pueden contraer para dejar espacio al
resto de columnas de lado derecho de la pantalla.
--android:collapseColumns: indica las columnas de la tabla que se pueden ocultar comple-
tamente.
Todas estas propiedades del TableLayout pueden establecerse con una lista de índices de las co-
lumnas separados por comas, por ejemplo: android:stretchColumns=”1,2,3” o un asterisco para
Aula Mentor
indicar que se debe aplicar a todas las columnas, de esta forma: android:stretchColumns=”*”.
--android:layout_span: una celda determinada puede ocupar el espacio de varias columnas de
la tabla (análogo al atributo colspan de HTML) del componente concreto que ocupa dicho espacio.
También están disponibles las propiedades android:layout_rowSpan y android:layout_columnSpan
para conseguir que una celda ocupe el lugar de varias filas o columnas.
EJEMPLO:
<TableLayout
android:stretchColumns=”1”>
<TableRow>
<TextView android:text=”Celda 1.1”>
</TableRow>
<TableRow>
</TableRow>
<TableRow>
<TextView android:text=”Celda 3”
android:layout_span=”2” />
80 </TableRow>
</TableLayout>
Desde Android Studio puedes abrir el proyecto Ejemplo 2 (Panel tabla) de la Unidad 1. Estu-
dia el código fuente y ejecútalo para mostrar en el emulador el resultado del programa anterior,
en el que hemos utilizado el Layout TableLayout.
Panel Cuadrícula (GridLayout)

El panel GridLayout permite está disponible a partir de la API 14 (Android 4.0) y sus ca-
racterísticas son similares al TableLayout, ya que se usa para distribuir los diferentes elementos de
la interfaz de forma tabular mediante filas y columnas. La diferencia entre estos paneles radica en la
forma que tiene el GridLayout de situar y distribuir sus elementos hijos en el espacio disponible.
En este caso, es necesario indicar el número de filas y columnas estableciendo sus propie-
dades android:rowCount y android:columnCount. Así, ya no es necesario incluir ningún
elemento adicional del tipo TableRow para indicar las filas, como sí se hace con el panel Table-
Layout. Es decir, los elementos hijos se irán colocando ordenadamente en las celdas de las filas
y columnas (dependiendo de la orientación del dispositivo: propiedad android:orientation)
hasta completar todas las celdas indicadas en los atributos anteriores. Adicionalmente, como ocurre
con el caso anterior, también están disponibles las propiedades android:layout_rowSpan y
android:layout_columnSpan para conseguir que una celda ocupe el lugar de varias filas o
columnas.
Existe también una manera de indicar de forma explícita la fila y la columna donde un
determinado elemento hijo debe incluirse mediante los atributos android:layout_row y

Android

Încărcat de

Informații document

Titlu original

Drepturi de autor

Formate disponibile

Partajați acest document

Partajați sau inserați document

Opțiuni de partajare

Vi se pare util acest document?

Este necorespunzător acest conținut?

Drepturi de autor:

Formate disponibile

Android

Încărcat de

Drepturi de autor:

Formate disponibile

Introducción al entorno de Android

En este curso, desarrollaremos aplicaciones para teléfonos y tabletas. Además. Es recomen-

En la siguiente ventana elegimos el tipo de Actividad principal de la aplicación. Para empezar

Más adelante en el curso explicaremos el significado y aplicaciones de estos elementos.

Si pulsamos el botón “Finish” se creará el proyecto y se abrirá el entorno completo de An-

En la ventana anterior hay dos Vistas:

-- La Vista vertical de la izquierda muestra el árbol de directorios y ficheros del proyecto.

Barras de Herramientas principal y secundarias

Es importante conocer la opción “Project Structure” mediante un botón de acceso rápido:

B. Ejecución de un proyecto android

Si no aparece ningún problema de compilación, entonces aparecerá la siguiente ventana:

O ejecutar un nuevo ADD mediante la opción “Launch virtual device”:

En la consola de Android Studio puedes ir viendo el progreso de todo el proceso. Android

Más adelante en el curso veremos cómo depurar una aplicación.

ATENCIÓN: En el Emulador de Android es posible probar varios proyectos a la vez.

C. ¿Cómo usar el emulador de android (AVD)?

Si lo hacemos, veremos las aplicaciones instaladas. A esta pantalla se la denomina Pantalla

Arrastrar hacia abajo

En la siguiente pantalla hacemos clic en “Language”:

Arrastrar hacia abajo

Hacemos clic sobre el idioma correspondiente y el sistema operativo queda configurado.

1.4 Cómo crear la primera aplicación con Android

A. Descripción de los ficheros por defecto del proyecto

Seguidamente, vamos a explicar la estructura y contenido de los ficheros del proyecto.

suele dividir en varias subcarpetas:

/res/anim/ Albergan la definición de las animaciones utilizadas por la aplicación.

/res/color/ Contiene ficheros en formato XML con definición de colores.

/res/menu/ Contiene la definición XML de los menús de la aplicación.

/res/xml/ Contiene otros ficheros XML de datos utilizados por la aplicación.

Contiene recursos adicionales, normalmente en formato distinto a XML, que no se

Contiene la definición en formato XML de las características principales de la aplicación,

Contiene los ficheros de código generados automáticamente al compilar el proyecto.

El archivo más importante es el que se puede observar en la imagen anterior, el fichero

Si abrimos el fichero BienvenidoActivity.java, veremos el código fuente de la apli-

public class BienvenidoActivity extends Activity {

Fíjate en que la clase principal BienvenidoActivity de la aplicación se basa en la clase

Para acabar, usamos el método setContentView() para indicar a la Actividad el contenido

Si ejecutas la aplicación en Android Studio deberás ver la siguiente ventana en el emulador:

B. Modificar la interfaz de usuario con Layout

NOTA: La clase Layout se hereda, como el resto de componentes, de la clase Vista.

En el ejemplo anterior hemos utilizado un diseño de interfaz de usuario “programado”, es

<?xml version=”1.0” encoding=”utf-8”?>

La estructura general de un archivo de diseño de interfaz XML de Android es simple. Se trata

android:layout_height Similar al atributo anterior, en este caso, se refiere al ancho de la Vista.

tools:context Indica la actividad que va a utilizar este layout.

El título de la aplicación “Bienvenido”, que aparece en el área del usuario, se define en el

Por ejemplo, en lugar de haber escrito la sentencia Java:

tv.setText(“¡Bienvenido al curso de Android de Mentor!”);

Podríamos haber definido el literal en el fichero res/values/strings.xml:

<string name=”mensaje”>¡Bienvenido al curso de Android de Mentor</string>

Y modificar la sentencia Java así:

<string name=”mensaje”>¡Bienvenido al curso de Android de Mentor

<?xml version=”1.0” encoding=”utf-8”?>

1.5 Cómo cargar los ejemplos del curso en Android Studio

Finalmente, seleccionamos el directorio de trabajo donde debemos haber copiado previa-

Finalmente, aparece el proyecto en Android Studio:

Después, seleccionamos el proyecto y pulsamos en el botón “OK”:

Si pulsamos el botón “OK” vemos que aparece la siguiente ventana:

En el directorio de trabajo podemos ver que aparecen el proyecto anterior y el nuevo:

En el apartado “Problemas al cargar proyectos de Android” de Preguntas y Respuestas (FAQ) de la Unidad 1

1.6 Cómo diseñar la interfaz de usuario con Vistas

A. Vistas disponibles en Android

rio de la aplicación y separan simbólicamente el área de la aplicación. Dentro de estos paneles se