Documente Academic
Documente Profesional
Documente Cultură
[CURSO DE ANDROID ]
PGINA 1
Aplicaciones Mviles
[CURSO DE ANDROID ]
PGINA 2
Aplicaciones Mviles
[CURSO DE ANDROID ]
Durante la instalacin Eclipse te pedir que aceptes la licencia de los componentes de Google
que vas a instalar y es posible que aparezca algn mensaje de warning que simplemente puedes
aceptar para continuar con la instalacin. Finalmente el instalador te pedir que reinicies Eclipse.
Paso 5. Configurar el plugin ADT.
Una vez instalado el plugin, tendremos que configurarlo indicando la ruta en la que hemos
instalado el SDK de Android. Para ello, iremos a la ventana de configuracin de Eclipse
(Window / Preferences), y en la seccin de Android indicaremos la ruta en la que se ha
instalado. Finalmente pulsaremos OK para aceptar los cambios. Si aparece algn mensaje
dewarning aceptamos sin ms, ya que se son problemas que se solucionarn en el siguiente
paso.
PGINA 3
Aplicaciones Mviles
[CURSO DE ANDROID ]
PGINA 4
Aplicaciones Mviles
[CURSO DE ANDROID ]
Para configurar el AVD tan slo tendremos que indicar un nombre descriptivo, la versin de la
plataforma Android que utilizar, y las caractersticas de hardware del dispositivo virtual, como
por ejemplo su resolucin de pantalla o el tamao de la tarjeta SD. Adems, marcaremos la
PGINA 5
Aplicaciones Mviles
[CURSO DE ANDROID ]
Y con este paso ya tendramos preparadas todas las herramientas necesarias para comenzar a
desarrollar aplicaciones Android. En prximos apartados veremos como crear un nuevo proyecto,
la estructura y componentes de un proyecto Android, y crearemos una aplicacin sencilla para
poner en prctica todos los conceptos aprendidos.
PGINA 6
Aplicaciones Mviles
[CURSO DE ANDROID ]
De esta forma iniciaremos el asistente de creacin del proyecto, que nos guiar por las distintas
opciones de creacin y configuracin de un nuevo proyecto.
En la primera pantalla indicaremos el nombre de la aplicacin, el nombre del proyecto y el
paquete java que utilizaremos en nuestras clases java. Tendremos que seleccionar adems la
mnima versin del SDK que aceptar nuestra aplicacin al ser instalada en un dispositivo
(Minimum Required SDK), la versin del SDK para la que desarrollaremos (Target SDK), y la
versin del SDK con la que compilaremos el proyecto (Compile with). Las dos ltimas suelen
coincidir con la versin de Android ms reciente. El resto de opciones las dejaremos con los
valores por defecto.
Al pulsar el botn Next, accederemos al segundo paso del asistente, donde tendremos que
indicar si durante la creacin del nuevo proyecto queremos crear un icono para
nuestraaplicacin (Create custom launcher icon) y si queremos crear una actividad inicial
(Create activity). Tambin podremos indicar si nuestro proyecto ser del tipo Librera (Mark this
Project as a library). Por ahora dejaremos todas las opciones marcadas por defecto como se ve
en la siguiente imagen y pulsamos Next.
PGINA 7
Aplicaciones Mviles
[CURSO DE ANDROID ]
En la siguiente pantalla del asistente configuraremos el icono que tendr nuestra aplicacin en el
dispositivo. No nos detendremos mucho en este paso ya que no tiene demasiada relevancia por
el momento. Tan slo decir que podremos seleccionar la imagen, texto o dibujo predefinido que
aparecer en el icono, el margen, la forma y los colores aplicados. Por ahora podemos dejarlo
todo por defecto y avanzar al siguiente paso pulsando Next.
PGINA 8
Aplicaciones Mviles
[CURSO DE ANDROID ]
Por ltimo, en el ltimo paso del asistente indicaremos los datos de esta actividad principal que
acabamos de elegir, indicando el nombre de su clase java asociada y el nombre de su layout
xml (algo as como la interfaz grfica de la actividad, lo veremos ms adelante).
Una vez configurado todo pulsamos el botn Finish y Eclipse crear por nosotros toda la
estructura del proyecto y los elementos indispensables que debe contener. En la siguiente
imagen vemos los elementos creados inicialmente para un nuevo proyecto Android:
PGINA 9
Aplicaciones Mviles
[CURSO DE ANDROID ]
Carpeta /res/
Contiene todos los ficheros de recursos necesarios para el proyecto: imgenes, vdeos, cadenas
de texto, etc. Los diferentes tipos de recursos se distribuyen entre las siguientes subcarpetas:
Carpeta
Descripcin
/res/drawable/
/res/layout/
PGINA 10
Aplicaciones Mviles
[CURSO DE ANDROID ]
/layout-land (horizontal)
/res/anim/
/res/animator/
/res/color/
/res/menu/
/res/xml/
/res/raw/
/res/values/
Contiene otros ficheros XML de recursos de la aplicacin, como por ejemplo cad
colores (colors.xml), arrays de valores (arrays.xml), etc.
PGINA 11
No todas estas carpetas tienen por qu aparecer en cada proyecto Android, tan slo las que se
necesiten. Iremos viendo durante el curso que tipo de elementos se pueden incluir en cada una
de estas carpetas.
Como ejemplo, para un proyecto nuevo Android, se crean por defecto los siguientes recursos
para la aplicacin:
Como se puede observar, existen algunas carpetas en cuyo nombre se incluye un sufijo
adicional, como por ejemplo values-v11 y values-v14. Estos, y otros sufijos, se emplean para
definir recursos independientes para determinados dispositivos segn sus caractersticas. De
esta forma, por ejemplo, los recursos incluidos en la carpeta values-v11 se aplicaran tan slo a
dispositivos cuya versin de Android sea la 3.0 (API 11) o superior. Al igual que el sufijo v
existen otros muchos para referirse a otras caractersticas del terminal, puede consultarse la lista
completa en la documentacin oficial del Android.
Entre los recursos creados por defecto, cabe destacar el layout activity_main.xml, que contiene
la definicin de la interfaz grfica de la pantalla principal de la aplicacin. Si hacemos doble clic
sobre el fichero Eclipse nos mostrar esta interfaz en su editor grfico (tipo arrastrar y soltar) y
como podremos comprobar, en principio contiene tan slo una etiqueta de texto centrada en
pantalla con el mensaje Hello World!.
PGINA 12
Durante el curso no utilizaremos demasiado este editor grfico, sino que modificaremos la
interfaz de nuestras pantallas manipulando directamente el fichero XML asociado (al que se
puede acceder pulsando sobre la pestaa inferior derecha, junto la solapa Graphical Layout
que se observa en la imagen. En este caso, el XML asociado sera el siguiente:
Esto en principio puede parecer mucho ms complicado que utilizar el editor grfico, pero por el
contrario [adems de no ser nada complicado en realidad] nos permitir aprender los entresijos
de Android ms rpidamente.
Carpeta /gen/
Contiene una serie de elementos de cdigo generados automticamente al compilar el
proyecto. Cada vez que generamos nuestro proyecto, la maquinaria de compilacin de Android
genera por nosotros una serie de ficheros fuente java dirigidos al control de los recursos de la
aplicacin. Importante: dado que estos ficheros se generan automticamente tras cada
compilacin del proyecto es importante que no se modifiquen manualmente bajo ninguna
circunstancia.
POR SGOLIVER EL 09/08/2010 EN ANDROID, PROGRAMACIN
PGINA 13
A destacar sobre todo el fichero que aparece desplegado en la imagen anterior, llamadoR.java,
donde se define la clase R.
Esta clase R contendr en todo momento una serie de constantes con los ID de todos los
recursos de la aplicacin incluidos en la carpeta /res/, de forma que podamos acceder fcilmente
a estos recursos desde nuestro cdigo a travs de este dato. As, por ejemplo, la
constante R.drawable.ic_launcher contendr el ID de la imagen ic_launcher.png contenida en la
carpeta /res/drawable/. Veamos como ejemplo la clase R creada por defecto para un proyecto
nuevo:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
package net.sgoliver.android.holausuario;
public final class R {
public static final class attr {
}
public static final class drawable {
public static final int ic_launcher=0x7f020001;
}
public static final class id {
public static final int menu_settings=0x7f070000;
}
public static final class layout {
public static final int activity_main=0x7f030000;
}
PGINA 14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
Como vemos consiste en una simple lista de constantes. En cualquier caso recordemos que no
debemos tocar en ningn momento el cdigo de esta clase.
Carpeta /assets/
Contiene todos los dems ficheros auxiliares necesarios para la aplicacin (y que se incluirn en
su propio paquete), como por ejemplo ficheros de configuracin, de datos, etc.
PGINA 15
Carpeta /libs/
Contendr las libreras auxiliares, normalmente en formato .jar que utilicemos en nuestra
aplicacin Android.
Fichero AndroidManifest.xml
Contiene la definicin en XML de los aspectos principales de la aplicacin, como por ejemplo su
identificacin (nombre, versin, icono, ), sus componentes (pantallas, mensajes, ), las
libreras auxiliares utilizadas, o los permisos necesarios para su ejecucin. Veremos ms
adelante ms detalles de este fichero.
Y con esto todos los elementos principales de un proyecto Android. No pierdas de vista este
proyecto de ejemplo que hemos creado ya que lo utilizaremos en breve como base para crear
nuestra primera aplicacin. Pero antes, en el siguiente apartado hablaremos de los componentes
software principales con los que podemos construir una aplicacin Android.
PGINA 16
En el artculo anterior vimos la estructura de un proyecto Android del curso y aprendimos dnde
colocar cada uno de los elementos que componen una aplicacin, tanto elementos de software
como recursos grficos o de datos. En ste nuevo artculo vamos a centrarnos especficamente
en los primeros, es decir, veremos los distintos tipos de componentes de software con los que
podremos construir una aplicacin Android.
En Java o .NET estamos acostumbrados a manejar conceptos como ventana, control, eventos o
servicios como los elementos bsicos en la construccin de una aplicacin.
Pues bien, en Android vamos a disponer de esos mismos elementos bsicos aunque con un
pequeo cambio en la terminologa y el enfoque. Repasemos los componentes principales que
pueden formar parte de una aplicacin Android [Por claridad, y para evitar confusiones al
consultar documentacin en ingls, intentar traducir lo menos posible los nombres originales de
los componentes].
Activity
Las actividades (activities) representan el componente principal de la interfaz grfica de una
aplicacin Android. Se puede pensar en una actividad como el elemento anlogo a una ventana
o pantalla en cualquier otro lenguaje visual.
View
Las vistas (view) son los componentes bsicos con los que se construye la interfaz grfica de la
aplicacin, anlogo por ejemplo a los controles de Java o .NET. De inicio, Android pone a nuestra
disposicin una gran cantidad de controles bsicos, como cuadros de texto, botones, listas
desplegables o imgenes, aunque tambin existe la posibilidad de extender la funcionalidad de
estos controles bsicos o crear nuestros propios controles personalizados.
Service
Los servicios (service) son componentes sin interfaz grfica que se ejecutan en segundo plano.
En concepto, son similares a los servicios presentes en cualquier otro sistema operativo. Los
servicios pueden realizar cualquier tipo de acciones, por ejemplo actualizar datos, lanzar
notificaciones, o incluso mostrar elementos visuales (p.ej. actividades) si se necesita en algn
momento la interaccin con del usuario.
PGINA 17
Content Provider
Un proveedor de contenidos (content provider) es el mecanismo que se ha definido en Android
para compartir datos entre aplicaciones. Mediante estos componentes es posible compartir
determinados datos de nuestra aplicacin sin mostrar detalles sobre su almacenamiento interno,
su estructura, o su implementacin. De la misma forma, nuestra aplicacin podr acceder a los
datos de otra a travs de los content provider que se hayan definido.
Broadcast Receiver
Un broadcast receiver es un componente destinado a detectar y reaccionar ante determinados
mensajes o eventos globales generados por el sistema (por ejemplo: Batera baja, SMS
recibido, Tarjeta SD insertada, ) o por otras aplicaciones (cualquier aplicacin puede generar
mensajes (intents, en terminologa Android) broadcast, es decir, no dirigidos a una aplicacin
concreta sino a cualquiera que quiera escucharlo).
Widget
Los widgets son elementos visuales, normalmente interactivos, que pueden mostrarse en la
pantalla principal (home screen) del dispositivo Android y recibir actualizaciones peridicas.
Permiten mostrar informacin de la aplicacin al usuario directamente sobre la pantalla principal.
Intent
Un intent es el elemento bsico de comunicacin entre los distintos componentes Android que
hemos descrito anteriormente. Se pueden entender como los mensajes o peticiones que son
enviados entre los distintos componentes de una aplicacin o entre distintas aplicaciones.
Mediante un intent se puede mostrar una actividad desde cualquier otra, iniciar un servicio,
enviar un mensaje broadcast, iniciar otra aplicacin, etc.
PGINA 18
Vamos a partir del proyecto de ejemplo que creamos en un apartado anterior, al que
casualmente llamamos HolaUsuario.
Como ya vimos Eclipse haba creado por nosotros la estructura de carpetas del proyecto y todos
los ficheros necesarios de un Hola Mundo bsico, es decir, una sola pantalla donde se muestra
nicamente un mensaje fijo.
Lo primero que vamos a hacer es disear nuestra pantalla principal modificando la que Eclipse
nos ha creado por defecto. Aunque ya lo hemos comentado de pasada, recordemos dnde y
cmo se define cada pantalla de la aplicacin. En Android, el diseo y la lgica de una pantalla
estn
separados
en
dos
ficheros
distintos.
Por
un
lado,
en
el
PGINA 19
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/LinearLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<TextView
android:id="@+id/LblNombre"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/nombre" />
<EditText
android:id="@+id/TxtNombre"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="text">
</EditText>
<Button
android:id="@+id/BtnHola"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/hola" />
</LinearLayout>
En este XML se definen los elementos visuales que componen la interfaz de nuestra pantalla
principal y se especifican todas sus propiedades. No nos detendremos mucho por ahora en cada
detalle, pero expliquemos un poco lo que vemos en el fichero.
Lo primero que nos encontramos es un elemento LinearLayout. Los layout son elementos no
visibles que determinan cmo se van a distribuir en el espacio los controles que incluyamos en
POR SGOLIVER EL 09/08/2010 EN ANDROID, PROGRAMACIN
PGINA 20
android:id. ID del control, con el que podremos identificarlo ms tarde en nuestro cdigo.
Vemos que el identificador lo escribimos precedido de @+id/. Esto tendr comoefecto que al
compilarse el proyecto se genere automticamente una nueva constante en la clase R para
dicho control. As, por ejemplo, como al cuadro de texto le hemos asignado el ID TxtNombre,
podremos ms tarde acceder al l desde nuestro cdigo haciendo referencia a la
constante R.id.TxtNombre.
<TextView
PGINA 21
2
3
4
5
android:id="@+id/LblNombre"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Escribre tu nombre:" />
<resources>
...
<string name="nombre">Escribe tu nombre:</string>
...
</resources>
<TextView
android:id="@+id/LblNombre"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/nombre" />
Esta segunda alternativa nos permite tener perfectamente localizadas y agrupadas todas las
cadenas de texto utilizadas en la aplicacin, lo que nos podra facilitar por ejemplo la traduccin
de la aplicacin a otro idioma.Con esto ya tenemos definida la presentacin visual de nuestra
ventana principal de la aplicacin. De igual forma definiremos la interfaz de la segunda pantalla,
creando un nuevo fichero llamado activity_saludo.xml, y aadiendo esta vez tan solo una
etiqueta (TextView) para mostrar el mensaje personalizado al usuario.
Para aadir el fichero, pulsaremos el botn derecho del ratn sobre la carpeta de
recursos/res/layout y pulsaremos la opcin New Android XML file.
PGINA 22
En el cuadro de dilogo que nos aparece indicaremos como tipo de recurso Layout,
indicaremos el nombre del fichero (con extensin .xml) y como elemento raz
seleccionaremosLinearLayout. Finalmente pulsamos Finish para crear el fichero.
Eclipse crear entonces el nuevo fichero y lo abrir en el editor grfico, aunque como ya
indicamos, nosotros accederemos a la solapa de cdigo para modificar directamente el
contenido XML del fichero.
POR SGOLIVER EL 09/08/2010 EN ANDROID, PROGRAMACIN
PGINA 23
Una vez definida la interfaz de las pantallas de la aplicacin deberemos implementar la lgica de
la misma. Como ya hemos comentado, la lgica de la aplicacin se definir en ficheros java
independientes. Para la pantalla principal ya tenemos creado un fichero por defecto
llamadoMainActivity.java. Empecemos por comentar su cdigo por defecto:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
package net.sgoliver.android.holausuario;
import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;
public class MainActivity extends Activity {
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.activity_main, menu);
return true;
}
}
PGINA 24
Como ya vimos en un apartado anterior, las diferentes pantallas de una aplicacin Android se
definen mediante objetos de tipo Activity. Por tanto, lo primero que encontramos en nuestro
fichero java es la definicin de una nueva clase MainActivity que extiende a Activity. El nico
mtodo que modificaremos de esta clase ser el mtodo onCreate(), llamado cuando se crea por
primera vez la actividad. En este mtodo lo nico que encontramos en principio, adems de la
llamada
su
implementacin
en
la
clase
padre,
es
la
llamada
al
del
mtodo onCreate(),
vemos
que
tambin
se
sobrescribe
el
En el cuadro de dilogo que nos aparece indicaremos el nombre (Name) de la nueva clase y su
clase padre (Superclass) como android.app.Activity.
PGINA 25
Pulsaremos Finish y Eclipse crear el nuevo fichero y lo abrir en el editor de cdigo java.
Modificaremos por ahora el cdigo de la clase para que quede algo anlogo a la actividad
principal:
1
2
3
4
5
6
7
8
9
10
11
12
package net.sgoliver.android.holausuario;
import android.app.Activity;
import android.os.Bundle;
public class FrmSaludo extends Activity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_saludo);
}
}
NOTA: Todos los pasos anteriores de creacin de una nueva pantalla (layout xml + clase java) se
puede realizar tambin mediante un asistente de Eclipse al que se accede mediante el men
contextual New / Other / Android / Android Activity. Sin embargo, he preferido explicarlo de
esta forma para que quedaran claros todos los pasos y elementos necesarios.
PGINA 26
Sigamos. Por ahora, el cdigo incluido en estas clases lo nico que hace es generar la interfaz
de la actividad. A partir de aqu nosotros tendremos que incluir el resto de la lgica de la
aplicacin.
Y vamos a empezar con la actividad principal MainActivity, obteniendo una referencia a los
diferentes controles de la interfaz que necesitemos manipular, en nuestro caso slo el cuadro de
texto y el botn. Para ello utilizaremos el mtodo findViewById() indicando el ID de cada control,
definidos como siempre en la clase R. Todo esto lo haremos dentro del mtodoonCreate() de la
clase MainActivity, justo a continuacin de la llamada asetContentView() que ya comentamos:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
...
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;
import android.widget.EditText;
...
public class MainActivity extends Activity {
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//Obtenemos una referencia a los controles de la interfaz
final EditText txtNombre = (EditText)findViewById(R.id.TxtNombre);
final Button btnHola = (Button)findViewById(R.id.BtnHola);
...
}
}
...
Como vemos, hemos aadido tambin varios import adicionales para tener acceso a todas las
clases utilizadas.
PGINA 27
Una vez tenemos acceso a los diferentes controles, ya slo nos queda implementar las acciones
a tomar cuando pulsemos el botn de la pantalla. Para ello, continuando el cdigo anterior, y
siempre dentro del mtodo onCreate(), implementaremos el evento onClick de dicho botn,
veamos cmo:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
...
import android.content.Intent;
...
public class MainActivity extends Activity {
@Override
public void onCreate(Bundle savedInstanceState) {
...
//Obtenemos una referencia a los controles de la interfaz
final EditText txtNombre = (EditText)findViewById(R.id.TxtNombre);
final Button btnHola = (Button)findViewById(R.id.BtnHola);
//Implementamos el evento click del botn
btnHola.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
//Creamos el Intent
Intent intent =
new Intent(MainActivity.this, FrmSaludo.class);
//Creamos la informacin a pasar entre actividades
Bundle b = new Bundle();
b.putString("NOMBRE", txtNombre.getText().toString());
//Aadimos la informacin al intent
intent.putExtras(b);
//Iniciamos la nueva actividad
startActivity(intent);
}
});
}
PGINA 28
38
39
40
41
}
...
Comenzaremos
de
forma
anloga
la
anterior,
ampliando
el
mtodo onCreate()obteniendo las referencias a los objetos que manipularemos, esta vez slo la
etiqueta de texto. Tras esto viene lo ms interesante, debemos recuperar la informacin pasada
desde la actividad principal y asignarla como texto de la etiqueta. Para ello accederemos en
primer lugar al intent que ha originado la actividad actual mediante el mtodo getIntent() y
recuperaremos su informacin asociada (objeto Bundle) mediante el mtodo getExtras().
Hecho esto tan slo nos queda construir el texto de la etiqueta mediante su
mtodosetText(texto) y recuperando el valor de nuestra clave almacenada en el
objeto Bundlemediante getString(clave).
1
package net.sgoliver.android.holausuario;
PGINA 29
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
import android.app.Activity;
import android.os.Bundle;
import android.widget.TextView;
public class FrmSaludo extends Activity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_saludo);
//Localizar los controles
TextView txtSaludo = (TextView)findViewById(R.id.TxtSaludo);
//Recuperamos la informacin pasada en el intent
Bundle bundle = this.getIntent().getExtras();
//Construimos el mensaje a mostrar
txtSaludo.setText("Hola " + bundle.getString("NOMBRE"));
}
}
Con esto hemos concluido la lgica de las dos pantallas de nuestra aplicacin y tan slo nos
queda un paso importante para finalizar nuestro desarrollo. Como ya indicamos en un apartado
anterior, toda aplicacin Android utiliza un fichero especial en formato XML (AndroidManifest.xml)
para definir, entre otras cosas, los diferentes elementos que la componen. Por tanto, todas las
actividades de nuestra aplicacin deben quedar convenientemente recogidas en este fichero. La
actividad principal ya debe aparecer puesto que se cre de forma automtica al crear el nuevo
proyecto Android, por lo que debemos aadir tan slo la segunda.
Para este ejemplo nos limitaremos a incluir la actividad en el XML mediante una nueva
etiqueta<Activity>, indicar el nombre de la clase java asociada como valor del
atributoandroid:name, y asignarle su ttulo mediante el atributo android:label, ms adelante
veremos que opciones adicionales podemos especificar. Todo esto lo incluiremos justo debajo de
la definicin de la actividad principal dentro del fichero AndroidManifest.xml:
1
2
3
4
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="net.sgoliver.android.holausuario"
android:versionCode="1"
android:versionName="1.0" >
PGINA 30
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
...
<activity
android:name=".MainActivity"
android:label="@string/title_activity_main" >
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
<activity android:name=".FrmSaludo"
android:label="@string/title_activity_saludo" >
</activity>
</application>
</manifest>
Como vemos, el ttulo de la nueva actividad lo hemos indicado como referencia a una nueva
cadena de caracteres, que tendremos que incluir como ya hemos comentado anteriormente en
el fichero /res/values/strings.xml
Llegados aqu, y si todo ha ido bien, deberamos poder ejecutar el proyecto sin errores y probar
nuestra aplicacin en el emulador.
La forma de ejecutar y depurar la aplicacin en Eclipse es anloga a cualquier otra aplicacin
java, pero por ser el primer captulo vamos a recordarla.
Lo primero que tendremos que hacer ser configurar un nuevo perfil de ejecucin. Para ello
accederemos al men Run/ Run Configurations y nos aparecer la siguiente pantalla.
PGINA 31
El resto de opciones las dejaremos por defecto y pasaremos a la pestaa Target. En esta
segunda pestaa podremos seleccionar el AVD sobre el que queremos ejecutar la aplicacin,
aunque suele ser prctico indicarle a Eclipse que nos pregunte esto antes de cada ejecucin, de
forma que podamos ir alternando fcilmente de AVD sin tener que volver a configurar el perfil.
Para ello seleccionaremos la opcin Always prompt to pick device.
PGINA 32
Un poco ms abajo en esta misma pestaa es bueno marcar la opcin Disable Boot Animation
para acelerar un poco el primer arranque del emulador, y normalmente tambin suele ser
necesario reducir, o mejor dicho escalar, la pantalla del emulador de forma que podamos verlo
completo en la pantalla de nuestro PC. Esto se configura mediante la opcin Additional
Emulator Command Line Options, donde en mi caso indicar la opcin -scale 0.75, aunque
este valor depender de la resolucin de vuestro monitor y de la configuracin del AVD.
Tras esto ya podramos pulsar el botn Run para ejecutar la aplicacin en el emulador de
Android. Eclipse nos preguntar en qu dispositivo queremos ejecutar y nos mostrar dos listas.
La primera de ellas con los dispositivos que haya en ese momento en funcionamiento (por
ejemplo si ya tenamos un emulador funcionando) y la siguiente con el resto de AVDs
configurados en nuestro entorno. Elegir en primer lugar el emulador con Android 2.2. Es posible
que la primera ejecucin se demore unos minutos, todo depender de las posibilidades de
vuestro PC, as que paciencia.
PGINA 33
Si todo va bien, tras una pequea espera aparecer el emulador de Android y se iniciar
automticamente nuestra aplicacin. Podemos probar a escribir un nombre y pulsar el botn
Hola para comprobar si el funcionamiento es el correcto.
Sin cerrar este emulador podramos volver a ejecutar la aplicacin sobre Android 4.2
seleccionando el AVD correspondiente. De cualquier forma, si vuestro PC no es demasiado
potente no recomiendo tener dos emuladores abiertos al mismo tiempo.
PGINA 34
Y con esto terminamos por ahora. Espero que esta aplicacin de ejemplo les sea de ayuda para
aprender los temas bsicos en el desarrollo de aplicaciones en Android, como por ejemplo la
definicin de la interfaz grfica, el cdigo java necesarios para acceder y manipular los
elementos de dicha interfaz, y la forma de comunicar diferentes actividades de Android. En los
apartados siguientes veremos algunos de estos temas de forma mucho ms especfica.
PGINA 35
PGINA 36
utilizando una versin de la API de Android inferior a la 8 (Android 2.2), en vez de match_parent
debers utilizar su equivalente fill_parent.
Ejemplo:
1
<FrameLayout
2
xmlns:android="http://schemas.android.com/apk/res/android"
3
android:layout_width="match_parent"
4
android:layout_height="match_parent">
5
6
<EditText android:id="@+id/TxtNombre"
7
android:layout_width="match_parent"
8
android:layout_height="match_parent"
9
android:inputType="text" />
10
11
</FrameLayout>
Con el cdigo anterior conseguimos un layout tan sencillo como el siguiente:
LinearLayout
El siguiente tipo de layout en cuanto a nivel de complejidad es el LinearLayout. Este layout apila
uno tras otro todos sus elementos hijos de forma horizontal o vertical segn se establezca su
propiedad android:orientation.
Al igual que en un FrameLayout, los elementos contenidos en un LinearLayout pueden
establecer sus propiedades android:layout_width y android:layout_height para determinar sus
dimensiones dentro del layout. Pero en el caso de un LinearLayout, tendremos otro parmetro
con el que jugar, la propiedad android:layout_weight.
1
<LinearLayout
2
xmlns:android="http://schemas.android.com/apk/res/android"
3
android:layout_width="match_parent"
4
android:layout_height="match_parent"
5
android:orientation="vertical">
6
7
<EditText android:id="@+id/TxtNombre"
8
android:layout_width="match_parent"
9
android:layout_height="match_parent" />
POR SGOLIVER EL 09/08/2010 EN ANDROID, PROGRAMACIN
PGINA 37
10
11
<Button android:id="@+id/BtnAceptar"
12
android:layout_width="wrap_content"
13
android:layout_height="match_parent" />
14
15
</LinearLayout>
Esta propiedad nos va a permitir dar a los elementos contenidos en el layout unas dimensiones
proporcionales entre ellas. Esto es ms dificil de explicar que de comprender con un ejemplo. Si
incluimos en un LinearLayout vertical dos cuadros de texto (EditText) y a uno de ellos le
establecemos
un layout_weight=1 y
al
otro
un layout_weight=2 conseguiremos
comoefecto que toda la superficie del layout quede ocupada por los dos cuadros de texto y que
adems el segundo sea el doble (relacin entre sus propiedades weight) de alto que el primero.
1
<LinearLayout
2
xmlns:android="http://schemas.android.com/apk/res/android"
3
android:layout_width="match_parent"
4
android:layout_height="match_parent"
5
android:orientation="vertical">
6
7
<EditText android:id="@+id/TxtDato1"
8
android:layout_width="match_parent"
9
android:layout_height="match_parent"
10
android:inputType="text"
11
android:layout_weight="1" />
12
13
<EditText android:id="@+id/TxtDato2"
14
android:layout_width="match_parent"
15
android:layout_height="match_parent"
16
android:inputType="text"
17
android:layout_weight="2" />
18
19
</LinearLayout>
Con el cdigo anterior conseguiramos un layout como el siguiente:
As pues, a pesar de la simplicidad aparente de este layout resulta ser lo suficiente verstil como
para sernos de utilidad en muchas ocasiones.
PGINA 38
TableLayout
Un TableLayout permite distribuir sus elementos hijos de forma tabular, definiendo las filas y
columnas necesarias, y la posicin de cada componente dentro de la tabla.
La estructura de la tabla se define de forma similar a como se hace en HTML, es decir, indicando
las filas que compondrn la tabla (objetos TableRow), y dentro de cada fila las columnas
necesarias, con la salvedad de que no existe ningn objeto especial para definir una columna
(algo as como un TableColumn) sino que directamente insertaremos los controles necesarios
dentro del TableRow y cada componente insertado (que puede ser un control sencillo o incluso
otro ViewGroup) corresponder a una columna de la tabla. De esta forma, el nmero final de filas
de la tabla se corresponder con el nmero de elementos TableRowinsertados, y el nmero total
de columnas quedar determinado por el nmero de componentes de la fila que ms
componentes contenga.
Por norma general, el ancho de cada columna se corresponder con el ancho del mayor
componente de dicha columna, pero existen una serie de propiedades que nos ayudarn a
modificar este comportamiento:
<TableLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<TableRow>
<TextView android:text="Celda 1.1" />
<TextView android:text="Celda 1.2" />
<TextView android:text="Celda 1.3" />
</TableRow>
<TableRow>
PGINA 39
13
<TextView android:text="Celda 2.1" />
14
<TextView android:text="Celda 2.2" />
15
<TextView android:text="Celda 2.3" />
16
</TableRow>
17
18
<TableRow>
19
<TextView android:text="Celda 3.1"
20
android:layout_span="2" />
21
<TextView android:text="Celda 3.2" />
22
</TableRow>
23
</TableLayout>
El layout resultante del cdigo anterior sera el siguiente:
GridLayout
Este tipo de layout fue incluido a partir de la API 14 (Android 4.0) y sus caractersticas son
similares al TableLayout, ya que se utiliza igualmente para distribuir los diferentes elementos de
la interfaz de forma tabular, distribuidos en filas y columnas. La diferencia entre ellos estriba en la
forma que tiene el GridLayout de colocar y distribuir sus elementos hijos en el espacio disponible.
En este caso, a diferencia del TableLayout indicaremos el nmero de filas y columnas como
propiedades del layout, mediante android:rowCount yandroid:columnCount. Con estos datos ya
no es necesario ningn tipo de elemento para indicar las filas, como hacamos con el
elemento TableRow del TableLayout, sino que los diferentes elementos hijos se irn colocando
ordenadamente por filas o columnas (dependiendo de la propiedad android:orientation) hasta
completar el nmero de filas o columnas indicadas en los atributos anteriores. Adicionalmente,
igual
que
en
el
caso
anterior,
tambin
tendremos
disponibles
las
propiedades android:layout_rowSpan yandroid:layout_columnSpan para conseguir que una
celda ocupe el lugar de varias filas o columnas.
Existe tambin una forma de indicar de forma explcita la fila y columna que debe ocupar un
determinado elemento hijo contenido en el GridLayout, y se consigue utilizando los
atributosandroid:layout_row y android:layout_column. De cualquier forma, salvo para
configuraciones complejas del grid no suele ser necesario utilizar estas propiedades.
PGINA 40
Con todo esto en cuenta, para conseguir una distribucin equivalente a la del ejemplo anterior
del TableLayout, necesitaramos escribir un cdigo como el siguiente:
1
<GridLayout
2
xmlns:android="http://schemas.android.com/apk/res/android"
3
android:layout_width="match_parent"
4
android:layout_height="match_parent"
5
android:rowCount="2"
6
android:columnCount="3"
7
android:orientation="horizontal" >
8
9
<TextView android:text="Celda 1.1" />
10
<TextView android:text="Celda 1.2" />
11
<TextView android:text="Celda 1.3" />
12
13
<TextView android:text="Celda 2.1" />
14
<TextView android:text="Celda 2.2" />
15
<TextView android:text="Celda 2.3" />
16
17
<TextView android:text="Celda 3.1"
18
android:layout_columnSpan="2" />
19
20
<TextView android:text="Celda 3.2" />
21
22
</GridLayout>
RelativeLayout
El ltimo tipo de layout que vamos a ver es el RelativeLayout. Este layout permite especificar la
posicin de cada elemento de forma relativa a su elemento padre o a cualquier otro elemento
incluido en el propio layout. De esta forma, al incluir un nuevo elemento X podremos indicar por
ejemplo que debe colocarse debajo del elemento Y y alineado a la derecha del layout padre.
Veamos esto en el ejemplo siguiente:
1
<RelativeLayout
2
xmlns:android="http://schemas.android.com/apk/res/android"
3
android:layout_width="match_parent"
4
android:layout_height="match_parent" >
5
6
<EditText android:id="@+id/TxtNombre"
7
android:layout_width="match_parent"
8
android:layout_height="wrap_content"
9
android:inputType="text" />
10
11
<Button android:id="@+id/BtnAceptar"
12
android:layout_width="wrap_content"
13
android:layout_height="wrap_content"
14
android:layout_below="@id/TxtNombre"
15
android:layout_alignParentRight="true" />
16
</RelativeLayout>
PGINA 41
android:layout_above.
android:layout_below.
android:layout_toLeftOf.
android:layout_toRightOf.
android:layout_alignLeft.
android:layout_alignRight.
android:layout_alignTop.
android:layout_alignBottom.
android:layout_alignBaseline.
Posicin relativa al layout padre:
android:layout_alignParentLeft.
android:layout_alignParentRight.
android:layout_alignParentTop.
android:layout_alignParentBottom.
android:layout_centerHorizontal.
android:layout_centerVertical.
android:layout_centerInParent.
Opciones de margen (tambin disponibles para el resto de layouts):
android:layout_margin.
android:layout_marginBottom.
android:layout_marginTop.
android:layout_marginLeft.
POR SGOLIVER EL 09/08/2010 EN ANDROID, PROGRAMACIN
PGINA 42
android:layout_marginRight.
Opciones de espaciado o padding (tambin disponibles para el resto de layouts):
android:padding.
android:paddingBottom.
android:paddingTop.
android:paddingLeft.
android:paddingRight.
En prximos artculos veremos otros elementos comunes que extienden a ViewGroup, como por
ejemplo las vistas de tipo lista (ListView), de tipo grid (GridView), y en pestaas
(TabHost/TabWidget).
Puedes consultar y/o descargar el cdigo completo de los ejemplos desarrollados en este
artculo accediendo a la pagina del curso en GitHub.
PGINA 43