Couchbase Móvil contiene un robusto y potente base de datos NoSQL integradallamada Couchbase Liteque se pueden utilizar con iOS, Android y Xamarin aplicaciones. La pila de Couchbase Mobile también contiene Pasarela de sincronización. Sync Gateway permite la sincronización segura de datos entre clientes compatibles con Couchbase Lite. Sync Gateway ha existido durante años, pero el año pasado Couchbase Mobile 2.0 introdujo oficialmente un nueva replicación basada en web-sockets para la sincronización de datos, más eficaz que su predecesor basado en HTTP.
Teniendo en cuenta todos los cambios de Couchbase Mobile y el reciente lanzamiento de versión 2.5Empecé a pensar en formas únicas de visualizar las mejoras mediante una aplicación. Empecé por fijar un par de requisitos sencillos. Quería que la aplicación
-
- Sé sencillo
- Diviértete
- Muestra la potencia de Couchbase Mobile
Al final, decidí investigar qué haría falta para crear una aplicación que incluyera algo que probablemente todos hemos hecho de niños, para divertirnos o simplemente cuando estamos aburridos. Dibujar. ¿Y qué hay más divertido que dibujar? Eso es, ¡dibujar en colaboración!
Para empezar
Nunca antes había creado una aplicación que permitiera dibujar en tiempo real, pero conocía algunos enfoques que podrían servir. Para mí, la favorita era una biblioteca que llevaba unos años dando que hablar; Skia.
Skia es una aplicación 2D de código abierto biblioteca gráfica que proporciona API comunes que funcionan en diversas plataformas de hardware y software. Sirve como motor gráfico para Google Chrome y Chrome OS, Android, Mozilla Firefox y Firefox OS, y muchos otros productos, incluidos los móviles. La mayor parte del mantenimiento de Skia corre a cargo de Google, pero su uso es totalmente gratuito.
Me gustaba la idea de utilizar Skia para mis dibujos táctiles, pero quería crear una aplicación multiplataforma. Con más de unos años de experiencia en Xamarin, ya estaba familiarizado con SkiaSharpuna aplicación multiplataforma de Skia basada en .NET.
Así que creé un Xamarin.Forms e incluyó la solución SkiaSharp nuget paquete. Me quedé impresionado, ya que después de sólo unas pocas líneas de código tenía un Skia Canvas (SkCanvasView) en mi interfaz de usuario,
1 |
y pude empezar a escuchar los eventos táctiles en el código de mi página.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 |
void OnTouchEffectAction(objeto remitente, TouchActionEventArgs args) { var punto = nuevo Modelos.Punto { X = args.Ubicación.X, Y = args.Ubicación.Y }; interruptor (args.Tipo) { caso TouchActionType.Prensado: ... romper; caso TouchActionType.Movido: ... romper; } } |
A partir de esos acontecimientos pude sentar las bases de las representaciones vectoriales en 2D sobre un lienzo. Al fin y al cabo, los dibujos bidimensionales se reducen a un componente básico: un punto. Una colección de puntos crea una ruta, y una colección de rutas crea... un dibujo.
Huzzah¡! Ahora que era capaz de capturar los puntos, crear rutas a partir de esos puntos y, en última instancia, dibujos a partir de esas rutas, tenía los datos que necesitaba para compartir entre lienzos en instancias separadas de la aplicación.
El poder de Couchbase Mobile
Como se mencionó anteriormente, la pila de Couchbase Mobile contiene tanto una base de datos NoSQL integrada llamada Couchbase Lite, como un mecanismo de sincronización de datos llamado Sync Gateway. Combinado con la potencia de Couchbase Server, una base de datos distribuida NoSQL basada en JSON, los datos pueden ser empujados y sacados hacia y desde el borde.
El soporte de Sync Gateway está totalmente integrado en los paquetes Nuget de Couchbase.Lite y Couchbase.Lite.Enterprise, y puedes encontrar más información sobre cómo hacerlo aquí.
La clave del almacenamiento de datos en una base de datos basada en documentos se centra en cómo los los datos se modelan. Por suerte, en esta aplicación, el modelado de datos era fácil. Todo cerró el círculo porque todo lo que necesitaba almacenar, a través de JSON, era una colección de puntos dentro de colecciones de rutas.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 |
{ "color": "#000000", "creadoPor": "cca6ebe8-a713-49ac-bb86-cff0fb095ab2", "id": "059fee8c-fbb3-450e-a1f1-61d82a28e68b", "puntos": [ { "tipo": "punto", "x": 101.333, "y": 339.667 }, { "tipo": "punto", "x": 101.333, "y": 340.3333282470703 } ], "tipo": "camino" } |
A continuación, simplemente guardé la información del punto y la ruta en la base de datos integrada de Couchbase Lite. A partir de ahí, Sync Gateway se encarga del resto y, voilà, ¡un lienzo compartido simplificado con Couchbase Mobile!
Presentación de CouchDraw
Obviamente, he pasado por alto algunos de los detalles más importantes de la aplicación de la que he estado hablando, pero no temas, he creado una página web de la aplicación. nuevo repositorio ¡para ello! En el nuevo "CouchDraw"junto con el código fuente, también he incluido un archivo LÉAME con muchos más detalles sobre cómo descargar, configurar y ejecutar la solución. No dudes en dejar todo lo que estés haciendo ahora mismo e ir a comprobarlo.
CouchDraw es una aplicación muy básica, y, como tal, hay muchas maneras de mejorarla (aquí es donde entras tú). Desafío a la comunidad móvil y Couchbase a sumergirse y ampliar en CouchDraw ¡Funcionalidad!
Algunas ideas de nuevas funciones pueden ser:
-
- Sustitución de los botones de color por un control deslizante de gama para la selección del color.
- Añadir la posibilidad de cambiar el grosor de las líneas.
- Añadir la posibilidad de borrar las líneas que se han dibujado.
Próximos pasos
Junto con la ampliación del soporte de dibujo sincronizado a iOS y Android nativos, también integraré Couchbase Mobile's replicación peer-to-peer y consulta predictiva características en CouchDraw. Esté atento a las próximas entradas de esta serie.