miércoles, 27 de mayo de 2015

Proyecto Kinect: uso de Model-View-ViewModel (MVVM)

Model-View-ViewModel (MVVM) es un patrón de diseño de aplicaciones para desacoplar código de interfaz de usuario y código que no sea de interfaz de usuario. Con MVVM, es definida la interfaz de usuario de forma declarativa (mediante lenguaje XAML) y se usa el marcado de enlace de datos para vincularla a otras capas que contengan datos y comandos de usuario. La infraestructura de enlace de datos proporciona un acoplamiento débil que mantiene sincronizados la interfaz de usuario y los datos vinculados.

El patrón MVVM organiza el código de tal manera que es posible cambiar partes individuales sin que los cambios afecten a las demás partes. Esto presenta numerosas ventajas de cara al uso del patrón:
  • Acelera el proceso de desarrollo.
  • Simplifica las pruebas unitarias.
  •  Mejora la estabilidad y rendimiento de la aplicación.
  •  Reduce los riesgos del proyecto.
Cuando se hace uso del patrón MVVM, una aplicación se divide en las siguientes capas:
  • La capa de modelo (Model) es la responsable de todos los datos de la aplicación y de la lógica de negocios relacionada. Esta capa es completamente independiente de las capas de vista y modelo de vista. Habitualmente hay un solo modelo por aplicación.
  •  La capa de vista (View) define la interfaz de usuario que utiliza marcado declarativo (XAML). El marcado de enlace de datos (Data Binding) define la conexión entre los componentes específicos de la interfaz de usuario y diversos miembros del modelo de vista.
  •  La capa de modelo de vista (ViewModel) proporciona los destinos de enlace de datos para la vista. Expone los datos del modelo de tal forma que sea fácil usar Bindings en la vista.
En este proyecto se hace un guiño a este patrón MVVM. El uso que se hace de él es proporcionar un enlace de datos, que vaya desde la interfaz de la aplicación (View) al modelo de datos (Model) hospedado en el servidor web, pasando por el modelo-vista (ViewModel) capaz de enlazar los datos y actualizarlos cuando en la vista o en el modelo se produzcan cambios. El esquema del patrón seguido es como indica el siguiente esquema:

Esquema de relaciones en el patrón MVVM

Un ejemplo reducido de la infraestructura en tres capas del patrón MVVM que aplicamos para nuestra aplicación es como sigue:

1. - En nuestra aplicación se hace uso de un servidor web que tiene hospedado el modelo de datos. En él se definen los contratos del modelo, lo cual define las propiedades que se van a enviar. En la siguiente imagen se muestra el código reducido del modelo:

Código C# de parte del modelo de la entidad Paciente

2. - En la aplicación cliente se debe hospedar el modelo-vista. Un ejemplo reducido de él es como se muestra en la siguiente imagen:

Código C# de parte del modelo-vista de la entidad Paciente

Como ya dijimos, el modelo-vista aparte de enlazar datos también los actualiza. Es por ello que se puede ver cómo se implementa la interfaz INotifyPropertyChanged, siendo la encargada de lanzar el evento PropertyChanged cada vez que el valor de alguna propiedad cambia. En la siguiente imagen se detalla el evento mencionado:

Código C# del evento PropertyChanged
3. - En la interfaz se define la vista, siendo esta detallada con código XAML. Siguiendo el ejemplo reducido de nuestra aplicación, puede verse un enlace de datos en la siguiente imagen:

Código XAML con Binding
Como se puede ver en la vista, la propiedad Text de los TextBlock es bindeada (Binding) con las propiedades UsuarioPaciente y ContrasenaPaciente del modelo-vista. 

La forma en que el patrón MVVM ayuda a WPF a enlazar los datos con suma facilidad es lo que le hace ser una gran elección para su utilización en el desarrollo de proyectos como este.

Con este post finalizo los posts relacionados con las tecnologías y entornos utilizados y aplicados al proyecto Kinect.

¡Saludos!

Álvaro Alcolea

domingo, 24 de mayo de 2015

Proyecto Kinect: uso de Windows Presentation Foundation (WPF)

Windows Presentation Foundation (WPF) es un marco de trabajo de interfaz de usuario que permite crear aplicaciones cliente enriquecidas e interactivas. Esta plataforma de desarrollo WPF admite un amplio conjunto de características de desarrollo de aplicaciones, que incluye un modelo de aplicaciones, recursos, controles, gráficos, diseño, enlace de datos, documentos y seguridad. Es un subconjunto de .NET Framework, además hace uso del lenguaje XAML.

La ventaja específica que XAML ofrece a WPF es que XAML es un lenguaje completamente declarativo. En un lenguaje de programación declarativa, el desarrollador (o diseñador) describe el comportamiento y la integración de los componentes sin utilizar programación procedural. La utilización de XAML para desarrollar interfaces de usuario permite, también, la separación entre modelo y vista, lo que se considera un buen principio de arquitectura. En XAML, los elementos y atributos mapean las clases y propiedades en el API subyacente.

Entre las características más importantes de WPF:
  • Ofrece un conjunto de servicios de datos para permitir a los desarrolladores de aplicaciones enlazar y manipular los datos dentro de las aplicaciones.
  • Admite consultas LINQ, como se detalló en el post sobre LINQ to Entities.
  • Proporciona plantillas de datos para controlar la presentación de los datos.
  • Proporciona un conjunto de controles integrados, que contiene elementos como botones, menús, listas, etc.
  • Separación lógica entre un control y su apariencia.
  • Proporciona un sistema integrado para la creación de interfaces de usuario con elementos multimedia comunes, como imágenes vectoriales y de mapa de bits, audio y vídeo.
  • Soporta la mayoría de formatos de imagen más comunes: BMP, JPEG, PNG, GIF, iconos, etc.
  • Admite por defecto los formatos de vídeo WMV, MPEG y algunos archivos AVI.
El uso de WPF en el proyecto viene motivado por las ventajas que suponen todas las características que ofrece, además de la gran adecuación y estabilidad que añade con respecto a las demás tecnologías utilizadas. El hecho de ser un subconjunto de .NET Framework nos asegura la compatibilidad, por ejemplo, con WCF, Entity Framework y la SDK de Kinect.

En el siguiente post hablaré del patrón de diseño Model-View-ViewModel (MVVM).

¡Saludos!

Álvaro Alcolea

jueves, 21 de mayo de 2015

Proyecto Kinect: uso de Windows Communication Foundation (WCF)

WCF es un conjunto de librerías que provee Microsoft en el framework .NET para la construcción de aplicaciones orientadas a servicios.

Su objetivo básico es el de unificar las comunicaciones. No importa que nuestra aplicación distribuida se comunique a través de TCP en unos servicios, en otros en SOAP y en otros en REST, WCF da soporte a los anteriores protocolos, permitiendo que el código de la aplicación desarrollada sea independiente del protocolo que se vaya a utilizar.

WCF consigue dicha independencia realizando una separación entre operaciones y datos. Establece un contrato a través de una interfaz, y ésta a su vez será implementada por una clase.

El servicio se compone a grandes rasgos de:
  • Contrato de servicio (ServiceContract): expone una operación que nuestro servicio web es capaz de ejecutar. Se corresponde con una interfaz.
  • Contrato de operación (OperationContract): expone el método que va a ser incluido en el ServiceContract y que será ofrecido al exterior para su uso por parte de los clientes.
  • Contrato de datos (DataContract): implementa un tipo de dato que el servicio web será capaz de manejar. Generalmente, será el tipo de dato que manejará el contrato de servicio.
  • Datos de miembro (DataMember): es el atributo que será enviado al cliente como parte del DataContract. No se enviarán los atributos que no tengan esta anotación.
  • Implementación del servicio: implementará la interfaz correspondiente al contrato de servicio, haciendo uso del contrato de datos para intercambiar la información.
Un ejemplo de las partes en que se compone WCF viene expuesto en el siguiente esquema:

Esquema de relaciones entre los componentes de WCF
En el esquema anterior se puede ver el contrato de servicio (ServiceContract) que contiene la interfaz (IServiceContract) con todos los contratos de operación (OperationContract). Dicha interfaz es implementada, y a su vez, hace uso del contrato de datos (DataContract). En el ejemplo, el tipo de dato es Paciente que es enviado para uso de las OperationContract.

El uso de WCF en este proyecto y no de otra tecnología de servicios se debe a la facilidad e independencia con la que trabaja a la hora de realizar el despliegue de servicios web. Dicho lo cual en el esquema anterior es posible ver con un simple golpe de vista las relaciones existentes entre los componentes de WCF.

En el siguiente post hablaré de Windows Presentation Foundation (WPF).

¡Saludos!

Álvaro Alcolea

miércoles, 13 de mayo de 2015

Proyecto Kinect: uso de LINQ to Entities

LINQ to Entities proporciona la capacidad de realizar consultas integradas en Language-Integrated Queries (LINQ) permitiendo escribir consultas contra el modelo conceptual de Entity Framework mediante los lenguajes Visual Basic o Visual C#. Las consultas con EF se representan mediante consultas de árboles de comandos, que se ejecutan en el contexto del objeto. LINQ to Entities convierte las consultas de LINQ en consultas de árboles de comandos, ejecuta las consultas en EF y devuelve objetos que se pueden usar tanto en EF como en LINQ.

Una operación de consulta de LINQ consta de tres acciones: obtener el origen o los orígenes de datos, crear la consulta y ejecutar la consulta.

En la consulta se especifica exactamente la información que se desea recuperar del origen de datos. Una consulta también puede especificar cómo se debe ordenar, agrupar y conformar esa información antes de que se devuelva. En LINQ, una consulta se almacena en una variable. Esta variable de consulta no realiza ninguna acción y no devuelve datos; solamente almacena la información de la consulta. Tras crear una consulta debe ejecutarla para recuperar los datos.

Las consultas de LINQ to Entities se pueden formular en dos sintaxis diferentes:
  • Sintaxis de expresiones de consulta.
  • Sintaxis de consultas basadas en métodos.
La sintaxis de expresiones de consulta consta de un conjunto de cláusulas escritas en una sintaxis declarativa similar a Transact-SQL. Al usar la sintaxis de consulta, se pueden realizar operaciones complejas de filtrado, clasificación, ordenación y agrupación en orígenes de datos con una cantidad mínima de código. En la siguiente imagen, se muestra un método que realiza una consulta completa, incluyendo el uso de un origen de datos, la definición de la expresión de consulta y la ejecución de la consulta por medio de una instrucción foreach:

Código C# con ejemplo de sintaxis de expresiones de consulta
La sintaxis de consultas basadas en métodos no son más que una secuencia de llamadas directas a los métodos de operador de LINQ, como son Where, Select, GroupBy, OrderBy, Join, Max, etc., a las que además se le deben pasar como parámetros expresiones lambda. En la siguiente imagen se puede ver un ejemplo de consulta utilizando expresiones Lambda.

Código C# con ejemplo de sintaxis de consultas basadas en métodos
En comparación, los dos tipos de sintaxis de LINQ son bastante simples, sin embargo para realizar las consultas en el proyecto se ha decidido utilizar la sintaxis de expresiones de consulta estándar, ya que no es necesario crear expresiones Lambda que podrían tornarse complejas cuando la consulta requiera de una mayor elaboración.

En el siguiente post, hablaremos de las librerías para la construcción de aplicaciones orientadas a servicios, Windows Communication Foundation (WCF).

¡Saludos!

Álvaro Alcolea

domingo, 10 de mayo de 2015

Proyecto Kinect: uso de ADO.NET Entity Framework (EF)

ADO.NET Entity Framework es un framework ORM (Object-Relational Model) para la plataforma .NET. Consiste en un conjunto de APIs de acceso a datos. La primera versión fue incluida con .NET Framework 3.5 Service Pack 1 y Visual Studio 2008 Service Pack 1, realizada el 11 de agosto de 2008. Esta primera versión fue muy criticada. Seguidamente se lanzaron otras cuatro versiones hasta llegar a las versiones 5 y 6, corrigiéndose las críticas y problemas de versiones anteriores.

En este proyecto se hará uso de la versión 5.0 que es actualmente la versión estable, a diferencia de la versión 6.0 Alpha 2 que está en desarrollo.

Entity Framework nos ayudara a crear nuestro modelo conceptual y resolver nuestras necesidades de persistencia.

Actualmente permite elegir entre tres enfoques diferentes de creación del modelo conceptual:
  • Database First: El modelo conceptual se crea a partir de una base de datos existente.

Desarrollo del enfoque DataBase First
  • Code First: nuevo a partir de la versión 4.1 de EF. Permite mapear nuestras clases POCO (Plain Old CLR Object) a la base de datos usando convención, Data Annotations o Fluent API.
  • Model First: Este será el enfoque que utilizaremos para nuestro sistema. La idea aquí es crear primero el modelo conceptual y a partir de este generar la base de datos.
Desarrollo del enfoque Model First

La elección de Entity Framework en este proyecto viene motivada por las facilidades que permite a la hora de trabajar con objetos y propiedades específicos del dominio, sin tener que preocuparse por las tablas y columnas de la base de datos donde se almacenan los datos. 

EF además permite trabajar con un mayor nivel de abstracción cuando se trata con datos, pueden crearse y mantenerse aplicaciones orientadas a datos con menos código que en aplicaciones tradicionales. Al ser un componente de .NET Framework, las aplicaciones que hacen uso de EF pueden ser ejecutadas en cualquier equipo en el que esté instalado .NET Framework a partir de la versión 3.5 SP1. También y no menos importante EF 5.0 es completamente compatible con las demás tecnologías y lenguajes utilizados en el proyecto.

Entity Framework además, acepta consultas de tipo LINQ contra el modelo conceptual creado, en el siguiente post se tratará de explicar.

¡Saludos!

Álvaro Alcolea

miércoles, 6 de mayo de 2015

Proyecto Kinect: reconocimiento de comandos de voz

Con la ayuda del conjunto de micrófonos que incorpora Kinect y la API de reconocimiento de voz de Windows podemos reconocer la voz humana. Gracias a ello, es posible construir una serie de comandos de voz que controlen ciertas funcionalidades concretas de la aplicación.

La elección de esta tecnología que incluye Kinect viene motivada por el hecho de que a la hora de la realización de una terapia o a la hora de realizar el guardado de tareas de postura, se requeriría de otra persona para realizar dichas acciones en el sistema. Por todo ello, se considera la implementación de diversos comandos de voz que ayuden al usuario a realizar las acciones por sí mismo y sin necesidad de terceras personas.

La utilización del reconocimiento de voz en este proyecto a nivel de implementación se ha realizado usando la solución que permite el SDK oficial de Kinect. Usando la clase VoiceCommander se consigue el reconocimiento de palabras en el idioma castellano para la realización de determinadas funciones. Un ejemplo de aplicación en este proyecto puede verse a continuación.

Lo primero de todo es inicializar el objeto de la clase VoiceCommander, al que se le pueden pasar como parámetros una serie de palabras que serán los comandos de voz a detectar. Un ejemplo de código es el de la siguiente ilustración. En ella se detalla el comando de voz “realizar” utilizado para generar la función de realización de tarea postura por el paciente y su evento de detección.

Código C# de inicialización del comando de voz para la realización de tarea postura
En la siguiente ilustración se puede ver la implementación del método lanzado por el evento de detección de comandos de voz. En él se puede ver que para el caso de que el dispositivo Kinect detecte la palabra “realizar”, ejecutará el método SavePostura(skeletons).

Código C# del método lanzado por el evento de detección de voz
Hasta aquí llega este post, en sucesivos posts seguiré hablando de los frameworks utilizados para la creación y manejo de servicios web y de base de datos.

Álvaro Alcolea

domingo, 3 de mayo de 2015

Proyecto Kinect: Comparación de esqueletos

Se puede obtener una solución a la comparación entre articulaciones de distintos esqueletos, de la forma en que realizamos el guardado de las mismas en el punto anterior.

Teniendo guardado los puntos de las articulaciones de dos esqueletos, se podría realizar una comparación de los ángulos que forman entre sí. La utilización de esta técnica de comparación viene motivada por el hecho de que, por ejemplo, existen personas con diferente altura, es decir, diferente tamaño de esqueleto. Por tanto, otra técnica como, por ejemplo, la de diferenciar los puntos de las articulaciones, nos daría muchos problemas en la comparación. Dicho lo cual, se decide utilizar la técnica de cálculo de la amplitud o ángulo de las articulaciones del esqueleto. Esas amplitudes son comparadas para buscar las similitudes con las amplitudes de otros esqueletos.

Observando el esqueleto de la siguiente ilustración podemos observar los ángulos que serán calculados para realizar la comparación entre posturas, concretamente, para la parte del miembro superior.
Esquema con los ángulos a calcular

Fijándonos en un ángulo concreto su cálculo se realizará llamando al método devAnguloEntrePuntos, que devuelve el ángulo calculado y recibe como parámetros las coordenadas (x, y, z) de los tres Joints o puntos de unión. En la siguiente imagen se muestra el ángulo formado por las tres articulaciones (Joints).
Esquema del ángulo calculado a partir de tres articulaciones
El método en código C# es el siguiente:

Código C# para el cálculo del ángulo
El método devAnguloEntrePuntos hace uso de otro método para calcular el vector normal producido por las coordenadas de los tres Joints. El método para calcularlo es el siguiente:

Código C# para el cálculo del vector normal
Finalizando con este post, una vez que se ha realizado el cálculo de los ángulos de las articulaciones de dos posturas distintas (en nuestro sistema se habla de dos posturas una para el paciente, y otra, para el fisioterapeuta) se realiza la diferencia entre ambos ángulos. En la siguiente figura se puede ver el código necesario para realizar la diferencia entre el ángulo de la muñeca derecha del esqueleto del fisioterapeuta y del paciente.
Diferencia entre el ángulo del fisioterapeuta y del paciente
En el siguiente post, hablaré del reconocimiento de comandos de voz con Microsoft Kinect.

Un saludo!

Álvaro Alcolea