CIZO es una gran aplicación. Creada por fans para fans, ahorra a los usuarios la molestia de buscar en Internet los últimos avances en vídeo, ofreciéndoles una selección seleccionada de “lo mejor de lo próximo” en su dispositivo iOS: cine, videojuegos, moda, conciertos, tecnología y mucho más.
Nos gusta el contenido, el diseño y las animaciones que tiene. Pero CIZO tiene un problema de entrega de contenidos. No se ha implementado ningún mecanismo existente, como las notificaciones push, para avisar a los usuarios de la llegada de nuevos vídeos. Como consecuencia, los usuarios podrían perderse nuevos tráilers si no consultan CIZO todos los días.
Así que no pudimos evitar preguntarnos: ¿hay otra forma de informar a los usuarios sobre nuevos contenidos sin abrir la aplicación?
iOS 10 ofrece la solución
Lo primero que uno nota tras instalar iOS 10 es que Apple ha eliminado la función “Deslizar para desbloquear” de la pantalla de bloqueo. Ahora, si intentas deslizar la pantalla de la forma a la que estabas acostumbrado, verás una pantalla de bloqueo llena de widgets de Hoy. Esto resulta muy práctico cuando quieres consultar el tiempo, los titulares o la información de tránsito, ya que no tienes que desbloquear el teléfono para verlo. Basta con una pasada rápida.
Cuando vimos la vista previa de iOS, la solución a nuestro problema CIZO se hizo evidente: ¿Y si añadimos un widget CIZO Today que pudiera mostrar y lanzar la reproducción de vídeo desde el widget?
Implementación del widget CIZO Today
Ahora, vamos a guiarte a través del proceso de creación y presentación de un widget en la pantalla Hoy.
Añadir el objetivo
Como primer paso, necesitamos añadir un nuevo objetivo a la propia aplicación CIZO.
Para ello, abra el proyecto CIZO en Xcode y elija Archivo > Nuevo > Objetivo. Y, a continuación, seleccione Extensión Hoy.
Si reconstruimos la aplicación CIZO después de añadir el objetivo Today Extension, podemos ver que aparece como un widget que se puede añadir a la pantalla:
Si en este punto añadiéramos el widget CIZO a la pantalla de bloqueo, este sería su aspecto:
Todo eso es muy fácil. Ahora sólo falta presentar contenidos.
Decidir qué mostrar
La primera idea fue reutilizar la vista en carrusel que utiliza la propia aplicación contenedora. Eso permitiría a los usuarios desplazarse entre los vídeos destacados de la misma manera bellamente animada. Sin embargo, Apple señala que los desarrolladores deben aanular la colocación de una vista de desplazamiento dentro de un widget “Hoy”, ya que es difícil para los usuarios desplazarse dentro del widget sin desplazarse inadvertidamente a la vista “Hoy”.
Así que decidimos seguir la recomendación de Apple y decidimos mostrar sólo los tres últimos vídeos destacados en el widget.
Controlador de vista inicial
Al crear la extensión Today para CIZO, Xcode creó un controlador de vista inicial (que ahora se ajusta a NCWidgetProviding) . Si abrimos el archivo MainInterface.storybord dentro del objetivo, podemos ver una vista con la etiqueta “Hola Mundo” en ella. Reemplazamos esta vista por una Horizontal Stack View que contiene tres vistas de imagen:
Código
- (void)openURL:(NSURL *)URL completionHandler:(void (^)(BOOL success))completionHandler;
En la implementación de este método llamamos a la API de vídeo destacado. Si la respuesta es diferente a la de la llamada anterior, el widget extrae información sobre los tres primeros vídeos nuevos y coloca imágenes en miniatura en las vistas de imágenes. La presentación resultante tiene este aspecto:
Tiene buena pinta, pero para que se parezca más a la propia aplicación CIZO y los usuarios sepan que están viendo vídeos destacados, decidimos incorporar las mismas etiquetas que en la propia aplicación.
El resultado:
Añadir detalles
Esto va en una buena dirección, pero queremos detalles como un título y una descripción. Por desgracia, no hay espacio para esos detalles. Si pusiéramos una etiqueta debajo de la imagen, la sobrecargaríamos de información, puesto que ya hemos puesto una etiqueta “Destacado” encima.
Pensamos que sería mejor revelar información adicional al tocar la imagen. Así que fuimos a Storyboard y añadimos un Reconocedor de Gestos de Toque para cada imagen y un Controlador de Vista de Detalle Presente como la acción asociada con el reconocedor:
Ahora, cuando pulsamos sobre imagen, esto es lo que vemos:
Activar la reproducción
El controlador de la vista detallada incluye un icono “Reproducir” en la parte superior de la miniatura del vídeo. Podemos conectar este icono al enlace de vídeo que devuelve la API de vídeo, permitiendo al usuario abrir esta URL pulsando sobre la imagen. La codificación es sencilla:
-(void)openURL:(NSURL *)URL completionHandler:(void (^)(BOOL success))completionHandler;Esta parte es interesante, porque normalmente un mensaje como este se enviaría al objeto sharedApplication . Sin embargo, las extensiones no tienen acceso al objeto sharedApplication y no pueden utilizar el método openURL para abrir el enlace. Podemos evitar esta restricción enviando el mensaje openURL:completionHandler: a la instancia NSExtensionContext , que es accesible como la propiedad extensionContext de UIViewController.
De este modo, al pulsar sobre el icono Play, la aplicación web CIZO se abre en Safari y reproduce el tráiler:
Gestión de esquemas de URL
Sin embargo, esto plantea una cuestión interesante para los desarrolladores. ¿Y si CIZO fuera una aplicación independiente? sin ¿un componente de aplicación web? Podríamos seguir utilizando el widget Hoy, pero querríamos abrir la reproducción de vídeo en la propia aplicación CIZO. Para ello, basta con implementar un esquema de URL personalizado.
He aquí dos formas de crear una URL esquema:
Automáticamente selija el objetivo de la aplicación que contiene en la lista de Proyectos y Objetivos, luego vaya a la página “Información” y expanda el grupo de ajustes “Tipos de URL”. En este caso, introduciría “cizo” en el campo URL y seleccione “editor” como función:
También puede añadir manualmente una URL modificando el archivo Info.plist de la aplicación. Para añadir un URL para “cizo” añadiría la siguiente clave y matriz:
En el delegado de la aplicación contenedora, implementa:
- (BOOL)application:(UIApplication *)app openURL:(NSURL *)url options:(NSDictionary *)options;De esta manera, cuando se llama usted será capaz de analizar url para obtener el id de vídeo apropiado para reproducir este vídeo.
Además, cuando llame – [auto.extensionContext openURL:videoUrl completionHandler:…] de la extensión, asegúrese de utilizar la extensión “cizo” en lugar de “https” al llamar al videoUrl.
Puedes leer más sobre la comunicación entre aplicaciones aquí: Comunicación entre aplicaciones
Y así es como se ve ahora:
Por último, tenga en cuenta la siguiente advertencia de la
Guía de referencia de la API
a la hora de crear un nuevo esquema de URL:
Resumen
Apple hizo posible implementar extensiones de forma muy sencilla. Y parece que las extensiones formarán parte de nuestra vida de desarrollo durante mucho tiempo. En este caso, recomendamos pensar en las extensiones al principio del desarrollo de la aplicación. Cuando cree una nueva aplicación, piense en utilizar frameworks integrados (Construcción de marcos modernos). Puede que te ayude cuando empieces a implementar extensiones y tengas que ocuparte de compartir el código.
¿Y ahora qué?
Ya se trate del último tráiler de la próxima superproducción de superhéroes, de la próxima consola de videojuegos de realidad virtual, del próximo gran lanzamiento de zapatillas o de los festivales de música más populares del verano, CIZO los reúne todos en un solo lugar para que siempre sepas qué comprar, qué ver y adónde ir. ¿Qué es lo próximo en la hoja de ruta de CIZO?
Apoyar los enlaces universales
Actualmente, cuando un usuario toca la miniatura de un vídeo en el widget CIZO, la aplicación web CIZO se abre en Safari para reproducir el vídeo. Planeamos implementar enlaces universales en el futuro, de modo que un toque en la miniatura haga que el vídeo abra la aplicación CIZO en su lugar. Se podría argumentar que un esquema de URL personalizado ya es suficiente para enviar el vídeo a la aplicación CIZO, y en este caso de uso estaríamos de acuerdo. Si tienes el widget Hoy en tu dispositivo, la aplicación CIZO ya está instalada. Pero los enlaces universales ofrecen ventajas adicionales. Se basan en enlaces HTTP o HTTPS estándar a su sitio web y, a diferencia de los esquemas de URL personalizados, un enlace universal no puede ser reclamado por otra aplicación.