martes, 13 de diciembre de 2011

Mis primeros pasos en Programación Android (Hello World y algo más)


Ahora si amigos nos llego la hora de agregar algo de sabor a estos tutoriales de desarrollo.  Para poder completar este tutorial es necesario haber leído e implementado los dos anteriores.  Les dejo los enlaces para que hagan referencia a ellos .

  1. Mis primeros pasos en Programación Android
  2. Mis primeros pasos en Programación Android (Mi Primer Hello World!)

Para comenzar con este tutorial debemos abrir eclipse y localizar la app que creamos en Mis primeros pasos en Programación Android (Mi Primer Hello World!).  Lo que vamos hacer con la app es agregar varios controles y le vamos a asociar algunos eventos en código java.  
Cuando tengamos eclipse abierto vamos a buscar el “main.xml” que está dentro de  la carpeta “Lauout” de nuestro proyecto “HelloWorld” y le damos doble clic para modificar la misma .  Para referencia vea la imagen (1.1).

Imagen (1.1)

Una vez abierta la pantalla vamos a fijarnos en la parte derecha en donde están los controles que podemos agregar a nuestra pantalla.  Estando ahí buscamos un control que dice “Button” le damos un click y hacemos “drag and drop” a la pantalla.  Buscamos la propiedad de “Text”  y le ponemos “Click Me”.  En el LinearLayout buscamos la propiedad “Layout Width” y le ponemos  “fill_parent”. Luego seleccionamos el “TextView” buscamos la propiedad “ID” y le ponemos “@+id/txtHello”.  La pantalla debe quedar como en la imagen(1.2)


Imagen(1.2)



Luego de hacer lo anterior nuestro próximo paso es agregar el código java para que el botón haga lo necesario.  Lo que buscamos que el botón haga es que cuando lo presionen cambie el texto de “TextView” por el que queramos poner.  
Ahora vamos a buscar el la clase de java “helloworld.java” el cual está localizada el directorio “src” del proyecto. Ver la imagen (1.3) para referencia. 

Imagen (1.3)

Luego de haberlo localizado la clase le damos doble click y la pantalla se debe ver como la imagen(1.4)

Imagen(1.4)

Como vemos en la imagen(1.4) , la pantalla muestra el código java que se va a ejecutar cuando la aplicación se activa.  Ahora llego el momento de la acción en android.  Vamos a agregar unas series de líneas de código.  Si vemos la imagen(1.5) vemos las líneas que vamos a agregar.   Si vemos la imagen(1.5) vemos que le agregamos unas librerías que necesitamos importar :
import android.app.Activity;
import android.os.Bundle; -
import android.view.View;
import android.widget.Button; - Manipular el element boton.
import android.widget.TextView; - Manipular el element textview.

También  se le agregaron las variables de los controles que agregamos:
Button btnClickme;
TextView txthello;


Y por último en el evento onCreate le agregamos el código para capturar el evento click del botón y cambiar el texto del “textview”:
 btnClickme =   (Button) this
.findViewById(R.id.button1);
       
       txthello = (TextView) this.findViewById(R.id.txtHello);
       
       btnClickme.setOnClickListener(new View.OnClickListener() {
public void onClick(View arg0) {

txthello.setText("El Texto Que Quieras en TextView");
}
});

El código al final debe verse como en la imagen(1.5).  Una vez completado los cambios lo que nos resta es darle debug para ver si funciona.  En la imagen(1.6) muestra la aplicación ejecutada y luego del click el text cambiado.  Después de esto amigos lo que nos resta es por nosotros mismos ir agregando más controles y alternativas a la app.  Pueden publicar en el post como les va.  Cualquier duda o pregunta se pueden comunicar conmigo a wascar@yosoyandroid.com o pueden escribir en los comentarios.


Imagen(1.5)




Imagen(1.6)

No hay comentarios:

Publicar un comentario

Se ha producido un error en este gadget.