tarea

1. APP MOVILES
María De Lourdes Ramírez Villaseñor
Salvador Sánchez Muñoz
DESARROLLO DE APLICACIONES MOVILES

2. P á g i n a 1 | 25
INDICE:
ACTIVIDAD PÁGINA
1.-APP: MENSAJE HOLA MUNDO __________________________________________2
2.-APP: LISTA DE INVITADOS______________________________________________6
3.-APP: LISTA DE INVITADOS FASE 2________________________________________8
4.-APP: LISTA DE INVITADOS FASE 3________________________________________10
5.-APP: IMAGEN Y MENSAJE_______________________________________________12
6.-APP: IMAGEN Y MENSAJE FASE 2_________________________________________15
7.-APP: IMAGEN Y MENSAJE FASE 3_________________________________________17
8.-APP: RELATIVE LAYOUT NOMBRE_________________________________________19
9.-APP: RELATIVE LAYOUT NOMBRE FASE 2___________________________________23

3. P á g i n a 2 | 25
APP: MENSAJE “HOLA MUNDO”
OBJETIVO: que al abrir la aplicacioneste muestre un mensaje
determinadoy que al presionarun botón cambie este
mensaje.
PROCESO:
1. El primer paso es agregar los objetos: BUTTON y TEXTVIEW
que se desea mostrar desde el principio. Esta acción se
realizara desde la pestaña “activity_main.xml”.
Button: Esta es la que se encarga de realizar una acción.
TextView: Aquí se ingresa el texto que se desea mostrar.
2.-El siguiente paso es ingresar a la pestaña “Text” marcada en
amarillo.

4. P á g i n a 3 | 25
3.-luego de ingresar se escribirá el siguiente código que se muestra:
4.-En el siguiente paso es ingresar a la pestaña “MainActivity.java”
señalada en verde.
“android:id=”:enestase anotara el nombre
con el que quiere seridentificadola
etiqueta.
“android:layout=”:estasirve para
configurarlaanchura y altura de la opcióna
configurar.
“android:text=”:aquíse anotara el mensaje
a mostrar.
“android:textSize=”:sirve parael tamaño
de letra.
“android:textColor=”:el colordel texto.
Atributos Utilizados:

5. P á g i n a 4 | 25
5.-SE ANOTA EL SIGUIENTE CODIGO CON ALGUNOS DETALLES.
1.-aquí se crean las variables, se creara dependiendo el tipo de
objeto utilizado, en este caso es un “Button”, “TextView” y un
“String” la cual es para anotar letras. En el “String” se define el
mensaje deseado a mostrar.
2.- se define las variables y relaciona los botones creados en la
sección de “activity_main.xml”.
3.- dentro del paso dos, se marcó con un número “3”, estas
cambiaran dependiendo el id marcado en las etiqueta de cada
objeto. En este ejemplo es “BOTON” y “hola”.
4.-esta sección es la que se encargara de la acción que realizará
luego de apretar el botón. En este caso, se apretara y mostrara el
mensaje creado en la variable “String”.
1
2
3
4

6. P á g i n a 5 | 25
RESULTADO:
ANTES DE APRETAR
“ACEPTAR”
LUEGO DE APRETAR
“ACEPTAR”
Conclusion:enesta app aprendi a como configurar un boton y ver coo puedojugar con las
configuracionesde esta misma para poderlograr que mis app futuras funcionende la mejor
manera.

7. P á g i n a 6 | 25
APP: LISTA DE INVITADOS FASE 1, 2 Y 3.
Objetivo. Crear una app dondese muestre una lista de
personas, con configuraciones especificasa la app.
Se mostrara tres versiones diseñadas y se mostrara los atributos modificados.
Cada etapa se creara en “activity_main.xml”.
FASE 1: copiarel código siguiente:

8. P á g i n a 7 | 25
FASE1: ETIQUETAS UTILIZADAS EN CADA OBJETO:
OBJETO ETIQUETA FUNCION
<TextVi
ew/>
android:background=”” Esta se encargarade mostrarel color de fondodel
mensaje
OBJETO ETIQUETA FUNCION
<LinearLayout></LinearLayout> Sirve para colocarvistasenuna mismafila
o columna,pero noambas cosas a la vez.
<LinearLayout> Android:oreintation=”” Determinasi lasvistasse alinean
verticalmenteuhorizontalmente.
RESULTADOS
FASE 1
Comprendi que existe una parte conocida como text que
me funciona como creador de codigos las cuales
disppongo de todo los objetos y sus etiquetas.

9. P á g i n a 8 | 25
FASE2.- En esta etapa, se utilizará el mismo código pero con configuraciones
distintas de las etiquetas.

10. P á g i n a 9 | 25
1.-eneste caso,lo únicoque cambiason las configuracionesde losparámetros
“Android:layout_widthyAndroid:layout_weight”dependiendolasmedidassolicitadas,cadauna
de estasrepresentalaanchuray altura de losobjetosseleccionados.
Se le cambia a placer,peroeneste caso fueronlasmedidas mostradasanteriormente.
En este caso,la etiqueta: Android:layout_weightesutlizadaparadividirenvariasparteslos
bojetos,estodependeráde lamedidaque se especifique,el intervaloesde 1 a 6, y el total
siempre deberáser6,la sumade todas ellas.
RESULTADOS
FASE 2
Esta etiquetadaque se le conoce como
weightes utilizadocomo divisorde
objetos,como en este caso esta lista.
Aprendi a configurarlas,como se maneja,
sus limites,yla mejorforma de manejarlo.

11. P á g i n a 10 | 25
FASE3.- se utilizaráel códigode la fase 2, perosolose modificara la
etiquetallamada=”Android:backgrund=”que se agregao se ubica dentrode
cada objeto, se le asignarael color mediante códigohtml. Para saber el
código de algún color, se busca mediante internet odentrode estamisma
aplicación.

12. P á g i n a 11 | 25
RESULTADOS
FASE 3
En esta app aprendimosa manipular la
etiquetabackground, la cual nos permitio
jugar con loscolores de los objetos,y que
esta debe de escribirse encodigo (color).

13. P á g i n a 12 | 25
APP: IMAGEN Y MENSAJE.
OBJETIVO: quela app muestre una imagen y debajo de esta muestre un
mensaje.
En esta se realizaron 3 versiones deeste mismo programa, cada una es
llamada por fases.
FASE1: en este caso se usaron nuevas etiquetas que seexplicaran en la parte
inferior del código que se muestra a continuación, esta deberá ser copiada a
su Android Studio.

14. P á g i n a 13 | 25
OBJETO ATRIBUTO FUNCION
ImageView Android:scaleType=”” Esta sirvepara
configurar la posición
de la imagen
seleccionada
Android:src=”” En esta sección se
agergara la imagen que
deseamos, pero
primero se deberá
agragar en la carpeta
llamada “drawable”.
En este caso, esos fueron los nuevos atributos que se conocieron, todas las
demás fueron explicadas en anteriores programas.

15. P á g i n a 14 | 25
RESULTADOS
FASE 1
Aprendimosy comprendimoscomo se
deberaagregar una imagende la forma
correecta y configurarla dependiendola
posicionque se deseaubica, e este caso el
centro.

16. P á g i n a 15 | 25
FASE2.- EN ESTE CASO,ESTA VERSION,A DIFERENCIA DELA FASE 1, LO UNICOQUE SE
MODIFICARA ES EL TEXTO, LA CUAL SE BEREA RELLANARLOS ESPACIOSQUE SE DEJO EN LA
APLICACIÓN ANTERIOR.
EN ESTE CASO,SOLO DEBERAN CAMBIARSE LASCONFIGURACIONESDEL ATRIBUJOQUE MODIFICA
LA ANCHURA DEL OBJEO,LA CUAL ES “Android:layout_width”,se sustituiráel “wrap_content”a
“match_parent”y nada mas eso,estamodificaciónse le aratodoslosTextView.

17. P á g i n a 16 | 25
RESULTADOS
FASE 2
Se conocioa como modificar y rellenar
todo el estacio que no se utilizo,
modificandola anchura de las cosas.
En este caso, gracias a este cambio, la app
se ve mas presentable.

18. P á g i n a 17 | 25
FASE3.- en este caso,se le agregara bordesa la app con el atributoconocido
como=”Android:layout_marguin…”,estase utilizaráparaagregar bordes,comoya se explicó.
En este caso,este atributotiene susparametros,lascualeste permitiránagregarborde al lado
deseado.Eneste casoserá el borde general yunaque dividael textoy laimagen.

19. P á g i n a 18 | 25
RESULTADOS
FASE 3
Se aprendioa jugar con las
configuracionesmarquin,para lograr que
la app sea mejor para el usurio que lo
utlice,marqui te permite separar objetos
unos de otros dependiendoel grosorque
tu desees,enmi caso solo fueronminimos
las separaciones.

20. P á g i n a 19 | 25
APP RELATIVE LAYOUT NOMBRES
Objetivo: que se muestre en la pantalla 4 textos por separado, cada
una de ellas en una esquina.
EN ESTAS DOS FASES, SE UTLISARA <RELATIVE LAYOUT>: La posiciónde
cada vistase puede especificarcomo relativaaelementoshermanos(comoalaizquierdaodebajo
de otra vista) o enposicionesrelativasal RelativeLayoutáreaprincipal (comoalineadasconla
parte inferior,izquierdaocentro).
TAMBIEN SE UTLIZARAN NUEVASETIQEUTAS QUE SE MENCIONARA LA FONRMA DE USARLA
HASTA EL FINALDE CADA CODIGO.

21. P á g i n a 20 | 25
Atributos LAYOUT
android:layout_above Posicionael borde inferiorde estavistasobre el IDde vistade
anclaje dado.
android:layout_alignBaseline Posicionalalíneade base de esta vistaenla líneade base del
ID de vistade anclaje dado.
android:layout_alignBottom Hace que el borde inferiorde estavistacoincidaconel borde
inferiorde laID de vistade anclaje dada.
android:layout_alignEnd Hace que el borde final de estavistacoincidaconel borde final
de la ID de vistade anclaje dada.
android:layout_alignLeft Hace que el borde izquierdode estavistacoincidaconel
borde izquierdode laIDde vistade anclaje dada.
android:layout_alignParentBottom Si es verdadero,hace que el borde inferiorde estavista
coincidacon el borde inferiordel padre.
android:layout_alignParentEnd Si es verdadero,hace que el borde final de estavistacoincida
con el borde final del padre.
android:layout_alignParentLeft Si es verdadero,hace que el borde izquierdode estavista
coincidacon el borde izquierdodelpadre.
android:layout_alignParentRight Si es verdadero,hace que el borde derechode estavista
coincidacon el borde derechodel padre.
android:layout_alignParentStart Si es verdadero,hace que el borde inicial de estavistacoincida
con el borde inicial del padre.
android:layout_alignParentTop Si es verdadero,hace que el borde superiorde esta vista
coincidacon el borde superiordel padre.
android:layout_alignRight Hace que el borde derechode estavistacoincidacon el borde
derechode laID de vistade anclaje dada.

22. P á g i n a 21 | 25
android:layout_alignStart Hace que el borde de iniciode estavista coincidacon el borde
de iniciode laID de vistade ancla dada.
android:layout_alignTop Hace que el borde superiorde estavistacoincidaconel borde
superiorde laID de vistade anclaje dada.
android:layout_alignWithParentIfMissing Si se establece enverdadero,el padre se utilizarácomoanclaje
cuandono se puedaencontrarel anclapara layout_toLeftOf,
layout_toRightOf,etc.
android:layout_below Posicionael borde superiorde estavistadebajode laID de
vistade ancla dada.
android:layout_centerHorizontal Si es verdadero,centraaeste niñohorizontalmente dentrode
su padre.
android:layout_centerInParent Si es verdadero,centraaeste hijohorizontal yverticalmente
dentrode su padre.
android:layout_centerVertical Si es verdadero,centraaeste hijoverticalmente dentrode su
padre.
android:layout_toEndOf Posicionael borde de iniciode estavistaal final de laID de
vistade ancla dada.
android:layout_toLeftOf Posicionael borde derechode estavistaala izquierda del ID
de vistade anclaje dado.
android:layout_toRightOf Posicionael borde izquierdode estavistaaladerechadel ID
de vistade anclaje dado.
android:layout_toStartOf Posicionael borde final de estavistaal iniciode laIDde vista
de ancla dada.

23. P á g i n a 22 | 25
RESULTADOS
FASE 1
Al objervar las etiqeutasde layout,
comprendi que cada parte del cuerpode la
pnatalla deberaser acomodada de la
mejormanera, para que el espaciose
aproveche al maximo, y no solo gaste
almacen para cosas innnecesarias.

24. P á g i n a 23 | 25
FASE 2: MUESTRA NOMBRE DE USUARIOS, CON CONFIGURACIONES
ESPECÍFICAS, COMO UBICACIÓN, UNION DE DOS NOMBRES, ENTRE
OTRAS.

25. P á g i n a 24 | 25

26. P á g i n a 25 | 25
RESULTADOS
FASE 2
Al objervar las etiqeutasde layout,
comprendi que cada parte del cuerpode la
pnatalla deberaser acomodada de la
mejormanera, para que el espaciose
aproveche al maximo, y no solo gaste
almacen para cosas innnecesarias.