Universidad Alas Peruanas

Escuela Profesional de Ingeniera de Sistemas

Taller de Diseo de Aplicaciones Mviles

Mg. Ricci Ramrez Rivera Pgina 1

APLICACIONES ANDROID:
ELEMENTOS DE VISTA IU:
BUTTON, RADIOBUTTON, EDITTEXT, TEXTVIEW

I

OBJETIVOS

Construir aplicaciones Android utiliando !erramientas de Interfa "r#fica$
Mane%ar el funcionamiento & propiedades de los elementos de vista IU$
II
ACTIVIDADES DE LA PRCTICA

En el siguiente e%emplo vamos a realiar la carga de dos n'meros en controles de tipo EditTe(t)
Disponiendo de dos controles de tipo *adio+utton para seleccionar si ,ueremos sumar o restar
dic!os valores$ -inalmente mediante un control de tipo +utton efectuamos la operacin
respectiva$ Mostramos el resultado en un Te(t.ie/$ El pro0lema es similar al anterior$ Para
disponer los controles de tipo *adio+utton de0emos en realidad primero insertar un control de
tipo *adio"roup 1este control se encuentra en la paleta de componentes en la pestaa -orm
2idgets3$

4$ Crear un nuevo Pro&ecto Android llamado5 *adio+otones$
6$ Utiliando la !erramienta para crear la interfa gr#fica del activit&7main$(ml) crear la
siguiente interfa5

SESIN
12
Universidad Alas Peruanas
Escuela Profesional de Ingeniera de Sistemas
Taller de Diseo de Aplicaciones Mviles

Mg. Ricci Ramrez Rivera Pgina 2



8$ De0emos insertar dos te(t.ie/5


9$ As mismo de0emos insertar dos EditTe(t5
TextView
TextView
Universidad Alas Peruanas
Escuela Profesional de Ingeniera de Sistemas
Taller de Diseo de Aplicaciones Mviles

Mg. Ricci Ramrez Rivera Pgina 3





:$ Cuando arrastramos el control *adio"roup al formulario se generan
autom#ticamente 8 o0%etos de la clase *adio+utton contenidos dentro del
*adio"roup) podemos f#cilmente identificar ,ue los controles *adio+utton
pertenecen a dic!o *adio"roup viendo la ventana de ;<utline; del Eclipse
1donde nos muestra todos los controles insertados !asta el momento35

EditText
EditText
Universidad Alas Peruanas
Escuela Profesional de Ingeniera de Sistemas
Taller de Diseo de Aplicaciones Mviles

Mg. Ricci Ramrez Rivera Pgina 4

=$ >uestro pro0lema solo re,uiere dos controles de tipo *adio+utton$ Para 0orrarlo
lo podemos !acer directamente del formulario seleccion#ndolo & presionando la
tecla delete o seleccion#ndolo desde la ventana ;<utline; & luego presionando la
tecla delete$
?$ A!ora a los dos controles de tipo *adio+utton definimos sus id 1los llamaremos r4 & r6
respectivamente3$
@$ Cam0iamos sus propiedades te(t por los te(tos ;sumar; & ;restar;$


A$ Tam0iBn De0emos cam0iar los id de los controles EditTe(t por et4 & et65
Universidad Alas Peruanas
Escuela Profesional de Ingeniera de Sistemas
Taller de Diseo de Aplicaciones Mviles

Mg. Ricci Ramrez Rivera Pgina 5


4C$ Por 'ltimo agreguemos un 0otn & un Te(t.ie/ para mostrar el resultado
Inicialiamos las propiedades del 0otn con los valores5
id 5 0utton4
te(t 5 operar

44$ D el tercer Te(t.ie/ con los valores5

id 5 tv8
te(t 5 resultado
46$ Podemos controlar en la ventana ;<utline; el id definido para cada control 1tv4)
et4) tv6) et6) radio"roup4) r4) r6) 0utton4) tv83
Universidad Alas Peruanas
Escuela Profesional de Ingeniera de Sistemas
Taller de Diseo de Aplicaciones Mviles

Mg. Ricci Ramrez Rivera Pgina 6


48$ *evise el arc!ivo5 activit&7main$(ml) luego de insertar todos los elementos
anteriores) de0e ,uedar as5

Universidad Alas Peruanas
Escuela Profesional de Ingeniera de Sistemas
Taller de Diseo de Aplicaciones Mviles

Mg. Ricci Ramrez Rivera Pgina 7



49$ A0rir la clase MainActivit& & escri0ir el siguiente cdigo5
Universidad Alas Peruanas
Escuela Profesional de Ingeniera de Sistemas
Taller de Diseo de Aplicaciones Mviles

Mg. Ricci Ramrez Rivera Pgina 8




4:$ Primero de0emos enlaar el o0%eto 0utton4 con el mBtodo operar$ Para esto
seleccionamos el control 0utton4 & cam0iamos la propiedad <nClicE por el valor operar
1si no !acemos esto nunca se e%ecutar# el mBtodo operar de la clase MainActivit&3$
Universidad Alas Peruanas
Escuela Profesional de Ingeniera de Sistemas
Taller de Diseo de Aplicaciones Mviles

Mg. Ricci Ramrez Rivera Pgina 9


4=$ Como podemos ver el cdigo) tenemos dos o0%etos m#s ,ue de0emos inicialiar en el
mBtodo onCreate5

r4F1*adio+utton3find.ie/+&Id1*$id$r43G
r6F1*adio+utton3find.ie/+&Id1*$id$r63G

4?$ Has varia0les r4 & r6 son de la clase *adio+utton & son necesarios en el mBtodo operar
para verificar cu#l de los dos *adio+utton est#n seleccionados$
4@$ Ha clase *adio+utton tiene un mBtodo llamado isC!ecEed ,ue retorna true si dic!o
elemento est# seleccionado5

pu0lic void operar1.ie/ vie/3 I
String valor4Fet4$getTe(t13$toString13G
String valor6Fet6$getTe(t13$toString13G
int nro4FInteger$parseInt1valor43G
int nro6FInteger$parseInt1valor63G
if 1r4$isC!ecEed13FFtrue3 I
int sumaFnro4Jnro6G
String resuFString$value<f1suma3G
tv8$setTe(t1resu3G
K else
if 1r6$isC!ecEed13FFtrue3 I
int restaFnro4Lnro6G
String resuFString$value<f1resta3G
tv8$setTe(t1resu3G
K
K

4A$ E%ecutar el programa5
Universidad Alas Peruanas
Escuela Profesional de Ingeniera de Sistemas
Taller de Diseo de Aplicaciones Mviles

Mg. Ricci Ramrez Rivera Pgina 10


III

EJERCICIOS PROPUESTOS

4$ Crear un programa Android ,ue permita !acer la compra de un peridico)
para ello el usuario de0e seleccionar ,ue peridico desea indicando el
n'mero de e%emplares ,ue comprar# & el da de la semana en ,ue est#
realiando la compra) tomando en cuenta las siguientes indicaciones5
6$ Hos diarios ,ue se venden a travBs del celular & sus costos son5
Ha *epu0lica SM$8$CC 1Si es Martes o Nueves el precio es SM$8$:C3
El Comercio SM$ 6$:C
El Pue0lo SM$4$:C 1Si es Domingo el precio es SM$6$CC3
>oticias SM$6$CC 1Si se compran m#s de 8 e%emplares tiene un 4CO de
descuento$3
8$ Ha aplicacin de0e mostrar al cliente cu#l es el precio final de su compra$