RadioButton CheckBox
RadioButton CheckBox
RadioButton CheckBox
PRCTICA # 3
11/12/2016
Ejercicio # 1
En este ejercicio se va a disear la interfaz de la aplicacin.
Android
Pgina 1
Presione el botn Next. En la siguiente ventana seleccione Empty Activity y presione Next para agregar un
nuevo activity.
Android
Pgina 2
2.
CAMPO
VALOR
Activity Name:
MainActivity
Layout Name:
activity_main
3.
Espere unos segundos hasta que el Android Studio cree la estructura del proyecto. Se muestra el IDE
con la actividad creada.
Android
Pgina 3
4.
Si no esta abierta aun abra el archivo activity_main.xml que se encuentra en la carpeta layout.
Android
Pgina 4
CONTROL
TextView
Text
VALOR
Ingrese un nmero:
TextView
Text
TextView
Text
Respuesta:
EditText
id
etIngreseNumero
EditText
id
etIngreseOtroNumero
EditText
Id
etRespuesta
Enabled
false
Android
PROPIEDAD
Pgina 5
Si tiene problemas, por favor revise las prcticas anteriores donde se cre controles
TextView o EditText, fjese en las figuras de cada paso.
8. La actividad (formulario-ventana) debera presentar un aspecto similar (NO IGUAL) a la siguiente figura.
9. Ahora vamos a utilizar controles RadioButton, para esto debemos primero insertar un control de tipo
RadioGroup, este control se encuentra en la paleta de componentes en la pestaa Containers",
arrastre un control de este tipo y ubquelo bajo el TextView Respuesta.
Android
PROPIEDAD
layout_width
VALOR
match_parent
layout_height
match_parent
Pgina 6
Android
Pgina 7
Podemos fcilmente identificar que los controles RadioButton pertenecen (estn dentro) de uno
RadioGroup viendo la ventana "Component Tree" de Android Studio (donde se nos muestra todos los
controles con sus nombres insertados hasta el momento en la actividad):
Android
Pgina 8
12. Para nuestro caso necesitamos 6 RadioButton, por lo tanto arrastre 3 controles ms de tipo
RadioButton de la paleta de componentes de la categora Widgets y ubquelos CON CUIDADO dentro
del control RadioGrup anterior.
Android
Pgina 9
Utilice la ventana Component Tree para comprobar que los controles creados estn
dentro del RadioGrup. Tambin puede usar esta ventana para arrastrar y poner los
RadioButton (si estn fuera del RadioGroup) dentro del RadioGroup.
Android
Pgina 10
13. Cambie las propiedades Text de cada RadioButton (de la misma forma que se lo hace para los
TextView) y el Id segn se indica a continuacin.
CONTROL
RadioButton
RadioButton
RadioButton
RadioButton
RadioButton
RadioButton
PROPIEDAD
VALOR
Text
Sumar
id
rbSumar
Text
Restar
id
rbRestar
Text
Multplicar
id
rbMultiplicar
Text
Dividir
id
rbDividir
Text
Potencia
id
rbPotencia
Text
Factorial
id
rbFactorial
14. Use la propiedad height del RadioGroup y establzcalo en el valor wrap_content para que el tamao se
adapte al contenido tal y como se muestra en la figura anterior.
Android
Pgina 11
Si tiene problemas para configurar la propiedad Text del RadioButton, por favor revise
las prcticas anteriores realizadas en clase donde se cre controles TextView y se
configur esta propiedad ya que el procedimiento es el mismo.
15. Agregue un control Button desde la pestaa Widgets y ubquelo luego del RadioGrup (fuera de este),
cambie la propiedad Text del control segn se indica a continuacin.
CONTROL
Button
PROPIEDAD
VALOR
Text
Aceptar
layout_width
match_parent
16. La actividad debera presentar una apariencia similar (NO IGUAL) al mostrado en el siguiente grfico.
Android
Pgina 12
Android
Pgina 13
11/12/2016
Ejercicio # 2
PROGRAMACIN DE LA APLICACIN.
Los mtodos que permitan sumar, restar, multiplicar, dividir, obtener la potencia y el
factorial se ubicarn en una clase, de esta forma separamos la lgica de la aplicacin
de la interfaz, lo que facilita el diseo y mantenimiento de la misma.
1. Cree una clase para el proyecto, para el proyecto App_003, para esto marque el paquete fisei.app_003
(para este ejemplo) si creo el paquete con otro nombre igual seleccinelo. Esto se muestra a continuacin.
2. Presione clic derecho sobre el paquete fisei.app_003 (o el que corresponda a su proyecto), como
muestra la siguiente ventana.
Presione
en la
opcin
Java
3. En la ventana emergente seleccione New y luego en el men en cascada la opcin Java Class como
se muestra en la figura anterior.
Android
Pgina 14
En la pantalla que aparece digite Matematicas dentro del campo Name, esto crea la clase Matematicas.
Android
Pgina 15
{
return x - y;
}
//Permite multiplicar 2 numeros.
public static int multiplicar(int x, int y)
{
return x * y;
}
//Permite dividir 2 numeros.
public static int dividir (int x, int y)
{
return x / y;
}
//Permite obtener la potencia.
public static long potencia (int base, int exponente)
{
long resultado = 1;
for (int i=1; i <= exponente; i++)
{
resultado *= base;
}
return resultado;
}
//Permite obtener el factorial de un numero.
public static long factorial (int numero)
{
long resultado = 1;
for (int i=1; i <= numero; i++)
{
resultado *= i;
}
return resultado;
}
}
Note que el cdigo es casi idntico al creado en la prctica anterior (en clases), con la
excepcin que todos los mtodos son ahora estticos (static)
6. Use la ventana Android para abrir (si an no la tiene abierta) la clase MainActivity.java (o la que usted
haya creado) que representa la clase asociada a la actividad (ventana-formulario).
Android
Pgina 16
Captura de eventos.
Ahora es necesario definir variables en java para almacenar las referencias a los objetos definidos en el
archivo XML que representa la ventana (actividad).
7. En el archivo MainActivity.java defina tres variables tipo EditText y 6 de tipo RadioButton (estas clases
se encuentran en el paquete android.widget). Para que java reconozca estas clases es necesario
importarlas, eso se lo hace en la seccin de clusulas import como se indica en el siguiente cdigo. En
este caso Android Studio agrega los import automticamente, si no lo hace presione Alt + Enter.
Android
Pgina 17
8. En el mtodo onCreate se debe enlazar estas variables con los objetos definidos en el archivo XML, esto
se hace llamando al mtodo findViewById. Por lo tanto, digite el cdigo siguiente para lograr este
objetivo, hasta ahora su archivo java debera presentar el siguiente aspecto.
Android
Pgina 18
Al mtodo findViewById le debemos pasar la constante creada en la clase R (recordemos que esta clase se
crea automticamente y es administrada por Android) el nombre de la constante no debe ser igual
necesariamente con el nombre de la propiedad del objeto creado en el archivo XML. Como el mtodo
findViewById retorna un objeto de la clase de tipo View entonces es necesario utilizar el operador cast (es
decir le antecedemos entre parntesis el nombre de la clase)
Ya tenemos almacenados en las variables (objetos) las referencias a los objetos necesarios de la actividad
(formulario-ventana) que se crean al llamar al mtodo:
setContentView(R.layout.activity_main).
9. Ahora es necesario crear un mtodo que se ejecutar cuando se presione el botn Aceptar (el mtodo
obligatoriamente debe recibir como parmetro un objeto de la clase View).
Por lo tanto, cree el cdigo para el mtodo y agregue en la clusula import la referencia al paquete donde
se encuentra la clase View, esto se muestra a continuacin
Android
Pgina 19
10. Ahora cree la lgica dentro del mtodo para que segn el RadioButton seleccionado se realice la suma,
resta, multiplicacin, divisin, potencia o el factorial de los dos valores ingresados en los controles
EditText y mostrar el resultado en el tercer EditText. Para lograr esto digite el siguiente cdigo para el
mtodo aceptar creado anteriormente.
Android
Pgina 20
11. A continuacin, es necesario asociar el mtodo creado Aceptar con la propiedad OnClick del botn para
que al presionar un botn se dispare el evento Click y se llame al mtodo aceptar.
Para esto abra el archivo activity_main.xml que est dentro de la carpeta layout (su archivo puede tener
un nombre diferente), este archivo representa la actividad (formulario-ventana), utilice la ventana
Android para esto.
Android
Pgina 21
Android
Pgina 22
13. Para probar la aplicacin primero ejecute el emulador, para esto ejecute el Android Virtual Device
Manager desde la barra de herramientas o desde el men Tools- Android-Virtual Device Manager.
Android
Pgina 23
14. En la ventana que se muestra seleccione el emulador a ejecutar (en nuestro caso el creado en las
prcticas anteriores) y luego pulse sobre el botn de Play en la seccin Actions.
Android
Pgina 24
16. Si el emulador est bloqueado, proceda a desbloquearlo deslizando el icono del candado hacia la
izquierda.
Android
Pgina 25
Android
Pgina 26
Android
Pgina 27
Android
Pgina 28
Ejercicios propuestos
Android
El uso de los controles CheckBox que estn en la pestaa Widgets es idntico a los
RadioButtons. Experimente con este control, cree la misma aplicacin con dos de las opciones
(factorial y potencia) usando CheckBox.
Pgina 29