Slides del Xamarin Diplomado nivel Intermedio (participación del módulo de Enrique Aguilar)

2. Acceso a Azure Storage
(Blobs y Tablas NoSQL) con
Xamarin.iOS y Xamarin.Android
Enrique Aguilar Vargas
@enriqueaguilar
Síguenos en @msdevlatam
#XamarinDiplomado

3. Acceso a Azure Storage (Blobs y Tablas NoSQL) con
Xamarin.iOS y Xamarin.Android
Lecciones:
1.- Xamarin iOS con acceso a Azure Storage (Table NoSQL)
2.- Xamarin iOS con acceso a Azure Storage (Blobs)
3.- Xamarin Android con acceso a Azure Storage (Table NoSQL) – Download

4. Requisitos
Para el módulo requieres:
1.- Xamarin Studio (Xamarin.iOS y Xamarin.Android) o Visual Studio Preview
para Mac o Visual Studio 2015 con acceso a equipo Mac físico, virtualizado o
en la nube.
2.- iOS SDK y Android SDK.
4.- Cuentas de Apple Developer (puede ser la cuenta gratuita con certificado
provisional) y Google Developer.
5.- Cuenta de Azure.

5. Xamarin iOS con acceso a Azure Storage (Table NoSQL)
Se creará una Aplicación para iOS que cree y suba información a una tabla
NoSQL en Azure Storage.

6. Azure Storage
• Ideal para la Administración del Centro de Datos
• Gama de soluciones para cada necesidad.
• La escalabilidad que nunca sobrepasará.
• Flexible a medida que cambian las necesidades.
• Costos más bajos y pago solo por lo que necesita.

7. Preparar el Almacenamiento en Azure
En nuestro portal de Azure
agregamos un nuevo Storage de
tipo Cuenta de almacenamiento

9. Creamos una app para iOS con un
botón y agregamos el paquete Microsoft
Azure Storage del repositorio nuget.org
Aceptamos los términos de la licencia.

10. Creamos la entidad
para la generación de
la tabla
Creamos un método
para crear una alerta

11. Creamos la entidad para la generación de la tabla

12. Creamos la entidad para la generación de la tabla

17. Demo Xamarin – Azure Storage (Table NoSQL)
Aplicación con Xamarin iOS para crear una tabla en base a una entidad, envío
de datos a partir de una CloudStorageAccount, CloudTableClient, CloudTable y
TableOperation.
Código disponible en:
github.com/enriqueaguilarvargas

19. Xamarin iOS con acceso a Azure Storage (Blobs)
Se creará una Aplicación para iOS que suba una fotografía del iPhone al
contenedor de blobs en Azure Storage

20. Azure Storage (Blob)
• Los BLOB (Binary Large
Objects, objetos binarios
grandes) son elementos
utilizados en las bases
de datos para almacenar
datos de gran tamaño,
como imágenes, videos,
documentos, etc.

21. Creamos el
contenedor de
Blobs
Podemos subir
archivos al
contenedor creado.

22. Podemos utilizar el Microsoft Azure Storage Explorer para ver
los archivos en el contenedor.

23. 1.- Liberamos espacio en la parte superior, ya
que ahí se mostrará la salida de la cámara.
2.- Agregamos un botón que permitirá capturar
la imagen de la cámara en iOS.
3.- Agregamos un Image View donde se
mostrará la imagen capturada.
4.- Agregamos el botón de Respaldar en Azure
Storage.
Creamos una app para iOS que tenga
lo siguiente:

24. Código Xamarin.iOS – Azure Storage Blob
string archivoLocal;
AVCaptureDevice dispositivodeCaptura;
AVCaptureSession sesiondeCaptura;
AVCaptureDeviceInput entradaDispositivo;
AVCaptureStillImageOutput salidaImagen;
AVCaptureVideoPreviewLayer preview;
string ruta;
byte[] arregloJpg;
async Task autorizacionCamara()
{
var estatus = AVCaptureDevice.GetAuthorizationStatus(AVMediaType.Video);
if (estatus != AVAuthorizationStatus.Authorized)
{
await AVCaptureDevice.RequestAccessForMediaTypeAsync(AVMediaType.Video);
}
}
using System;
using UIKit;
using System.Drawing;
using System.Threading.Tasks;
using AVFoundation;
using Foundation;
using System.IO;
using Microsoft.WindowsAzure.Storage;
using Microsoft.WindowsAzure.Storage.Blob;

25. Código Xamarin.iOS – Azure Storage Blob
string archivoLocal;
AVCaptureDevice dispositivodeCaptura;
AVCaptureSession sesiondeCaptura;
AVCaptureDeviceInput entradaDispositivo;
AVCaptureStillImageOutput salidaImagen;
AVCaptureVideoPreviewLayer preview;
string ruta;
byte[] arregloJpg;
async Task autorizacionCamara()
{
var estatus = AVCaptureDevice.GetAuthorizationStatus(AVMediaType.Video);
if (estatus != AVAuthorizationStatus.Authorized)
{
await AVCaptureDevice.RequestAccessForMediaTypeAsync(AVMediaType.Video);
}
}
using System;
using UIKit;
using System.Drawing;
using System.Threading.Tasks;
using AVFoundation;
using Foundation;
using System.IO;
using Microsoft.WindowsAzure.Storage;
using Microsoft.WindowsAzure.Storage.Blob;

26. Código Xamarin.iOS – Azure Storage Blob
string archivoLocal;
AVCaptureDevice dispositivodeCaptura;
AVCaptureSession sesiondeCaptura;
AVCaptureDeviceInput entradaDispositivo;
AVCaptureStillImageOutput salidaImagen;
AVCaptureVideoPreviewLayer preview;
string ruta;
byte[] arregloJpg;
async Task autorizacionCamara()
{
var estatus = AVCaptureDevice.GetAuthorizationStatus(AVMediaType.Video);
if (estatus != AVAuthorizationStatus.Authorized)
{
await AVCaptureDevice.RequestAccessForMediaTypeAsync(AVMediaType.Video);
}
}
using System;
using UIKit;
using System.Drawing;
using System.Threading.Tasks;
using AVFoundation;
using Foundation;
using System.IO;
using Microsoft.WindowsAzure.Storage;
using Microsoft.WindowsAzure.Storage.Blob;

27. public void ConfiguracionCamara()
{
sesiondeCaptura = new AVCaptureSession();
preview = new AVCaptureVideoPreviewLayer(sesiondeCaptura)
{
Frame = new RectangleF(40, 50, 300, 350)
};
View.Layer.AddSublayer(preview);
dispositivodeCaptura = AVCaptureDevice.DefaultDeviceWithMediaType(AVMediaType.Video);
entradaDispositivo = AVCaptureDeviceInput.FromDevice(dispositivodeCaptura);
sesiondeCaptura.AddInput(entradaDispositivo);
salidaImagen = new AVCaptureStillImageOutput()
{
OutputSettings = new NSDictionary()
};
sesiondeCaptura.AddOutput(salidaImagen);
sesiondeCaptura.StartRunning();
}
Código Xamarin.iOS – Azure Storage Blob

28. public void ConfiguracionCamara()
{
sesiondeCaptura = new AVCaptureSession();
preview = new AVCaptureVideoPreviewLayer(sesiondeCaptura)
{
Frame = new RectangleF(40, 50, 300, 350)
};
View.Layer.AddSublayer(preview);
dispositivodeCaptura = AVCaptureDevice.DefaultDeviceWithMediaType(AVMediaType.Video);
entradaDispositivo = AVCaptureDeviceInput.FromDevice(dispositivodeCaptura);
sesiondeCaptura.AddInput(entradaDispositivo);
salidaImagen = new AVCaptureStillImageOutput()
{
OutputSettings = new NSDictionary()
};
sesiondeCaptura.AddOutput(salidaImagen);
sesiondeCaptura.StartRunning();
}
Código Xamarin.iOS – Azure Storage Blob

29. public void ConfiguracionCamara()
{
sesiondeCaptura = new AVCaptureSession();
preview = new AVCaptureVideoPreviewLayer(sesiondeCaptura)
{
Frame = new RectangleF(40, 50, 300, 350)
};
View.Layer.AddSublayer(preview);
dispositivodeCaptura = AVCaptureDevice.DefaultDeviceWithMediaType(AVMediaType.Video);
entradaDispositivo = AVCaptureDeviceInput.FromDevice(dispositivodeCaptura);
sesiondeCaptura.AddInput(entradaDispositivo);
salidaImagen = new AVCaptureStillImageOutput()
{
OutputSettings = new NSDictionary()
};
sesiondeCaptura.AddOutput(salidaImagen);
sesiondeCaptura.StartRunning();
}
Código Xamarin.iOS – Azure Storage Blob

30. Código Xamarin.iOS – Azure Storage Blob
btnCapturar.TouchUpInside += async delegate
{
var salidadevideo = salidaImagen.ConnectionFromMediaType(AVMediaType.Video);
var bufferdevideo = await salidaImagen.CaptureStillImageTaskAsync(salidadevideo);
var datosImagen = AVCaptureStillImageOutput.JpegStillToNSData(bufferdevideo);
arregloJpg = datosImagen.ToArray();
string rutacarpeta = Environment.GetFolderPath
(Environment.SpecialFolder.Personal);
string resultado = "Foto";
archivoLocal = resultado + ".jpg";
ruta = Path.Combine(rutacarpeta, archivoLocal);
File.WriteAllBytes(ruta, arregloJpg);
Imagen.Image = UIImage.FromFile(ruta);
};

31. Código Xamarin.iOS – Azure Storage Blob
btnCapturar.TouchUpInside += async delegate
{
var salidadevideo = salidaImagen.ConnectionFromMediaType(AVMediaType.Video);
var bufferdevideo = await salidaImagen.CaptureStillImageTaskAsync(salidadevideo);
var datosImagen = AVCaptureStillImageOutput.JpegStillToNSData(bufferdevideo);
arregloJpg = datosImagen.ToArray();
string rutacarpeta = Environment.GetFolderPath
(Environment.SpecialFolder.Personal);
string resultado = "Foto";
archivoLocal = resultado + ".jpg";
ruta = Path.Combine(rutacarpeta, archivoLocal);
File.WriteAllBytes(ruta, arregloJpg);
Imagen.Image = UIImage.FromFile(ruta);
};

32. Código Xamarin.iOS – Azure Storage Blob
btnRespaldar.TouchUpInside += async delegate
{
try
{
CloudStorageAccount cuentaAlmacenamiento = CloudStorageAccount.Parse
("DefaultEndpointsProtocol=https;AccountName=almacenamientoxamarin;AccountKey=UJ+
q1zwfv7lkb2d/cm8r9ycoc5ZgkNEbuypQYgM001p9E9CWChPtIBfW1A==");
CloudBlobClient clienteBlob = cuentaAlmacenamiento.CreateCloudBlobClient();
CloudBlobContainer contenedor = clienteBlob.GetContainerReference("imagenes");
CloudBlockBlob recursoblob = contenedor.GetBlockBlobReference(archivoLocal);
await recursoblob.UploadFromFileAsync(ruta);
MessageBox("Guardado en", "Azure Storage - Blob");
}
catch (StorageException ex)
{
MessageBox("Error: ", ex.Message);
}
};

33. Código Xamarin.iOS – Azure Storage Blob
btnRespaldar.TouchUpInside += async delegate
{
try
{
CloudStorageAccount cuentaAlmacenamiento = CloudStorageAccount.Parse
("DefaultEndpointsProtocol=https;AccountName=almacenamientoxamarin;AccountKey=UJ
q1zwfv7lkb2d/cm8r9ycoc5ZgkNEbuypQYgM001p9E9CWChPtIBfW1A==");
CloudBlobClient clienteBlob = cuentaAlmacenamiento.CreateCloudBlobClient();
CloudBlobContainer contenedor = clienteBlob.GetContainerReference("imagenes");
CloudBlockBlob recursoblob = contenedor.GetBlockBlobReference(archivoLocal);
await recursoblob.UploadFromFileAsync(ruta);
MessageBox("Guardado en", "Azure Storage - Blob");
}
catch (StorageException ex)
{
MessageBox("Error: ", ex.Message);
}
};

34. Código Xamarin.iOS – Azure Storage Blob
btnRespaldar.TouchUpInside += async delegate
{
try
{
CloudStorageAccount cuentaAlmacenamiento = CloudStorageAccount.Parse
("DefaultEndpointsProtocol=https;AccountName=almacenamientoxamarin;AccountKey=UJ+
q1zwfv7lkb2d/cm8r9ycoc5ZgkNEbuypQYgM001p9E9CWChPtIBfW1A==");
CloudBlobClient clienteBlob = cuentaAlmacenamiento.CreateCloudBlobClient();
CloudBlobContainer contenedor = clienteBlob.GetContainerReference("imagenes");
CloudBlockBlob recursoblob = contenedor.GetBlockBlobReference(archivoLocal);
await recursoblob.UploadFromFileAsync(ruta);
MessageBox("Guardado en", "Azure Storage - Blob");
}
catch (StorageException ex)
{
MessageBox("Error: ", ex.Message);
}
};

35. Código Xamarin.iOS – Azure Storage Blob
btnRespaldar.TouchUpInside += async delegate
{
try
{
CloudStorageAccount cuentaAlmacenamiento = CloudStorageAccount.Parse
("DefaultEndpointsProtocol=https;AccountName=almacenamientoxamarin;AccountKey=UJ+
q1zwfv7lkb2d/cm8r9ycoc5ZgkNEbuypQYgM001p9E9CWChPtIBfW1A==");
CloudBlobClient clienteBlob = cuentaAlmacenamiento.CreateCloudBlobClient();
CloudBlobContainer contenedor = clienteBlob.GetContainerReference("imagenes");
CloudBlockBlob recursoblob = contenedor.GetBlockBlobReference(archivoLocal);
await recursoblob.UploadFromFileAsync(ruta);
MessageBox("Guardado en", "Azure Storage - Blob");
}
catch (StorageException ex)
{
MessageBox("Error: ", ex.Message);
}
};

36. Código Xamarin.iOS – Azure Storage Blob
btnRespaldar.TouchUpInside += async delegate
{
try
{
CloudStorageAccount cuentaAlmacenamiento = CloudStorageAccount.Parse
("DefaultEndpointsProtocol=https;AccountName=almacenamientoxamarin;AccountKey
=UJ+q1zwfv7lkb2d/cm8r9ycoc5ZgkNEbuypQYgM001p9E9CWChPtIBfW1A==");
CloudBlobClient clienteBlob = cuentaAlmacenamiento.CreateCloudBlobClient();
CloudBlobContainer contenedor = clienteBlob.GetContainerReference("imagenes");
CloudBlockBlob recursoblob = contenedor.GetBlockBlobReference(archivoLocal);
await recursoblob.UploadFromFileAsync(ruta);
MessageBox("Guardado en", "Azure Storage - Blob");
}
catch (StorageException ex)
{
MessageBox("Error: ", ex.Message);
}
};

37. Demo Xamarin – Azure Storage (Blob)
Aplicación con Xamarin que toma una fotografía y la envía a un contenedor de
Blobs en Azure Storage a partir de un CloudStorageAccount, CloudBlobClient,
CloudBlobContainer y GetBlockBlobReference.
Código disponible en:
github.com/enriqueaguilarvargas

40. Xamarin Android con acceso a Azure Storage
(Table NoSQL y Blobs)
Se creará una Aplicación para Android que baje una fotografía del contenedor
de blobs y datos de una tabla NoSQL de Azure Storage.

41. Xamarin.Android
• Ingresamos a la cuenta
de Developer de Google
para obtener una Clave
de API para Google Maps
para poder tener acceso
a los Mapas.

42. Agregamos la clave de la API en el AndroidManifest.xml

43. Agregamos la clave de la API en el AndroidManifest.xml

44. 1.- Agregamos un Mapa en la zona superior.
2.- Agregamos el botón que descargará la
imagen, las coordenadas y que colocará la
imagen en un Image View y las coordenadas
las enviará al Mapa de Google.
3.- Agregamos un ImageView en la parte
central inferior.
Creamos una Interfaz Gráfica para
Android que tenga la siguiente
estructura:

49. Agregamos los
componentes de
Google Play
Services y
Geolocator Plugin

50. Xamarin.Android con Acceso a Azure Storage Blobs y Tables
NoSQL

51. Xamarin.Android con Acceso a Azure Storage Blobs y Tables
NoSQL

52. Xamarin.Android con Acceso a Azure Storage Blobs y Tables
NoSQL

53. Xamarin.Android con Acceso a Azure Storage Blobs y Tables
NoSQL

54. Xamarin.Android con Acceso a Azure Storage Blobs y Tables
NoSQL

55. Xamarin.Android con Acceso a Azure Storage Blobs y Tables
NoSQL

56. Xamarin.Android con Acceso a Azure Storage Blobs y Tables
NoSQL

57. Xamarin.Android con Acceso a Azure Storage Blobs y Tables
NoSQL

58. Xamarin.Android con Acceso a Azure Storage Blobs y Tables
NoSQL

59. Xamarin.Android con Acceso a Azure Storage Blobs y Tables
NoSQL

60. Xamarin.Android con Acceso a Azure Storage Blobs
y Tables NoSQL

61. Xamarin.Android con Acceso a Azure Storage Blobs
y Tables NoSQL

62. Xamarin.Android con Acceso a Azure Storage Blobs
y Tables NoSQL

63. Xamarin.Android con Acceso a Azure Storage Blobs
y Tables NoSQL

64. Xamarin.Android con Acceso a Azure Storage Blobs
y Tables NoSQL

65. Xamarin.Android con Acceso a Azure Storage Blobs
y Tables NoSQL

66. Código disponible en:
github.com/enriqueaguilarvargas
Demo Xamarin – Azure Storage
(Android con acceso a Blob y Table NoSQL)
Aplicación con Xamarin para Android que descarga una imagen y la coloca
en un ImageView, y descarga la altitud y longitud de una Tabla NoSQL y lo
coloca como coordenadas en una Mapa de Google.

69. Gracias por su atención
Enrique Aguilar (@enriqueaguilar)
Únete a la conversación en #XamarinDiplomado
Síguemos en @msdevlatam