Interfaz Grafica: El Layout II

En este tutorial, introduciremos el TableLayout y el TableRow para concluir el ejemplo pasado y explicar un poco sobre los recursos alternativos ademas de crear un nuevo proyecto donde revisaremos los atributos strectchColums, layout_column, padding y algunos otros que ya conocemos.

En el proyecto anterior, una vez que poníamos el emulador en modo paisaje, el layout que teníamos se veía afectado y perdía la buena apariencia. Para evitar esto, podemos hacer 2 cosas, declarar en AndroidManifest una sola orientación para la aplicación o creamos un layout alternativo para el modo paisaje. Esta vez lo haremos de la segunda manera para así introducir el TableLayout.

Interfaz Gráfica: El Layout I

LinearLayout con orientación vertical

En este tutorial nos adentraremos en los conceptos básicos a tener en cuenta al momento de crear una interfaz grafica en android, introduciendo el View, ViewGroup, LinearLayout, TextView, Button ademas de algunos de sus parámetros como id, text, textSize, color, paddingBottom, gravity entre otros.

LinearLayout con orientación horizontal

Lo primero que debemos saber es que en Android podemos crear una interfaz gráfica tanto de manera procedural (manipulando código de java) como de manera declarativa (usando xml). La documentación oficial recomienda el segundo método así que es el que usaremos. Ahora bien, tenemos 2 bloques básicos para construir interfaces gráficas, el View que es el que ocupa un área rectangular en la pantalla y se encarga del dibujado y manejo de eventos (como ejemplos tenemos el ImageView, TextView y Button) y el ViewGroup que es la clase base que se encarga del diseño (al cual usualmente llamamos layout) ademas de contener otros Views o ViewGroups mismos (ejemplos de estos son el LinearLayout o el TableLayout).

Hola Mundo Android II (El codigo y la AVD)

En el tutorial anterior explicamos el árbol de archivos del proyecto y la función de cada uno de estos, lo que haremos ahora sera explicar el funcionamiento del codigo.

Comenzaremos con el archivo main.xml ( res/values/main.xml y seleccionamos la pestaña main.xml que se encuentra a la derecha de graphical layout) que se puede observar a continuación:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    >
<TextView 
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:text="@string/hello"
    />
</LinearLayout>

El LinearLayout es una etiqueta que pone a sus hijos(o etiquetas contenidas dentro de la misma) uno detrás de otro, ya sea de manera vertical u horizontal, dependiendo del valor del atributo. El xmlns (xml namespace) se refiere al contexto en el que trabajaremos, por eso los atributos que usamos posteriormente en el código van precedidos por la palabra android.

Hola Mundo Android! I (las carpetas)

En este tutorial crearemos nuestro primer proyecto, un clásico hola mundo que nos servirá para analizar las carpetas y el código que se genera automáticamente.

Árbol de archivos creado
automáticamente al crear
un nuevo proyecto.

Detalles del proyecto:

Nombre del proyecto: HolaMundoAndroid

Target: Android 2.2

Nombre de la Aplicación: Hola Mundo

Nombre del paquete:        com.blogspot.cdgandroid.holamundoandroid

Nombre de la actividad: MainActivity

Version minima SDK: 3

Una vez creado el proyecto nos aparecerá una carpeta llamada HolaMundoAndroid la cual al expandirla se verá como la imagen de la izquierda.

Cómo crear un nuevo proyecto

Para crear un nuevo proyecto ( me basaré en el Android Motodev Studio 3.0 que también usa el entorno eclipse)  lo primero que debemos hacer es ir a File -> New -> Android Project... . Una vez hecho esto, nos saldrá una ventana como la siguiente:

Creando un nuevo proyecto.

Project name es el nombre con el que queremos guardar nuestro proyecto.

Dentro de la parte Contents especificamos la manera en la que queremos crear nuestro proyecto: desde cero, usando un ejemplo de los que vienen con el SDK de Android o usando un código existente. Para este caso seleccionaríamos la primer opción.