Como iniciarse programando aplicaciones en android

Cómo iniciarse programando aplicaciones con Android SDK

Este artículo está en construcción.

Por esta razón, seguramente habrá lagunas en el contenido o en el formato. Por favor, antes de cambiar el contenido, consulta la página de discusión del artículo.

Razón: Cómo por acabar, de momento es una traducción literal del original, al acabar la traducción se añadirán pequeñas aportaciones propias



Este artículo debe ser dividido.

Contiene demasiada información que podría estar en artículos separados. Consulta la página de discusión del artículo si quieres colaborar con su división.

Razón: Dividir en artículos más pequeños



Contenido
[ocultar]

1 Introducción
2 Elementos necesarios
3 Preparando el entorno de programación
4 Instalar y configurar Eclipse
4.1 Añadir el plugin ADT a Eclipse
4.2 Configurar el plugin ADT
4.3 Añadir las plataformas de Android y otros componentes
4.4 Crear un dispositivo virtual de Android (AVD)
5 Primer ejemplo: Hola Mundo!
5.1 Construcción de la Interfaz de Usuario
5.2 Ejecutar la aplicación
5.3 Actualizar la interfaz de usuario a una plantilla XML
5.3.1 R class
5.4 Depura tu proyecto
6 Siguientes ejemplo básicos, vistas y otros componentes
6.1 Layouts
6.1.1 Linear Layout
6.1.2 Relative Layout
6.1.3 Table Layout
6.1.4 Grid View
6.1.5 Tab Layout
6.1.6 List View
6.2 Widgets & Other Views
6.2.1 Date Picker
6.2.2 Time Picker
6.2.3 Form Stuff
6.2.4 Spinner
6.2.5 Auto Complete
6.2.6 Gallery
6.2.7 Google Map View
6.2.8 Web View
7 Soporte de localización
8 Enlaces oficiales
9 Aportaciones

Introducción

Bienvenido al desarrollo para Android, en este artículo va a introducirse en los elementos necesarios para poder iniciarse, así como a algunos ejemplos básicos para familiarizarse con el entorno.


Elementos necesarios

Android SDK
Eclipse Classic


Preparando el entorno de programación

Lo más sencillo es añadir la ruta de la carpeta tools del SDK al PATH del sistema, esta carpeta se encuentra dentro del Android SDK en la raíz. Así que nos bastará con descomprimir el Android SDK y guardarlo en una ruta que conozcamos (recomiendo "Archivos de programa" para Windows y /opt para Linux, para OS X desconozco rutas similares), para asegurar que el nombre de la carpeta del Android SDK es siempre la misma, recomiendo renombrarla a "android-sdk", ya que para futuras versiones se actualizarán los archivos de su interior.

Añadiendo la carpeta tools del Android SDK al PATH del sistema conseguimos utilizar estas herramientas sin necesidad de escribir la ruta completa, o tener que movernos hasta ese directorio, permitiéndonos utilizar por ejemplo el comando adb (Android Debug Bridge) o cualquier otro comando directamente desde un terminal.

Para Linux, editar ~/.bash_profile o ~/.bashrc y buscar en su interior alguna referencia a PATH, en ella habrá que añadir la ruta completa a la carpeta tools del Android SDK. Si no aparece ninguna, deberemos añadir algo así si se siguen las recomendaciones indicadas:

export PATH=${PATH}:/opt/android-sdk/tools

Para Mac OS X, buscar en la carpeta de usuario .bash_profile y proceder como en Linux. También es posible crear dicho archivo en caso que no exista.
Para Windows, click derecho en "Mi PC" o "Equipo" y seleccionar "Propiedades". En la pestaña "Avanzado" pulsar el botón "Variables de entorno" y en el dialogo que aparecerá seleccionar Path (debajo de las Variables del sistema). Añadir la ruta completa a la carpeta tools del Android SDK (C:\Archivos de programa\android-sdk\tools).


Instalar y configurar Eclipse

Instalaremos la versión de Eclipse indicada en la sección de elementos necesarios como haríamos con cualquier otro tipo de aplicación.


Añadir el plugin ADT a Eclipse

Ejecutamos Eclipse, y seleccionamos Ayuda -> Instalar nuevo Software.
En el dialogo Software disponible, pulsamos Añadir...
En el dialogo de Añadir sitio que aparece, introducimos un nombre para el sitio remoto, por ejemplo "Android Plugin" en el campo nombre.
En el campo "Ubicación" introducimos esta dirección: https://dl-ssl.google.com/android/eclipse/

Nota: Si hay algún problema adquiriendo el plugin, se deberá probar con http://dl-ssl.google.com/android/eclipse/

Pulsamos Aceptar
Volvemos a Software disponible y ahora veremos "Developer Tools" añadido en la lista. Seleccionamos su casilla y automáticamente se seleccionarán las herramientas necesarias Android DDMS y Android Development Tools. Pulsamos en Siguiente.
En el siguiente dialogo pulsamos Siguiente para poder leer, aceptar la licencia e instalar cualquier dependencia, seguidamente pulsamos Finalizar.
Cuando finalice la instalación, reiniciamos Eclipse.


Configurar el plugin ADT

Una vez finalizado el paso anterior, el siguiente paso es modificar las preferencias de ADT en Eclipse para que apunte al directorio del Android SDK:

Seleccionamos Ventana -> Preferencias... para abrir el panel de Preferencias.
Seleccionamos Android del panel izquierdo.
Para la ruta del Android SDK pulsamos el botón "Localizar" y buscamos la ruta en la que guardamos el Android SDK.
Pulsamos Aplicar y después Aceptar.

Hecho! Si no te has encontrado con ningún problema, la instalación se ha completado. Para cualquier problema puede verse la documentación en la web del proyecto.


Añadir las plataformas de Android y otros componentes

El SDK usa una estructura modular que separa las partes más importantes del SDK en:

Versiones de las plataformas de Android
Complementos (Add-ons)
Herramientas (Tools)
Ejemplos (Samples)
Documentación de las API's

Estas partes se encuentran en componentes instalables por separado. El paquete inicial del SDK que se ha descargado anteriormente, solo incluye un único componente: la última versión de las herramientas del SDK. Para desarrollar cualquier aplicación para Android, también es necesario descargar por lo menos una plataforma de Android en tu entorno, así como componentes adicionales que también son muy recomendables.

El repositorio del SDK ofrece el siguiente tipo de componentes:

Las herramientas SDK (pre-instalada en el paquete inicial del Android SDK): Contiene un paquete completo de herramientas para el SDK enfocadas al desarrollo, depuración y testeo de aplicaciones.
Los complementos SDK: Proveen de un entorno de desarrollo para una librería externa especifica o personalizada de Android (pero totalmente compatible) con las imágenes de sistema Android. El repositorio de Android SDK ofrece el complemento de las API's de Google, las cuales permiten que las aplicaciones accedan a una gran cantidad de posibilidades de la librería com.google.android.maps.
Drivers USB para Windows: Contiene drivers para Windows, para poder ejecutar y depurar las aplicaciones desde tu terminal actual. Este driver no es necesario si no tienes pensado depurar tus aplicaciones en un terminal con Android.
Ejemplos: Contiene código de ejemplo y aplicacioens disponibles para cada plataforma de desarrollo Android. Si estas empezando asegúrate de descargar estos ejemplos en tu SDK.
Documentación: Contiene una copia local de la última versión de la documentación para el Android framework API.

Para descargar los componentes debe utilizar el entorno gráfico del Android SDK y AVD Manager.

sdk_manager_packages.png

Recomiendo descargar todas las partes para asegurar que no faltan dependencias y que las aplicaciones desarrolladas son compatibles con todas las versiones de Android.

Consultar la web oficial para más detalles acerca de la instalación y configuración


Crear un dispositivo virtual de Android (AVD)

Este paso es necesario si va a desarrollarse para Android sin disponer de un terminal o si queremos hacer las pruebas utilizando un terminal virtual.

Desde Eclipse, elegimos Ventana --> Android SDK and AVD Manager.
Seleccionamos Virtual Devices en el panel izquierdo.
Pulsamos New.
Aparece el dialogo de Create New AVD.
Escribimos el nombre para el AVD, por ejemplo "Mi_Androide".
En el desplegable Target, elegimos la versión de la plataforma que queremos utilizar, por ejemplo la última versión disponible.
Podemos omitir el resto de campos por el momento.
Pulsamos en Create AVD.

NOTA: Si quisiéramos utilizar una imagen system.img de nuestro terminal, deberíamos crear un AVD de la misma versión de Android que el de nuestro system.img y una vez creado hacer:

./emulator -avd -system //system.img


Primer ejemplo: Hola Mundo!

La información más completa y en inglés puede encontrarse aquí

Desde Eclipse, seleccionamos Archivo -> Nuevo -> Proyecto.

Si el plugin de ADT para Eclipse se ha instalado correctamente, en el siguiente dialogo veremos una carpeta llamada "Android" que contiene "Android Project". (Después de crear uno o más proyectos para Android, también aparecerá una entrada llamada "Android XML File")

Seleccionamos "Android Project" y pulsamos Siguiente.

hello_world_0.png

En los detalles del proyecto rellenamos los siguientes de este modo:
Project name: HelloAndroid
Application name: Hello, Android
Package name: com.example.helloandroid (or your own private namespace)
Create Activity: HelloAndroid
Pulsamos en Finalizar.

hello_world_1.png

Tu proyecto Android ya esta preparado. Estará visible en el Explorador de paquetes que esta en la izquierda. Abrimos el archivo HelloAndroid.java, que lo encontramos en HelloAndroid > src > com.example.helloandroid. Y contendrá algo como esto:

package com.example.helloandroid;

import android.app.Activity;
import android.os.Bundle;

public class HelloAndroid extends Activity {
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
}
}

Debe observarse que la clase se basa en la clase Activity (de actividad). Una actividad es una entidad única de aplicación que se utiliza para realizar determinadas acciones. Una aplicación pueden tener actividades separadas, pero el usuario interactúa con una de ellas a la vez. El onCreate() es un método que será llamado por el sistema Android cuando se inicia la actividad, que es donde se debe realizar todas las inicializaciones y configuraciones de la interfaz de usuario. Una actividad no requiere tener una interfaz de usuario, pero por lo general si la tiene.

Ahora vamos a modificar algo de código!


Construcción de la Interfaz de Usuario

Echa un vistazo a la revisión del código que hay a continuación y luego haz los mismos cambios a tu clase HelloAndroid. Los elementos en negrita son las líneas que se han agregado.

package com.android.helloandroid;

import android.app.Activity;
import android.os.Bundle;
import android.widget.TextView;

public class HelloAndroid extends Activity {
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
TextView tv = new TextView(this);
tv.setText("Hola Android!");
setContentView(tv);
}
}

Truco: Una manera fácil de agregar paquetes a tu proyecto de importación es pulsar Ctrl-Shift-O (Cmd-Shift-O, en Mac). Se trata de un acceso directo de Eclipse que identifica los paquetes que faltan basado en el código y los añade para ti.

Una interfaz de usuario de Android esta compuesta por jerarquías de objetos llamadas Views (vistas). Una vista es un objeto dibujable usado como un elemento en tu disposición de la interfaz, tales como botones, imágenes, o como en este caso, una etiqueta de texto. Cada uno de estos objetos es una subclase de la clase vista y la subclase que emplea texto se llama TextView.

En este caso se crea un TextView con el constructor de la clase, que acepta una instancia de contexto Android como su parámetro. Un contexto es un identificador para el sistema, al que se le ofrece de servicios tales como la resolución de recursos, la obtención de acceso a bases de datos y sus preferencias, y así sucesivamente. La clase hereda de la actividad a partir del contexto, y debido a que su clase HelloAndroid es una subclase de la actividad, también es un contexto. Por tanto se puede pasar esto como su referencia contextual al TextView.

A continuación definimos el contenido del texto con setText().

Y por último, se pasa al TextView a setContentView() con la finalidad de mostrarlo como el contenido de la interfaz de usuario de la actividad. Si la actividad no llama a este método a continuación, entonces no habrá interfaz de usuario y el sistema mostrará una pantalla en blanco.

Ahí está, "Hola Android!". El siguiente paso, por supuesto, es ver la aplicación en funcionamiento.


Ejecutar la aplicación

El plugin de Eclipse lo hace fácil para ejecutar tus aplicaciones:

Seleccionar Ejecutar --> Ejecutar.
Seleccionar "Android Application".

Para aprender más sobre crear y editar configuraciones de ejecución en Eclipse, dirígete a Developing In Eclipse con ADT. El plugin de Eclipse automáticamente crea una nueva configuración de ejecución para tu proyecto y seguidamente abre el emulador de Android. Dependiendo de tu entorno, el emulador de Android puede necesitar varios minutos para arrancar completamente, así que puede que debas ser paciente. Cuando el emulador haya arrancado, el plugin de Eclipse instalara tu aplicación y la ejecutará con la actividad por defecto. Deberías ver algo como esto:

hello_world_5.png

El "Hola, Android!" que puedes ver en la barra gris es el título de la aplicación. El plugin de Eclipse lo crea automáticamente (es la cadena definida en res/values/strings.xml y esta referenciada en tu AndroidManifest.xml). El texto que sigue al título es el texto actual que has creado en el objeto TextView.

Aquí concluye el tutorial básico "Hola Mundo!", pero puedes continuar leyendo algo más de información valiosa sobre el desarrollo de aplicaciones para Android.


Actualizar la interfaz de usuario a una plantilla XML

El ejemplo "Hola Mundo!" que acabas de completar utiliza lo que se llama una "programático" de diseño de interfaz de usuario. Esto significa que la interfaz de usuario de la aplicación se construyó directamente desde el código fuente. Este enfoque es muy frágil debido a que pequeños cambios en la disposición pueden dar lugar a grandes quebraderos de cabeza y de código. También es fácil olvidarse de conectar correctamente Vistas en conjunto, lo que puede dar lugar a errores en el diseño y perdida de tiempo de depuración del programa.

Es por eso que Android ofrece un modelo de construcción de interfaz de usuario alternativo basado en XML. La forma más sencilla de explicar este concepto es mostrar un ejemplo. Aquí hay un archivo de diseño XML que es idéntico al comportamiento para el ejemplo recién hecho:


android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:text="@string/hello"/>


La estructura general de un archivo Android XML es simple: es un árbol de elementos XML, donde cada nodo es el nombre de una clase View (este ejemplo, sin embargo, solo tiene un elemento View). Puedes utilizar el nombre de cualquier clase que extiende las View como un elemento en tu XML, incluyendo clases personalizadas que hayas definido en tu propio código. Esta estructura hace que sea fácil construir rápidamente una interfaz de usuario, utilizando una estructura más sencilla y una sintaxis que debe utilizar un diseño programático. Este modelo se inspira en el modelo de desarrollo web, donde se puede separar la presentación de la aplicación de su lógica, donde se utilizan campos para recoger y rellenar datos.

Estos archivos XML se encuentran en el proyecto en la ruta res/layout. La carpeta "res" es la abreviación de "resources" que significa recursos y contiene todos los componentes que no son código que la aplicación requiera. Además de los archivos de diseño, los recursos también pueden incluir imágenes, sonidos y traducciones.

El plugin de Eclipse crea automáticamente los archivos necesarios como main.xml. En la aplicación "Hola Mundo!" que acabamos de realizar, este archivo se ignoró y fue creado desde el diseño de programación. Se hizo así para que viéramos que es posible, pero se debe definir casi siempre su diseño en un archivo XML en lugar de en el propio código. A continuación se explicará como modifica la aplicación existente para utilizar el diseño XML.

En el Explorador de paquetes de Eclipse, expandimos la carpeta /res/layout/ y abrimos main.xml (una vez abierta, clicamos en "main.xml" para ver su ventana de código fuente). Reemplazamos el contenido por el siguiente XML:


android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:text="@string/hello"/>

Guardamos el archivo.
Dentro de la carpeta res/values/, abrimos strings.xml. Aquí es donde deben guardarse todas las cadenas de texto que la interfaz de usuario utilice por defecto. ADT debería haber iniciado dos cadenas, hello y app_name. Renombra hello a alguna otra cosa. Tal vez "Hola, Android! Soy un recurso de cadena de texto!" El archivo completo debería tener el siguiente aspecto:



Hola, Android! Soy un recurso de cadena de texto!
Hola, Android


Ahora abre y modifica tu clase HelloAndroid utiliza la distribución XML. Edita el archivo para que se parezca a este:

package com.example.helloandroid;

import android.app.Activity;
import android.os.Bundle;

public class HelloAndroid extends Activity {
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
}
}

Cuando realices una modificación, escribe a mano o intenta usar la característica de "code-completion" (sugerencia de código). A medida que escribes "R.layout.main" el plugin te ofrecerá sugerencias. Te darás cuenta que esta característica ayuda en muchas situaciones.
En lugar de pasar setContentView() a un objeto View, se le puede dar una referencia al recurso para el diseño. El recurso es un identificador como R.layout.main, que es en realidad una representación del objeto actualmente compilado representado en la definición en /res/layout/main.xml. El plugin de Eclipse automáticamente crea esta referencia para dentro de la clase R.java class.

Ahora vuelve a ejecutar la aplicación, ya que se ha creado una configuración para la ejecución, todo lo que debes hacer es pulsar la flecha verde para ejecutar, o seleccionar Ejecutar --> Ejecutar Historial --> Android Activity. Además del cambio en la cadena TextView, la aplicación tiene el mismo aspecto. Después de todo, el punto consistía en mostrar los dos enfoques diferentes de diseño que producen resultados identicos.

Truco: Utiliza las teclas Ctrl-F11 (Cmd-Shift-F11, en Mac) para ejecutar la aplicación actual.

Sigue leyendo para introducirte en la depuración. Cuando estés listo para aprender más, lee los Fundamentos de aplicaciones para una introducción a todos los elementos que se pueden utilizar en las aplicaciones de Android. También puedes consultar la Guía para desarrolladores para una introducción a la documentación de la Guía para desarrolladores.


R class

En Eclipse, abrir el archio R.java (en la carpeta gen/ [Archivo Java Generados]). Debe aparecer algo como esto: package com.example.helloandroid;

public final class R {
public static final class attr {
}
public static final class drawable {
public static final int icon=0x7f020000;
}
public static final class layout {
public static final int main=0x7f030000;
}
public static final class string {
public static final int app_name=0x7f040001;
public static final int hello=0x7f040000;
}
}

El archivo R.java del proyecto es un índice de todos los recursos definidos en el archivo. Se utiliza esta clase en el código fuente como una especie de taquigrafía para hacer referencia a los recursos que se han incluido al proyecto. Esta es una particularidad podersoa con la característica de completado de código que utiliza Eclipse, ya que te permite una forma rápida e interactiva de localizar referencias especificas que puedes estar buscando. Posiblemente te aparezca diferente (por ejemplo, que los valores hexadecimales sean diferentes). Por ahora, fíjate en la clase interna llamada "layout", y su campo miembro "main". El plugin de Eclipse a generado una clase para main.xml. A medida que se agreguen otros recursos al proyecto (como por ejemplo archivos res/values/string.xml o imágenes en res/drawable/ para los componentes visuales) verás como R.java cambia para mantenerse actualizado.


Depura tu proyecto

El plugin de Android para Eclipse también tiene una excelente integración con el depurador de Eclipse. Para demostrarlo, introduciremos un error en el código. Cambia el código fuente de HelloAndroid para que se parezca a este:

package com.android.helloandroid;

import android.app.Activity;
import android.os.Bundle;

public class HelloAndroid extends Activity {
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
Object o = null;
o.toString();
setContentView(R.layout.main);
}
}

Este cambio, simplemente introduce un NullPointerException en el código. Si se ejecuta la aplicación de nuevo, veremos algo como esto:

hello_world_8.png

Pulsa "Forzar cierre" para finalizar la aplicación y cerrar la ventana del emulador.

Para obtener más información sobre el error, debe establecerse un punto de interrupción en el código en la línea Object o = null; (doble click en la barra de marcadores del lateral del código). A continuación, selecciona Ejecutar --> Historial de depuración --> Hola, Android para entrar en el modo de depuración. La aplicación se reiniciará en el emulador, pero esta vez se suspenderá cuando llegue al punto de interrupción que se ha establecido. A continuación se puede recorrer el código en perspectiva, al igual que lo haríamos para cualquier otra aplicación.

hello_world_9.png


Siguientes ejemplo básicos, vistas y otros componentes

A continuación los tutoriales básicos para otros elementos, si quieres puedes ver la [versión original] o seguirlos aquí mismo.

Para poder seguir estos siguientes tutoriales, se da por entendido y sabido lo explicado con anterioridad, así que solo se hará referencia a los novedades que aquí se introduzcan.


Layouts


Linear Layout

hello-linearlayout.png


Puede verse el tutorial completo en inglés aquí.


LinearLayout es un ViewGroup (Visión en grupo) que permite tener elementos View (vista) que sean hijos en una dirección linear, tanto vertical como horizontalmente.

Hay que tener cuidado con no sobre-utilizar el LinearLayout. Si debes empezar a anidar múltiples LinearLayouts, tal vez deberías considerar en utilizar RelativeLayout en su lugar.

Crea un proyecto nuevo llamado HelloLinearLayout.
Abre el archivo res/layout/main.xml e inserta el siguiente código:


android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1">
android:text="rojo"
android:gravity="center_horizontal"
android:background="#aa0000"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="1"/>
android:text="verde"
android:gravity="center_horizontal"
android:background="#00aa00"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="1"/>
android:text="azul"
android:gravity="center_horizontal"
android:background="#0000aa"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="1"/>
android:text="amarillo"
android:gravity="center_horizontal"
android:background="#aaaa00"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="1"/>

android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1">
android:text="fila uno"
android:textSize="15pt"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"/>
android:text="fila dos"
android:textSize="15pt"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"/>
android:text="fila tres"
android:textSize="15pt"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"/>
android:text="fila cuatro"
android:textSize="15pt"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"/>



Revisa con cuidado este código XML. Consiste en tener inicialmente un LinearLayout que define su orientación en vertical que influye a todas las vistas hijas (de las que tiene dos) que serán apiladas verticalmente. La primera vista hija es otro LinearLayout que utiliza la orientación horizontal y la segunda vista hija es una LinearLayout que utiliza la orientación vertical. Cada una de estas LinearLayouts anidadas contienen varios elementos TextView, que estan orientados entre sí en las condiciones definidas por sus LinearLayout padres.


Ahora abre HelloLinearLayout.java y asegúrate que se carga la capa res/layout/main.xml con el método onCreate():

public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
}

El método setContentView(int) carga el archivo de diseño de la Activity (actividad), especificado por el recurso ID. R.layout.main hace referencia a las capas del archivo res/layout/main.xml.

Ejecuta la aplicación. Deberías ver algo similar a esto:

hello-linearlayout.png

Debe observarse como los atributos XML definen el comportamiento de cada View (vista). Prueba con diferentes valores para android:layout_weight para ver como el espacio de la pantalla se distribuye en función del peso de cada elemento. Para ver más información de estos atributos pulsa en el enlace.




Relative Layout

hello-relativelayout.png

Puede verse el tutorial completo en inglés aquí.

RelativeLayout es un ViewGroup que muestra Views de elementos en posiciones relativas. La posición de un View puede ser especificado como relativo a en relación a elementos hermanos (por ejemplo, a la izquierda o debajo de un elemento determinado) o en posiciones relativas al area del RelativeLayout (como alineado a la parte inferior, izquierda o centro).

Un RelativeLayout es una utilidad muy poderosa para diseñar una interfaz de usuario porque puede eliminar la necesidad de ViewGroups. Si te encuentras usando grupos de LinearLayout, podrás reemplazarlos con un único RelativeLayout.

Inicia un nuevo proyecto llamado HelloRelativeLayout.
Abre el archivo res/layout/main.xml e inserta el siguiente código:


android:layout_width="fill_parent"
android:layout_height="fill_parent">
android:id="@+id/label"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Escribe aquí:"/>
android:id="@+id/entry"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="@android:drawable/editbox_background"
android:layout_below="@id/label"/>
android:id="@+id/ok"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/entry"
android:layout_alignParentRight="true"
android:layout_marginLeft="10dip"
android:text="Aceptar" />
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toLeftOf="@id/ok"
android:layout_alignTop="@id/ok"
android:text="Cancelar" />


Debe observarse cada atributo android:layout_*, tales como layout_below, layout_alignParentRight y layout_toLeftOf. Cuando se utiliza un RelativeLayout, se pueden utilizar estos atributos descritos como se quiera en la posición de cada View. Cada uno de estos atributos definen un tipo diferente de posición relativa. Algunos atributos usan el recurso ID de una View hermana para definir su posición relativa propia. Por ejemplo, el último Button se define a la izquierda y alineado en la parte superior de la View identificado por el ID ok (que se ha usado en el anterior Button). Todos estos atributos están disponibles y definidos en RelativeLayout.LayoutParams.

Asegúrate de añadir este método onCreate():

public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
}

El método setContentView(int) carga el diseño de la Activity, especificada por el recurso ID, R.layout.main hace referencia al archivo res/layout/main.xml.

Ejecuta la aplicación.

Debería verse el siguiente esquema:

hello-relativelayout.png
Table Layout

hello-tablelayout.png

Puede verse el tutorial completo en inglés aquí.

TableLayout is a ViewGroup that displays child View elements in rows and columns.

Crea un nuevo proyecto llamado HelloTableLayout.
Abre el archivo res/layout/main.xml e inserta el código siguiente:


android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:stretchColumns="1">

android:layout_column="1"
android:text="Abrir..."
android:padding="3dip" />
android:text="Ctrl-O"
android:gravity="right"
android:padding="3dip" />


android:layout_column="1"
android:text="Guardar..."
android:padding="3dip" />
android:text="Ctrl-S"
android:gravity="right"
android:padding="3dip" />


android:layout_column="1"
android:text="Guardar como..."
android:padding="3dip" />
android:text="Ctrl-Shift-S"
android:gravity="right"
android:padding="3dip" />

android:layout_height="2dip"
android:background="#FF909090" />

android:text="X"
android:padding="3dip" />
android:text="Importar..."
android:padding="3dip" />


android:text="X"
android:padding="3dip" />
android:text="Exportar..."
android:padding="3dip" />
android:text="Ctrl-E"
android:gravity="right"
android:padding="3dip" />

android:layout_height="2dip"
android:background="#FF909090" />

android:layout_column="1"
android:text="Salir"
android:padding="3dip" />



Cabe destacar que la estructura se parece a la de una tabla en HTML. El elemento TableLayout es muy similar al de HTML; TableRow es como a ; pero para las celdas, se puede utilizar cualquier tipo de elemento View. En este ejemplo, un TextView se usa para cada celda. Entre algunas de las filas, hay un View basico, que es usado para dibujar la línea horizontal.

Asegúrate que la Activity HelloTableLayout carga el diseño en el método onCreate():

public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
}


El método setContentView(int) carga el archivo para la Activity, especificada con el recurso ID, R.layout.main hace referencia al archivo res/layout/main.xml.

Ejecuta la aplicación. Deberías ver algo similar a esto:

hello-tablelayout.png


Grid View

http://developer.android.com/intl/es/resources/tutorials/views/hello-gridview.html

hello-gridview.png


Tab Layout

http://developer.android.com/intl/es/resources/tutorials/views/hello-tabwidget.html

hello-tabwidget.png


List View

http://developer.android.com/intl/es/resources/tutorials/views/hello-listview.html

hello-listview.png


Widgets & Other Views


Date Picker

http://developer.android.com/intl/es/resources/tutorials/views/hello-datepicker.html

hello-datepicker.png


Time Picker

http://developer.android.com/intl/es/resources/tutorials/views/hello-timepicker.html

hello-timepicker.png


Form Stuff

http://developer.android.com/intl/es/resources/tutorials/views/hello-formstuff.html

hello-formstuff.png


Spinner

http://developer.android.com/intl/es/resources/tutorials/views/hello-spinner.html

hello-spinner.png


Auto Complete

http://developer.android.com/intl/es/resources/tutorials/views/hello-autocomplete.html

hello-autocomplete.png


Gallery

http://developer.android.com/intl/es/resources/tutorials/views/hello-gallery.html

hello-gallery.png


Google Map View

http://developer.android.com/intl/es/resources/tutorials/views/hello-mapview.html

hello-mapview.png


Web View

http://developer.android.com/intl/es/resources/tutorials/views/hello-webview.html

hello-webview.png


Soporte de localización

http://developer.android.com/intl/es/resources/tutorials/localization/index.html

romanshCH_screenshot.png

german_screenshot.png


Enlaces oficiales

http://developer.android.com/intl/es/sdk/index.html
http://developer.android.com/intl/es/resources/index.html

Alex 19 16v

Admin

Mensajes : 295
Fecha de inscripción : 08/10/2011
Edad : 38
Localización : españa/asturias

Hoja de personaje
Gandroid: 0

Me gustaNo me gusta

 

---

huawei :: Principal :: Tutoriales

Página 1 de 1.

Cambiar a: Seleccionar un foro||--Principal    |--Huawei U8650    |   |--Roms    |   |--Caracteristicas    |   |--Ayuda    |   |--Censo de poseedores del terminal    |   |--Accesorios    |   |--Encuesta: que rom utilizas?    |   |--Temas fondos y demas cosas para personalizar el movil    |       |--Huawei U8110    |--Huawei U8160 (vodafone 858 smart)    |   |--Roms    |   |--Caracteristicas    |   |--Ayuda    |   |--Juegos    |   |--Aplicaciones    |       |--Huawei U8120    |--Huawei U8150 (Ideos)    |--Huawei U8800/U8500    |--Huawei U8180 (Gaga)    |--Huawei U8220    |--Huawei U9120    |--Huawei UM840    |--Juegos    |--Aplicaciones recomendadas    |--Navegadores recomendados    |--Tutoriales    |--General    |--Opiniones y mejoras respecto al foro    |--Off topic 

Permisos de este foro:

No puedes responder a temas en este foro.