SESION 2 CAPTURA DE CLIC CON BOTON

PROGRAMACIÓN DE DISPOSITIVOS MOVILES
Lic. Luis Carlos Galarcio Muñoz
Guía 2: Captura de un evento con un Boton

1

________________________________________________________________________________
Captura del clic de un botón
Para la realización de esta guía resolveremos un problema el cual consiste en la carga de dos
números en controles de tipo EditText. Mostrar un mensaje que solicite la cargade los valores.
Disponer un Button para sumar los dos valores ingresados. Mostrar el resultado en un tercer
TextView.
La interfaz visual debe quedar algo semejante a esto:

Veamos paso a paso como creamos la interfaz visual de nuestro programa. Primero borramos el
TextView que aparece por defecto cuando se crea un proyecto con el ADT. Ahora desde la ventana
"Palette" seleccionamos de la pestaña"Form Widgets" el control "TextView" y lo arrastramos a la
ventana de diseño de nuestra interfaz:

PROGRAMACIÓN DE DISPOSITIVOS MOVILES
Lic. Luis Carlos Galarcio Muñoz
Guía 2: Captura de un evento con un Boton

2

________________________________________________________________________________
Ahora lo seleccionamos y en la ventana de propiedades especificamos la propiedad text (como
habíamos vistoanteriormente) disponemos el texto "Ingrese el primer valor:":

También vamos a especificar la propiedad "Id", la misma aparece primera en la paleta de
propiedades y le asignaremos el valor @+id/tv1 (el nombre es el que se indica luego de la barra es
decir cambiamos textView1 por tv1) Cuidado de no borrar @+id/. Esto también es posible hacerlo
con “clic derecho / Edit ID”

PROGRAMACIÓN DEDISPOSITIVOS MOVILES
Lic. Luis Carlos Galarcio Muñoz
Guía 2: Captura de un evento con un Boton

3

________________________________________________________________________________
Hemos entonces asignado como nombre a este objeto: tv1 (recordemos que se trata de un objeto
de la clase TextView).
Ahora de la paleta de componentes seleccionamos la pestaña "Text Fields" y arrastramos el
primero (el quetiene la etiqueta abc)

En la ventana de properties estando seleccionado el EditText configuramos la propiedad Id... con
el nombre et1 (este nombre haremos referencia posteriormente desde Java)
Efectuamos los mismos pasos para crear el segundo TextView y EditText (inicializamos las
propiedades respectivas) Definimos los id con los nombres tv2 y et2, el resultado visual debe ser
algo semejante a esto:PROGRAMACIÓN DE DISPOSITIVOS MOVILES
Lic. Luis Carlos Galarcio Muñoz
Guía 2: Captura de un evento con un Boton

4

________________________________________________________________________________

De la pestaña "Form Widgets" arrastramos un control de tipo "Button":

PROGRAMACIÓN DE DISPOSITIVOS MOVILES
Lic. Luis Carlos Galarcio Muñoz
Guía 2: Captura de un evento con un Boton

5________________________________________________________________________________
Inicializamos la propiedad text con el texto "Sumar" y la propiedad id la dejamos con el valor ya
creado llamado "button1".
Para terminar con nuestra interfaz visual arrastramos un tercer objeto de tipo TextView y
definimos la propiedad id con el valor "tv3" y la propiedad text con el texto "resultado",
recordemos que la interfazfinal debe ser semejante a esta:

Si en este momento ejecutamos la aplicación aparece la interfaz visual correctamente pero
cuando presionemos el botón no mostrará la suma.
Es fundamental una vez finalizada la interfaz visual proceder a grabarla (icono de los diskettes) o
la opción File->Save para que se actualicen los archivos que se generan automáticamente.
Hasta ahora hemos trabajado solo con elarchivo xml (activity_main.xml) donde se definen los
controles visuales de la ventana que estamos creando.
Abrimos seguidamente el archivo MainActivity.java que lo podemos ubicar en la carpeta src:

PROGRAMACIÓN DE DISPOSITIVOS MOVILES
Lic. Luis Carlos Galarcio Muñoz
Guía 2: Captura de un evento con un Boton

6

________________________________________________________________________________...