Capturar fotos de cámara y álbum
Clase 38 de 57 • Curso de Ionic Avanzado 2017
Contenido del curso
Estructura de nuestra App con Ionic
- 4

Arquitectura de una app en Ionic
03:55 min - 5

Proyecto: Platzinger App
15:43 min - 6
Repositorio del curso
00:11 min - 7

Qué son pages y cómo generar las primeras de nuestra app
17:29 min - 8

Navegación básica entre pages
12:58 min - 9
Reto: Página “Acerca de” accesible desde el menú lateral
00:10 min - 10

Tomando los conceptos compartidos de Angular y Ionic
01:52 min
Basics de Angular y TypeScript
- 11
Aclaraciones Ionic vs Angular
01:03 min - 12

Cómo usar tipos de datos con typescript
11:08 min - 13

Qué son e implementando interfaces de TypeScript
09:52 min - 14

NgFor aplicado en la lista de usuarios
06:43 min - 15

NgIf aplicado en la lista de usuarios
05:59 min - 16

Navegación con parámetros
07:27 min - 17

Accediendo a nuestros usuarios con conversation.ts
06:21 min - 18

Creando un servicio de usuarios e inyectando el servicio en nuestros pages
08:45 min - 19

Pipes en TypeScript (Date, Number, Json)
07:53 min - 20

Creando nuestro propio 'Pipe' para buscar entre nuestros contactos
11:56 min - 21
Reto: Mostrar un icono diferente según el status del usuario
00:16 min
Agregando estilos con CSS a nuestra aplicación
- 22

Cómo usar estilos CSS y referenciar recursos
17:23 min - 23

Implementando estilos en la pantalla de login
13:27 min - 24

Implementando estilos en la pantalla de home
12:02 min - 25

Implementando estilos en la pantalla de conversación
12:28 min - 26

Usando ngStyle y ngClass para añadir estilos dinámicos
10:44 min - 27

Cambiar icono según status
08:16 min
Acceso a datos remotos
- 28

Información importante antes de continuar
01:16 min - 29

¿Qué es Firebase?
03:56 min - 30

Reemplazo del servicio de usuarios por un servicio dinámico con conexión a Firebase
20:40 min - 31

Login/Registro de usuarios con email y password
13:49 min - 32

Login/Registro de usuarios con Facebook
22:06 min - 33

Implementando Log Out
08:59 min - 34
Creando un CRUD implementando un API REST HTTP (con diversos backends)
02:11 min
Opciones y Acceso Nativo
- 35

Crear page de Perfil
08:14 min - 36

Editar datos básicos del perfil de usuario
19:35 min - 37

Configurando Android Studio
22:04 min - 38

Capturar fotos de cámara y álbum
Viendo ahora - 39

Preparando aplicación para recibir fotos desde la cámara y galería del Android
09:00 min - 40

Guardando y asignando una foto de perfil al usuario desde la cámara
15:49 min - 41

Preparando aplicación para utilizar geolocalización
14:29 min - 42

Conectándonos al API de Google
12:41 min
Conversación
Amigos
- 47

Planeación previa para la característica / Cómo generaremos las solicitudes
02:56 min - 48

Enviando una solicitud de amistad
17:17 min - 49

Revisando solicitudes de amistad
10:50 min - 50

Aceptando solicitudes de amistad
18:44 min - 51

Mostrando sólo amigos
06:34 min - 52

Componentes anidados (con paso de parámetros)
12:13 min
Deploy
Contenido Bonus
Antes que nada, vamos a nuestro archivo app.component.ts para cambiar el rootPage a LoginPage.
Vamos a acceder a la cámara de nuestro dispositivo gracias al plugin de Ionic para la Cámara, como podemos ver debemos correr dos comandos para su instalación:
ionic cordova plugin add cordova-plugin-camera
npm install –save-exact @ionic-native/camera
Una vez instalado, dentro de nuestro archivo app.module.ts en la parte de providers, añadiremos nuestro paquete de Camera.
En nuestra pantalla de Profile añadiremos dos botones que al darles click ejecutaran un método asíncrono el cual se encargara de tomar una foto ya sea de forma directa de la cámara o del álbum de fotos.
Para tomar una foto usaremos un método del objeto Camera llamado getPicture, el cual añadimos a los providers de la aplicación, este método recibe como parámetro unas opciones de configuración de la cámara las cuales crearemos a partir del objeto CameraOptions, entre sus opciones se encuentran:
- quality: recibe un valor del 0 al 100 indicando el porcentaje de calidad que quieras en tu fotografía, su valor por defecto es 50.
- targetWidth: recibe un valor numérico el cual representa la cantidad de pixeles que tendrá el ancho de la foto.
- targetHeight: al igual que targetWidth recibe un valor numérico, pero en este caso representa el alto de la foto.
- encodingType: es el formato en que se entregara la foto que tome la cámara.
- allowEdit: si el dispositivo tiene herramientas de edición en la cámara esta opción dejara que el usuario utilice dichas herramientas de edición o no.
- sourceType: establece la fuente de la imagen.