Menu

Desarrollar aplicaciones para dispositivos móviles con sistema operativo android. Capítulo 2: Tu primera aplicación en Java para Android

 

Después de finalizar todos los pasos de la primera parte de este tutorial, referentes a la instalación de todos los elementos necesarios para el desarrollo de aplicaciones para nuestro dispositivo Android, vamos a pasar a hacer la primera.
Va a ser un ejemplo muy sencillo.
Los programadores tienen la manía, desde tiempos inmemoriales, de que la primera aplicación que hacen para un nuevo lenguaje de programación que están aprendiendo, sea un “Hola mundo”.


¿Y qué es eso de un “hola mundo”? Pues lo más sencillo que puedes hacer con cualquier tipo de aplicación, que es mostrar una cadena de caracteres por pantalla. En este caso en concreto, la gente suele mostrar “Hola mundo” o “Hello world” (de ahí su nombre).


Antes de entrar en faena, habría que dejar claro que es la programación orientada a objetos.
No hay manual en el mundo capaz de explicar en menos de 300 páginas bien el concepto de programación orientada a objetos, y personalmente conozco mucha gente, que después de 5 años de Ingeniería informática, sigue sin comprenderlo. Pero al menos, vamos a intentarlo, desde un punto de vista muy sencillito y básico.


Vamos a imaginar un microondas. Tú tienes tu microondas en la cocina, y dices: voy a describirlo.
Tu microondas tiene propiedades, como por ejemplo: potencia, color, tamaño...
Y tu microondas tiene funcionalidades, como por ejemplo: poner en marcha, parar, abrir la puerta...
Esto podría a ayudarnos a dar una definición de tu microondas. Un “objeto” que tiene una serie de atributos (potencia, color, tamaño...) y una serie de funciones o métodos (encender, apagar, abrir...).


Pues esto es lo que vamos a hacer en nuestros programas para Android. Vamos a tener unos objetos, como por ejemplo una caja de texto donde vamos a escribir, y vamos a interactuar con ellos. Si nuestro microondas tiene atributos y métodos, nuestra caja de texto también los va a tener. Va a tener un texto, un color para el texto, un tipo de letra para el texto, y va a tener unos métodos que nos van a permitir interactuar con ella, como fijar un texto, hacerlo visible o invisible... etc etc.


Después de esta breve y muy básica explicación, vamos a empezar con nuestro hola mundo para android.
En primer lugar tendremos que abrir nuestro Eclipse, que como ya habíamos dicho va a ser el entorno de desarrollo que vamos a utilizar para nuestras aplicaciones Android. Una vez aquí, creamos un proyecto nuevo de la siguiente manera:

capdesarrollo1

 

Nosotros queremos crear un nuevo proyecto Android, así que vamos a “otros”. Nos aparecerá el siguiente diálogo, donde veremos una carpeta llamada “Android”, y seleccionaremos nuevo proyecto android.

capdesarrollo2

 

Cuando le damos a siguiente, nos aparecerá un nuevo diálogo donde tendremos que fijar algunas de las propiedades de nuestro proyecto. Vamos a verlo:

 

capdesarrollo3

 

  •     Project Name: El nombre que le vamos a dar a nuestro proyecto, y por el que podremos reconocerlo dentro de Eclipse. En este caso lo llamaremos HolaMundo.
  •     Contents: Aquí querrá que le digamos si vamos a crear un proyecto desde cero, o queremos usar algún tipo de código que ya tengamos escrito de antemano, y donde almacenarlo. En default location os pondrá la ruta de vuestro workspace indicado durante el primer inicio de Eclipse, y no es más que la ruta en vuestro disco duro donde se va a almacenar el proyecto.
  •     Build Target: Aquí seleccionaremos la versión de sistema operativo que vamos a utilizar. Hay cosas, como por ejemplo Text-To-Speech, que solo están disponibles a partir de la 1.6, cosa a tener en cuenta en el futuro. Tampoco es “paseis” por arriba, ya que entonces no funcionará en dispositivos con versión menor.
Sigamos viendo más hacia abajo

 

capdesarrollo4

 

  •     Application name: El nombre que va a tener nuestra aplicación, que será visible, por ejemplo, en el menú de aplicaciones de Android entre otros sitios.
  •     Package name: El código va a estar ordenado en paquetes, cosa que de momento nos va a dar bastante igual, y os basta con saber que por convenio, suelen empezar por letra minúscula.
  •     Create Activity: Vamos a marcar esta opción para que nos cree la primera clase, donde nosotros vamos a escribir nuestro código.
Ya estamos listos para finalizar con este asistente y darle a finish. En este momento, eclipse nos crea toda la estructura necesaria de ficheros y directorios para nuestra aplicación, y vemos lo siguiente:

 

capdesarrollo5
A la izquierda, en “Package explorer”, podemos ver la estructura de nuestro proyecto Android. Nos basta con saber dos de las carpetas:

  •     src: Aquí es donde van a ir las SouRCes o fuentes de nuestros programas, es decir, el código que nosotros vamos a escribir.
  •     res: Aquí es donde van los RESources o recursos de nuestros programas, tales como imágenes, sonidos, y las pantallas.


A la derecha podemos ver que he abierto la clase HolaMundo.java, que es la activity que le dijimos que crease cuando creamos nuestro proyecto.
Esta es la actividad que va a ser llamada cuando arranque nuestro programa, es decir, este es el trozo de código que se va a ejecutar primero en nuestra aplicación. Se va a crear un objeto, en este caso no es un microondas, si no un “HolaMundo” que de momento, va a tener definida una única funcionalidad, onCreate, que lo que va a hacer es definir lo que tiene que hacer cuando se crea, es decir, cuando lo arrancamos.
Aquí es cuando vamos a introducir un concepto nuevo, la clase.

Siguiendo con la metáfora que pusimos al principio, vamos a definir, como si fuéramos un diccionario, que es un microondas. Podríamos decir algo como:


"Un microondas es un aparato con una determinada potencia, color, dimensiones, el cual podemos abrir, poner en marcha, y cuando queramos, pararlo."


Muy bien, pues podemos decir que esto va a ser nuestra clase, la definición, de los atributos y funcionalidades de nuestro objeto microondas. Algo, que nosotros le mandamos a un fabricante de electrodomésticos, y el nos envíe por correo un nuevo microondas que sea del color que nosotros queremos, con la potencia que nosotros queremos, y que funcione como nosotros queremos.
Pues eso van a ser nuestras clases, la definición para crear objetos con los atributos y métodos que nosotros definamos, pudiendo crear o Instanciar tantos objetos a partir de una clase como queramos.
Vamos a añadirle un par de propiedades a nuestra clase, unos atributos, que en este caso van a ser el texto que va a mostrar, y el color, por ejemplo.

 

capdesarrollo6

 

Vamos a explicar estas dos líneas que hemos añadido. Empezamos por la primera:
private String textoMostrar = “HolaMundo!”;
  •     private: Sirve para determinar si los demás objetos del mundo, pueden o no acceder a la información que hay en esta variable. ¿Puede, por ejemplo, la batidora de nuestra cocina, acceder a la potencia que tiene nuestro microondas? La respuesta es no, así que es un atributo privado.
  •     String: Aquí le estamos indicando de qué tipo de dato se trata nuestro atributo, en este caso, una cadena de texto. Si os fijáis, “String” comienza por letra mayúscula. Esto significa que es una clase, es decir, nosotros estamos instanciando un objeto de la clase String, el cual va a tener a su vez, sus métodos y atributos, aunque de momento no vamos a utilizar ninguno de ellos.
  •     textoMostrar: Este va a ser el nombre de nuestro objeto cadena, que va a contener el texto que vamos a querer mostrar, y que, cuando queramos referirnos a el durante el resto del programa, lo deberemos hacer por este nombre que le estamos dando. Fijaros que aquí, se trata de un objeto, instancia de una clase, y comienza por minúscula.
  •     “Hola Mundo!”: Este es el literal (el programa lo cogerá de manera literal, tal como lo pongáis), por ir entre comillas, y es el texto que vamos a mostrar, que va a quedar almacenado dentro del objeto textoMostrar.
  •     “;”: El final de cada instrucción en java se indica poniendo un “;” al final de la misma.
Vamos con la segunda línea:

private int colorTexto = Color.GREEN;
  •     private : Lo mismo que en la sentencia anterior.
  •     int: En este caso se trata de un número entero (integer en inglés), y os podéis fijar que va en minúscula, ya que es un tipo de dato básico, es decir, no es una clase, es simplemente un numero que queda almacenado ahí dentro, y no tiene ningún atributo ni funcionalidad extra.
  •     colortexto: Igual que antes, el nombre que durante el resto de nuestro programa usaremos para referirnos a este numerito en cuestión, que en este caso, va a almacenar el código de un color.
  •     Color.GREEN: Aquí podemos ver que estamos haciendo referencia a una clase, Color (clase porque empieza por mayúscula), y con el punto, estamos accediendo a uno de sus atributos, en este caso GREEN. Estamos accediendo a un atributo de esa clase, Color, desde otra clase distinta, HolaMundo, así que podemos saber que se trata de un atributo público, en contraposición a los privados, que estamos usando nosotros. Ese atributo, GREEN contiene un entero (int) con el código, en este caso, del color verde, que es lo que a nosotros nos interesa.
Muy bien, ya hemos definido dos atributos en nuestra clase, vamos ahora a ver cómo hacemos, para que muestre nuestro texto de nuestro color.
Vámonos al trozo de código que dice onCreate, que como dijimos antes, es la explicación de lo que tiene que hacer cuando se crea nuestra aplicación.
Vamos a fijarnos en esta línea:

 

capdesarrollo7


Como explicación rápida y sin entrar en detalles, podríamos decir que, si os fijáis, cuando declaramos la clase, estamos diciendo:

capdesarrollo8

 

Le estamos diciendo que nuestra clase HolaMundo, extiende, a la clase Activity, que es una clase de Android para las aplicaciones que interaccionan con el usuario.
¿Y que quiere decir eso? Pues siguiendo con nuestra metáfora, le estamos diciendo que nuestro microondas, extiende a Electrodoméstico, por ejemplo. Es decir, nuestro microondas va a hacer todo lo que haga un electrodoméstico general, como es por ejemplo, tener un enchufe, y necesitar electricidad, y además de todo eso, nosotros le vamos a añadir funcionalidades y atributos, como los que ya enumeramos antes.
Bien, pues nuestra clase HolaMundo, ha heredado, de la clase Activity un método llamado setContentView, que lo que hace, es decirle a nuestro programa, que interfaz gráfica tiene que utilizar.
Así pues, de esta manera es como le diremos a nuestro programa, que interfaz, que vamos a crear ahora, tiene que utilizar para, en nuestro caso, mostrar nuestro hola mundo.
Y a ese método le estamos pasando R.layout.main refiriéndonos a:

  •     R: La forma de referirnos a los recursos (res) que tiene nuestro programa.
  •     layout: Se trata de una interfaz de usuario, que como veremos ahora, están dentro de /res/layout
  •     main: Este va a ser el nombre del fichero que vamos a crear para nuestra interfaz.

Vamos entonces con el, que como veréis, Eclipse ya nos lo crea inicialmente.

 

capdesarrollo9

 

Abrimos nuestro main.xml que como dijimos está en /res/layout (donde, recordemos, vamos a guardar las interfaces gráficas) y nos sale esto en la pantalla.
Aquí hay dos posibilidades, utilizar este editor que podéis ver ahí, o cambiar el código XML a mano. A mí personalmente el editor visual que trae me parece que falla más que una escopeta de feria y lo hago a mano, y así lo voy a explicar, pudiendo vosotros probarlo y ver si se adapta a vuestras necesidades. Para lo poquito que vamos a hacer ahora, a mano es más que suficiente. Para ello, fijaros que en la parte inferior de la pantalla, hay una pestañita llamada main.xml, al lado de Graphical Layout. Le damos ahí, y vemos lo siguiente:

 

capdesarrollo10

 

De momento y hasta otros capítulos, nos olvidamos completamente de los LinearLayout, y nos quedamos simplemente con lo que pone TextView.
Este textview va a ser un objeto, con sus atributos y métodos que nosotros vamos a utilizar para mostrar un texto.
Vamos a darle un identificador, para poder referirnos a el desde nuestro programa.

 

capdesarrollo11

 

Lo haremos simplemente añadiendo esa línea, de la cual ya explicaremos la sintaxis en capítulos posteriores.
Vámonos ahora de nuevo a nuestro programa principal, y vamos a realizar lo siguiente: Pedir la caja de texto, fijarle el texto, y fijarle el color.
Para ello lo haremos así:

 

capdesarrollo12

 

Vamos a ver que son estas dos líneas que he añadido:

  •     // Pedimos la.... :  Las líneas que comienzan por “//” son comentarios, texto que podemos escribir para clarificar nuestro código que no van a afectar a la ejecución.
  •     TextView tv : Creamos la referencia a un objeto de la clase TextView, que es el elemento que tenemos en nuestra interfaz para mostrar nuestro texto.
  •     (TextView) findViewById(): findViewById es, de nuevo, un método que heredamos de activity, y que lo que hace es encontrar una “view” dándole nosotros su identificador (el que acabamos de fijar en el XML).
  •     R.id.cajatexto: Como ya dijimos antes, R (res), id (buscamos un identificador), cajatexto (el nombre que le hemos dado al identificador de nuestro TextView en el XML).

 

Podemos ver que nos da un error en el margen de la izquierda, y esto es debido a que en nuestra clase, de alguna manera debemos decirle que debe de importar código de otra parte, en este caso de la clase TextView. Para solucionarlo, vamos a clickear en el margen, encima del error, y nos saldrá este menú:

 

capdesarrollo13

 

Vamos a seleccionar la opción de “Import TextView”, lo cual añade una línea de código en la parte superior de nuestro fichero.
De momento el resto de errores (respectivos a “R”, los vamos a ignorar, ya que en cuanto ejecutemos nuestra aplicación se va a olvidar de ellos).
Muy bien, ya tenemos un objeto TextView, llamado tv, que se refiere al TextView de nuestra interfaz. Vamos a decirle que y como queremos mostrar.

 

capdesarrollo14

 

Como explicamos anteriormente nuestro TextView iba a tener unas funcionalidades para fijarle el texto que queremos mostrar, así como el color del mismo (entre otros muchos, por si queréis investigar).
Pues así lo hacemos, pasándole nuestras variables definidas anteriormente, llamadas textoMostrar y colorTexto.
Ya estamos listos para ejecutar nuestra aplicación. Vamos a ello:

 

capdesarrollo15


Le damos ahí, en la barra superior a ese “Play” verde.
La primera vez que ejecutemos nuestra aplicación, nos preguntará como queremos ejecutarla.

capdesarrollo16

 

Le decimos que se trata de una aplicación Android, y le damos a OK.
Si no habíais guardado los ficheros que habíamos modificado, os preguntará si guardarlos, le decís que si, y os va a arrancar el emulador del teléfono móvil android. Como dijimos en el primer capítulo, tardará un poco más o menos, en función del ordenador que estéis utilizando. Tened paciencia.
Esperamos unos segundos y...

 

capdesarrollo17

 

Ahí está. Vuestra primera aplicación Android funcionando!
No es que sea precisamente útil, pero... a que os sentís bien? :P
Esto no es un proceso fácil, sobre todo si nunca antes en la vida habéis programado nada de nada. Si es así, no desesperéis si tenéis ganas de llegar a haceros una aplicación más útil, ya que el que la sigue, la consigue.
En próximos capítulos veremos cómo podemos añadirle más opciones y funcionalidades a nuestra aplicación, y mientras, si os veis fuertes y con ganas, podéis ir mirando páginas sobre programación orientada a objetos, y sobre java más concretamente, para ir haciéndolo con mayor fluidez.
Un saludo.
 
Descarga en PDF

 

DendelX

Las nuevas tecnologías me han apasionado desde que puedo recordar. Desde que en 1996 conseguí mi primer ordenador, hasta hoy, me he dedicado a romper y arreglar cualquier cosa que ha caido en mis manos.

A finales de 2010 conozco el mundo android, de la mano de Soldieer con su flamante Galaxy 3... XD, y tan solo dos meses despues nos decicimos a iniciar Paratuandroid.com, que es mi primera aventura seria en el mundo web.

volver arriba
United Kingdom Bookmaker CBETTING claim Coral Bonus from link.