SUB ELEMENTO DE LA CAPACIDAD

• EL ESTUDIANTE ESTARÁ EN LA CAPACIDAD DE HACER APLICACIONES DONDE PUEDA TOMAR FOTOS,

SELECCIONAR IMÁGENES COMO TAMBIÉN EN ENVIAR MENSAJES DE TEXTO SMS Y A WHATSAPP

2
HACER UN PROYECTO EN DONDE TOME
UNA FOTO Y SELECCIONE UNA IMAGEN
Para este ejemplo tienen que crear un proyecto llamado Foto

3
Paso 1: Ir al archivo AndroidManifest.xml y hacer las siguientes configuraciones

Aquí colocamos los permisos para tomar una foto.

Aquí colocamos el permiso para seleccionar una imagen de tu archivo.

Colocamos este código para que

funcione la toma de fotos desde
tu aplicativo.

4
Paso 2: crear una archivo siguiendo la siguiente ruta
1.- Clic derecho sobre la carpeta res luego New y luego Android Resource File 1
2.- Se muestra la siguiente ventana en donde haremos los cambios que se observa en la imagen.

2 Colocamos un nombre a nuestro archivo.

Seleccionamos esta opción, no lo escriban.

Luego Clic

5
Paso 3: observar el archivo creado y a la vez abrirlo y colocar el siguiente código

Este código nos permite entrar a nuestras imágenes alojadas en nuestro

celular.

6
Paso 4: Ahora hacemos el diseño. El diseño final es el que se muestra en la imagen-

Aquí estamos usando una

imagen propia de Android
Studio. Revisar Fichas atrás
donde se explica como se

7
escoge y se inserta una
imagen
Paso 5: en este paso vamos explicar las partes que vamos a utilizar para colocar los códigos para la toma de fotos y la
selección de imágenes

En esta área declaramos las variables a utilizar en el código JAVA

En esta área colocaremos los códigos de los botones

En esta área colocaremos FUNCIONES para la toma de fotos y selección

de imágenes. SI SE DAN CUENTA EL CODIGO IRIA EN MEDIO DE ESAS DOS
LLAVES.

8
Paso 6: primero declaramos las variables. Mirar la imagen.

Una variable para el ImageView que tenemos en el diseño

Una variable para el ImageButton que tenemos en el diseño
Una variable para el Button que tenemos en el diseño

Ahora declaramos dos variables que

usaremos para la toma de foto

Una variable de tipo String para almacenar la ruta de la foto.

9
Paso 7: ahora colocaremos las FUNCIONES, en el lugar que se indico anteriormente, para la toma de foto y la
selección de imágenes.

Con la función gotCamara() nos permitirá tomar la foto.

Esta ruta lo sacan de su archivo AndroidManifest.xml. En mi caso tiene esta ruta, en sus casos tendrán otra ruta, es por eso que en su archivo
de su proyecto encuentra el que es.

Con la función createFile() – lo que hará es en crear en

un archivo la foto tomada con la cámara y a la vez le
coloca su nombre por defecto y su extensión en .JPG y
también se le da la ruta a ubicarse

10 RECOMENDACIÓN:
Primero crear la función createFile() y.
Segundo crear la función gotCamara()
Paso 7: ahora colocaremos la función de seleccionar imágenes, esto lo hacemos debajo de la función createFile().

Nos permite esconder o mostrar el código, para este caso esta escondido, si quiero mostrar solo le doy clic en el símbolo mas y se muestra todo su contenido.

Este código me permitirá seleccionar

una imagen de mi galería de fotos que
tenga en mi celular.

11
Esto no se tipea, se muestra solo cuando colocan el numero 301
Paso 8: ahora colocaremos 2 funciones, esto lo hacemos encima de gotCamara().

Este código me permite verificar si el

usuario que va a usar el aplicativo le ha
dado el permiso para usar la cámara del
celular.

En esta función evaluara si la imagen

Aquí cuando la imagen es cuando que se colocara en el ImageView es de
tomas una foto. la foto tomada o es una imagen
seleccionada de la galeria

Aquí cuando la imagen es seleccionada

de la galería

12 NOTA:
Picture es el nombre que se declaro de variable, que viene del diseño
Paso 9: ahora vinculamos las variables de JAVA con las variables que vienen del diseño.

Vinculamos o Enlazamos una a una,

nuestras variables Java con las variables
de diseño

Recuerde estas funciones ya lo

hicieron anteriormente, así
debería ir quedando. Si se ve así
es porque hemos ocultado
código.

13
Paso 9: ahora colocaremos código a nuestros botones.

Código para tomar la foto

Código para seleccionar una imagen de

14
la galería.
AHORA A EJECUTARLO EN SU
CELULAR PARA VER SU
RESULTADO.
15
HACER UN PROYECTO PARA ENVIAR
MENSAJES SMS Y A WHATSAPP
Para este ejercicio crear un proyecto llamado Mensajes

16
Realiza el siguiente diseño.

17
Paso 1: comenzar a diseñar

18
Paso 2: terminamos de diseñar

19
Paso 3: Ahora colocaremos código en JAVA

AQUÍ DECLARAMAMOS LAS VARIABLES

AQUÍ VINCULAMOS LAS VARIABLES DE

JAVA CON LAS VARIABLES QUE VIENE
DEL DISEÑO

CON ESTE CODIGO PEDIMOS PERMISO

PARA PODER ENVIAR MENSAJES

AQUI VA EL NUMERO

AQUI VA EL MENSAJE
CON ESTE CODIGO QUE CONTIENE EL
BOTON, ENVIAMOS MENSAJES A OTRO
CELULAR

20
Paso 4: Ahora colocaremos código en JAVA, codificamos el botón de envió de mensajes a WhatsApp

El código del botón Enviar mensaje a

whatsapp colocarlo debajo del otro
botón.

Con este código enviamos mensajes a

WhatsApp

21
TRABAJO
• REALIZAR LAS SIGUIENTES ACCIONES:
CONTRATO DE PERSONAL
La idea es la siguiente:
▪ Realizar el siguiente diseño. Ingrese su nombre

▪ Cuando den clic en el botón foto pueda Ingrese su apellido

tomar una foto.
▪ En el botón registrar que solo muestre un Seleccionar foto
mensaje que diga se registro con éxito.
▪ En el botón Salir colocarle un Alert Dialog, Ingrese un mensaje

en donde tenga 2 opciones. Ingrese un celular

REGISTRAR SALIR

22
 PROYECTO 1
USO DE:
TABS - WEBVIEW -
VIEWPAGER2
CREACIÓN DE PROYECTO

24
1: Creamos el proyecto siguiendo a ruta de la imagen

2: seleccionamos uno en blanco y luego clic en Next

25
3: Colocamos nombre a nuestro proyecto, seguir los pasos de la imagen.
 Agregar dependencias al proyecto

Estas dependencias son librerías que necesita ciertos componentes o widgets de nuestro
proyecto

27
3: Agregar una dependencia a nuestro proyecto.

2
 Agregar permisos al proyecto

Estos permisos son como conexión a internet, uso de la cámara web, etc.

29
HACER EL DISEÑO

30
1: Realizamos el diseño de nuestra interfaz.

El código del Aquí en nuestro diseño no se

container TAB muestra nada porque todo las
pestañas lo haremos por
código.

El código del
widget
ViewPager2

31
 CREAR FRAGMET
Estos fragments van a ir dentro de las pestañas y son una herramienta para crear
aplicaciones

32
1: Clic derecho sobre la carpeta, New, Fragment y Fragment Blank.

2: Colocar el nombre de su Fragment.

ATENCIÓN
Cuando creas un fragment por defecto se crea dos archivos. Mirar la imagen.

Aquí hago el código

Aquí hago el diseño

34
3: Resultado.

* Lo preparamos al Fragment que acabamos de crear, para utilizarlos

35
4: hacemos el siguiente diseño en este fragment creado.

Uso del Widget

WebView

NOTA:
El WebView permite
mostrar contenido web
dentro de una aplicación

36
* Colocamos el siguiente código que me permite mostrar una pagina web en mi aplicación móvil.

Cargamos la siguiente URL al WebView

1: Creando el SEGUNDO FRAGMENT, New, Fragment y Fragment Blank.

2: Colocar el nombre de su Fragment.

3: Resultado.

* Lo preparamos al Fragment que acabamos de crear, para utilizarlos

NOTA:
Segundo Fragment
4: hacemos el siguiente diseño en este fragment creado.
* Colocamos el siguiente código que me permite mostrar una pagina web en mi aplicación móvil.
1: Creando el TERCER FRAGMENT, New, Fragment y Fragment Blank.

2: Colocar el nombre de su Fragment.

3: Resultado.

* Lo preparamos al Fragment que acabamos de crear, para utilizarlos

NOTA:
Tercer Fragment
4: hacemos el siguiente diseño en este fragment creado.
* Colocamos el siguiente código que me permite mostrar una pagina web en mi aplicación móvil.
 Crear una clase para ordenar los TABs

Esta clase me permitirá llevar el control del uso de los TABs que estes manipulando.

46
1: Clic derecho sobre la carpeta, New y Java Class. Seguir los paso de la imagen.

1 2 3

2: Colocar nombre a la clase. Ver la imagen.

3: Resultado. Ver la imagen.

Agregar el extends

4: ahora importar métodos de OrdenTabsAdaptador. Coloquen el cursor sobre OrderTabsAdaptador

5: Resultado. Ver la imagen.

Colocamos todos
los fragments que
tenemos
6: AHORA colocar el constructor a la clase. Solo pongan el cursor sobre FragmentStateAdapter
2
1

7: Ver el resultado final

COLOCAR CODIGO EN EL MAIN ACTIVITY

51
1: Enlazar las variables del diseño con el de JAVA.

En el ViewPager colocar el primer TAB

2: Colocar código para el manejo de los TABs .
3: Colocar código para el manejo de los ViewPager .
Este código lo colocamos debajo del anterior código

AHORA A EJECUTAR SU APLICACIÓN

TRABAJO
• APLICAR LO APRENDIDO EN EL USO DE TABS – VIEWPAGER2 - WEBVIEW:
La idea es la siguiente:
▪ Hacer un Splash.
▪ Un login y
▪ Un Tab

55
Splash Menu

Usuarios Reporte Opciones

BIENVENIDOS A CHINEMA
Por favor, primero tienes que
identificarte… El contenido de cada pestaña
esta en la siguiente
Correo diapositivas

Contraseña

REGISTRAR SALIR
Reporte de usuarios Opciones
Martinez tiravante ansuine
Perez Rioja Miguel
Ver nuevos planes
Balarezo Ramirez Dany
Lopez Risco Gabriel promociones

Flores Flores Miguel Mejora tu plan

Chavez Chavez Maria
Cespedes Flores Ruperto
Vasquez Sanchez Vanessa
Ubillus Cotrina Chabela
PREGUNTAS
O
DUDAS ?