[#NETMF] Intro o presentación y de regalo un tutorial para un Hello Valentino (mi versión del Hello World)

image

Buenas

después de presentar ayer .Net Micro Framework, hoy veremos más en detalle .Net Gadgeteer

.Net Gadgeteer (a partir de ahora GT) es una plataforma Open Source basada en .NET Micro Framework (NETMF). Si te suena Arduino, seguramente también te sonará Netduino que es la misma idea pero basada en NETMF. El punto donde GT se diferencia es que los fabricantes de hardware crean piezas que se montan en un modo plug-and-play con un motherboard. Esto hace que no solo sea divertido el crear gadgets, sino que además es bastante simple ya que no hay que preocuparse por la conexión de los periféricos. El corazón de GT es un módulo EMX que tiene un poco de todo: RAM, un procesador ARM, ethernet, etc. Lo bueno es que está modificado para poder olvidarse de las conexiones. La siguiente imagen muestra un motherboard donde no han dejado espacio para ningún sensor. (Y sí, eso grande que vez debajo es un display táctil que “hostea” apps WPF … o casi)

Nota: Aquí hay más de 100 sensores y motherboards diferentes para ver lo que puedes crear con GT http://www.netmf.com/gadgeteer/showcase.aspx?showcaseid=1

Software

Si te entró la curiosidad, lo único que tienes que saber es que para poder comenzar necesitas los siguientes prerequisitos de software:

  1. Microsoft Visual C# Express 2010

    You can still use professional or ultimate.

  2. Microsoft .NET Micro Framework 4.2 QFE2 SDK

    This SDK must be installed before step three.

  3. GHI Software Package v4.2 Feb. 18, 2013

    Includes NETMF and .NET Gadgeteer SDKs and components. See release notes and known issues.

Nota: Estos son los de la página oficial, cada 2 meses es mejor ver los mismos directamente en http://www.ghielectronics.com/support/.net-micro-framework

Lo siguiente es darse un repaso por el siguiente eBook gratis:

Beginners Guide to  C#  and the .NET Micro Framework
http://www.ghielectronics.com/downloads/FEZ/Beginners%20guide%20to%20NETMF.pdf

Son 60 páginas que realmente te ayudan a comenzar con GT.

Y ya estás listo para escribir tu primera aplicación. En este caso y para los siguientes ejemplos utilizaremos los sensores que vienen con el Kit “FEZ Spider Starter Kit”:

Creando la primera aplicación

Tenemos el hardware, tenemos el software, ahora toca crear el primer hola mundo ;).

1. Abrimos Visual Studio 2010. (en otro post comento porqué VS2010 y no VS2012)

2. Creamos un nuevo proyecto del tipo Visual C# // Gadgeteer // .Net Gadgeteer Appication (NETMF 4.2)

image

3. En VS2012 veremos un DSL con una placa FEZ Spider, un pequeño tip y en la barra de herramientas todos los sensores disponibles para utilizar.

image

4. Agregamos un elemento de tipo Button.

5. Luego desde el único conector del Button, conectamos el mismo con el motherboard. Un punto importante es que en el diseñador se nos ofrecerán los slots correctos para la conexión.

image

6. Una vez conectado tendremos algo similar a …

image

7. Ahora vamos a agregar un PowerPoint (o punto de poder) jua!. Lo conectamos automáticamente y tendremos lo siguiente:

image

8. Ya podemos comenzar a escribir código. Si limpiamos de comentarios y basura el código limpio de este ejemplo es el siguiente:

   1: using Microsoft.SPOT;

   2:  

   3: namespace GadgeteerApp2

   4: {

   5:     public partial class Program

   6:     {

   7:         void ProgramStarted()

   8:         {

   9:             Debug.Print("Program Started");

  10:         }

  11:     }

  12: }

9. Como en una app C# de las de siempre, tenemos intellisense, inline help, etc. Vamos inclusive un button se comporta como un button 😉

image

10. Y luego ya podemos agregar el “Hello Valentino”

   1: using Gadgeteer.Modules.GHIElectronics;

   2: using Microsoft.SPOT;

   3:  

   4: namespace GadgeteerApp2

   5: {

   6:     public partial class Program

   7:     {

   8:         void ProgramStarted()

   9:         {

  10:             button.ButtonPressed += ButtonButtonPressed;

  11:             Debug.Print("Program Started");

  12:         }

  13:  

  14:         void ButtonButtonPressed(Button sender, Button.ButtonState state)

  15:         {

  16:             Debug.Print("Hello Valentino !!!");

  17:         }

  18:     }

  19: }

11. Impresionante de simple. Ahora me toca armar el juguetito para probarlo “en vivo”

image

Nota: eso de detrás es un mando de Xbox (sin modelo que me crujen) y también un mate, es lo que tenemos los argentinos en exterior

12. Funciona de una, en cada clic del botón, tenemos el mensaje en el Output window.

image

 

Saludos @ Home

El Bruno

image image image

[#KINECT] HowTo: Use Face Recognition with #KinectSdk (II)

image

Buenas,

in the previous post I mentioned some of the main features to begin work with the kit for the recognition of gestures that included with the Kinect SDK .

Today we will see how to use this functionality in a WPF project. To do this follow these steps:

1 Create a new WPF project. In my case I called [ElBruno.FaceTracking02] and also I added the reference to [Microsoft.Kinect].

2. From the installation folder of the Kinect SDK Developer Toolkit, add references to the assemblies in Face Tracking. The location is similar to:

C:\Program Files\Microsoft SDKs\Kinect\Developer Toolkit v1.5.2\Samples\bin

and the references should be added to

  • Microsoft.Kinect.Tookit
  • Microsoft.Kinect.Tookit.FaceTracking

image

3 Change the project settings so that it is compiled into x 86 mode. In the project properties, select the “Build” section in Platform Target select “x 86”, and compile the project.

4. This step is a little “curious”, but in the next post I will put a more elegant way of doing this.From the folder

C:\Program Files\Microsoft SDKs\Kinect\Developer Toolkit v1.5.2\Redist\x86

copy the assemblies

  • FaceTrackData.dll
  • FaceTrackLib.dll

towards the compilation of our project directory.

image

5. Add a new UserControl in our project called [FaceTrackingViewer] and a class called [SkeletonFaceTracker]. As they have lot code inside, it is best download example zip and copy it complete.

6. The [SkeletonFaceTracker] class, the charge of using assemblies of the Toolkit, of recognizing and then paint the face points. For this, you subscribe to the [OnFrameReady] event of the Kinect sensor and it uses the Toolkit to get the points of the face. Better see some code that is fairly self-explanatory:

   1: internal void OnFrameReady(KinectSensor kinectSensor, ColorImageFormat colorImageFormat, 
   2:     byte[] colorImage, DepthImageFormat depthImageFormat, 
   3:     short[] depthImage, Skeleton skeletonOfInterest)
   4: {
   5:     _skeletonTrackingState = skeletonOfInterest.TrackingState;
   6:     if (_skeletonTrackingState != SkeletonTrackingState.Tracked)
   7:     {
   8:         return;
   9:     }
  10:  
  11:     if (_faceTracker == null)
  12:     {
  13:         try
  14:         {
  15:             _faceTracker = new FaceTracker(kinectSensor);
  16:         }
  17:         catch (InvalidOperationException)
  18:         {
  19:             Debug.WriteLine("AllFramesReady - creating a new FaceTracker threw an InvalidOperationException");
  20:             _faceTracker = null;
  21:         }
  22:     }
  23:  
  24:     if (_faceTracker == null) return;
  25:     var frame = _faceTracker.Track(colorImageFormat, colorImage, depthImageFormat, depthImage, skeletonOfInterest);
  26:     LastFaceTrackSucceeded = frame.TrackSuccessful;
  27:     if (!LastFaceTrackSucceeded) return;
  28:     if (_faceTriangles == null)
  29:     {
  30:         _faceTriangles = frame.GetTriangles();
  31:     }
  32:     _facePoints = frame.GetProjected3DShape();
  33: }

7. This class has another function which is which is responsible for drawing the mask on a canvas, where are the points of the face. Apart from the collection of points, creates an array of triangles and the paints on a work context.

   1: public void DrawFaceModel(DrawingContext drawingContext)
   2: {
   3:     if (!LastFaceTrackSucceeded || _skeletonTrackingState != SkeletonTrackingState.Tracked)
   4:     {
   5:         _startFaceRecognition = DateTime.MinValue;
   6:         return;
   7:     }
   8:  
   9:     var faceModelPts = _facePoints.Select(t => new Point(t.X + 0.5f, t.Y + 0.5f)).ToList();
  10:  
  11:     var faceModel = _faceTriangles.Select(t => new FaceModelTriangle
  12:     {
  13:         P1 = faceModelPts[t.First],
  14:         P2 = faceModelPts[t.Second],
  15:         P3 = faceModelPts[t.Third]
  16:     }).ToList();
  17:  
  18:     var faceModelGroup = new GeometryGroup();
  19:     for (var i = 0; i < faceModel.Count; i++)
  20:     {
  21:         var faceTriangle = new GeometryGroup();
  22:         faceTriangle.Children.Add(new LineGeometry(faceModel[i].P1, faceModel[i].P2));
  23:         faceTriangle.Children.Add(new LineGeometry(faceModel[i].P2, faceModel[i].P3));
  24:         faceTriangle.Children.Add(new LineGeometry(faceModel[i].P3, faceModel[i].P1));
  25:         faceModelGroup.Children.Add(faceTriangle);
  26:     }
  27:  
  28:     drawingContext.DrawGeometry(Brushes.BlueViolet, new Pen(Brushes.Red, 1.0), faceModelGroup);
  29:     if (_startFaceRecognition == DateTime.MinValue)
  30:     {
  31:         _startFaceRecognition = DateTime.Now;
  32:     }
  33:     else
  34:     {
  35:         if (DateTime.Now.Subtract(_startFaceRecognition).TotalSeconds > 5)
  36:         {
  37:             Application.Current.Dispatcher.BeginInvoke(new Action(() =>
  38:             {
  39:                 System.Threading.Thread.Sleep(300);
  40:                 _startFaceRecognition = DateTime.MinValue;
  41:             }));
  42:         }
  43:     }
  44: }

8. Now go to the viewfinder, which is that “paints” this surface [FaceTrackingViewer]. Inside the function [OnAllFramesReady] where processed data from the Kinect sensor is identified each of the skeletons in a State [SkeletonTrackingState.Tracked]. Once identified, creates a new instance of the SkeletonFaceTracker class and run the above steps to identify a face face. Each SkeletonFaceTracker instance is stored in a collection.

   1: foreach (Skeleton skeleton in this.skeletonData)
   2: {
   3:     if (skeleton.TrackingState == SkeletonTrackingState.Tracked
   4:         || skeleton.TrackingState == SkeletonTrackingState.PositionOnly)
   5:     {
   6:         if (!this.trackedSkeletons.ContainsKey(skeleton.TrackingId))
   7:         {
   8:             this.trackedSkeletons.Add(skeleton.TrackingId, new SkeletonFaceTracker() { });
   9:         }
  10:  
  11:         SkeletonFaceTracker skeletonFaceTracker;
  12:         if (this.trackedSkeletons.TryGetValue(skeleton.TrackingId, out skeletonFaceTracker))
  13:         {
  14:             if (this.Kinect != null)
  15:             {
  16:                 skeletonFaceTracker.OnFrameReady(this.Kinect, colorImageFormat, 
  17:                                     colorImage, depthImageFormat, depthImage, skeleton);
  18:                 skeletonFaceTracker.LastTrackedFrame = skeletonFrame.FrameNumber;
  19:             }
  20:         }
  21:     }
  22:  
  23: }

9. Finally, in the OnRender() of the control function is “painted” each one of the faces.

   1: protected override void OnRender(DrawingContext drawingContext)
   2: {
   3:     base.OnRender(drawingContext);
   4:     foreach (var faceInformation in this.trackedSkeletons.Values)
   5:     {
   6:         faceInformation.DrawFaceModel(drawingContext);
   7:     }
   8: }

10. The complete example includes a bit of code in the main to detect the kinect sensor and work with the same window. And another couple of details which I will comment on in a next post.

The example can be downloaded from http://sdrv.Ms/MZY0Eq

Saludos @ La Finca

El Bruno

image image image

[#KINECT] HowTo: Utilizar Face Recognition con #KinectSdk (II)

image

Buenas,

en el post anterior comenté alguna de las características principales para comenzar a trabajar con el kit de reconocimiento de gestos que se incluye con el Kinect SDK.

Hoy veremos como utilizar esta funcionalidad en un proyecto WPF. Para esto seguiremos los siguientes pasos:

1. Crearemos un nuevo proyecto WPF. En mi caso lo he llamado [ElBruno.FaceTracking02] y ademas he agregado la referencia a [Microsoft.Kinect].

2. Desde la carpeta de instalación del Kinect SDK Developer Toolkit, agregaremos las referencias a los ensamblados de Face Tracking. La ubicación es similar a:

C:\Program Files\Microsoft SDKs\Kinect\Developer Toolkit v1.5.2\Samples\bin

y se deben agregar las referencias a

  • Microsoft.Kinect.Tookit
  • Microsoft.Kinect.Tookit.FaceTracking

image

3. Cambiamos la configuración del proyecto para que compile en modo x86. En las propiedades del proyecto, seleccionamos la seccion “Build” y en Platform Target seleccionamos “x86”, y compilamos el proyecto.

4. Este paso es un poco “curioso” pero en el próximo post pondré una forma más elegante de hacerlo. Desde la carpeta

C:\Program Files\Microsoft SDKs\Kinect\Developer Toolkit v1.5.2\Redist\x86

copiamos los ensamblados

  • FaceTrackData.dll
  • FaceTrackLib.dll

hacia el directorio de compilación de nuestro proyecto.

image

5. Agregamos un nuevo UserControl en nuestro proyecto llamado [FaceTrackingViewer] y una clase llamada [SkeletonFaceTracker]. Como tienen bastante código dentro, lo mejor es bajar el zip de ejemplo y copiarlo completo.

6. La clase [SkeletonFaceTracker], el la encargada de utilizando los ensamblados del Toolkit, de reconcer y luego pintar los puntos de la cara. Para esto se suscribe al evento [OnFrameReady] del sensor Kinect y en el mismo utiliza el Toolkit para obtener los puntos de la cara. Mejor ver un poco el código que es bastante autoexplicativo:

   1: internal void OnFrameReady(KinectSensor kinectSensor, ColorImageFormat colorImageFormat, 

   2:     byte[] colorImage, DepthImageFormat depthImageFormat, 

   3:     short[] depthImage, Skeleton skeletonOfInterest)

   4: {

   5:     _skeletonTrackingState = skeletonOfInterest.TrackingState;

   6:     if (_skeletonTrackingState != SkeletonTrackingState.Tracked)

   7:     {

   8:         return;

   9:     }

  10:  

  11:     if (_faceTracker == null)

  12:     {

  13:         try

  14:         {

  15:             _faceTracker = new FaceTracker(kinectSensor);

  16:         }

  17:         catch (InvalidOperationException)

  18:         {

  19:             Debug.WriteLine("AllFramesReady - creating a new FaceTracker threw an InvalidOperationException");

  20:             _faceTracker = null;

  21:         }

  22:     }

  23:  

  24:     if (_faceTracker == null) return;

  25:     var frame = _faceTracker.Track(colorImageFormat, colorImage, depthImageFormat, depthImage, skeletonOfInterest);

  26:     LastFaceTrackSucceeded = frame.TrackSuccessful;

  27:     if (!LastFaceTrackSucceeded) return;

  28:     if (_faceTriangles == null)

  29:     {

  30:         _faceTriangles = frame.GetTriangles();

  31:     }

  32:     _facePoints = frame.GetProjected3DShape();

  33: }

7. Esta clase posee otra función que es la que se encarga de dibujar la máscara sobre un canvas, donde están los puntos de la cara. Apartir de la colección de puntos, se crea un array de triángulos y se los pinta sobre un contexto de trabajo.

   1: public void DrawFaceModel(DrawingContext drawingContext)

   2: {

   3:     if (!LastFaceTrackSucceeded || _skeletonTrackingState != SkeletonTrackingState.Tracked)

   4:     {

   5:         _startFaceRecognition = DateTime.MinValue;

   6:         return;

   7:     }

   8:  

   9:     var faceModelPts = _facePoints.Select(t => new Point(t.X + 0.5f, t.Y + 0.5f)).ToList();

  10:  

  11:     var faceModel = _faceTriangles.Select(t => new FaceModelTriangle

  12:     {

  13:         P1 = faceModelPts[t.First],

  14:         P2 = faceModelPts[t.Second],

  15:         P3 = faceModelPts[t.Third]

  16:     }).ToList();

  17:  

  18:     var faceModelGroup = new GeometryGroup();

  19:     for (var i = 0; i < faceModel.Count; i++)

  20:     {

  21:         var faceTriangle = new GeometryGroup();

  22:         faceTriangle.Children.Add(new LineGeometry(faceModel[i].P1, faceModel[i].P2));

  23:         faceTriangle.Children.Add(new LineGeometry(faceModel[i].P2, faceModel[i].P3));

  24:         faceTriangle.Children.Add(new LineGeometry(faceModel[i].P3, faceModel[i].P1));

  25:         faceModelGroup.Children.Add(faceTriangle);

  26:     }

  27:  

  28:     drawingContext.DrawGeometry(Brushes.BlueViolet, new Pen(Brushes.Red, 1.0), faceModelGroup);

  29:     if (_startFaceRecognition == DateTime.MinValue)

  30:     {

  31:         _startFaceRecognition = DateTime.Now;

  32:     }

  33:     else

  34:     {

  35:         if (DateTime.Now.Subtract(_startFaceRecognition).TotalSeconds > 5)

  36:         {

  37:             Application.Current.Dispatcher.BeginInvoke(new Action(() =>

  38:             {

  39:                 System.Threading.Thread.Sleep(300);

  40:                 _startFaceRecognition = DateTime.MinValue;

  41:             }));

  42:         }

  43:     }

  44: }

8. Ahora pasamos al visor, que es el que “pinta” esto sobre una superficie [FaceTrackingViewer]. Dentro de la funcion [OnAllFramesReady] donde se procesan los datos del sensor Kinect, se identifica cada uno de los skeletons en un estado [SkeletonTrackingState.Tracked]. Una vez identificado, se crea una nueva instancia de la clase SkeletonFaceTracker y se ejecutan los pasos anteriores para identificar una cara/face. Cada instancia de SkeletonFaceTracker se almacena en una colección.

   1: foreach (Skeleton skeleton in this.skeletonData)

   2: {

   3:     if (skeleton.TrackingState == SkeletonTrackingState.Tracked

   4:         || skeleton.TrackingState == SkeletonTrackingState.PositionOnly)

   5:     {

   6:         if (!this.trackedSkeletons.ContainsKey(skeleton.TrackingId))

   7:         {

   8:             this.trackedSkeletons.Add(skeleton.TrackingId, new SkeletonFaceTracker() { });

   9:         }

  10:  

  11:         SkeletonFaceTracker skeletonFaceTracker;

  12:         if (this.trackedSkeletons.TryGetValue(skeleton.TrackingId, out skeletonFaceTracker))

  13:         {

  14:             if (this.Kinect != null)

  15:             {

  16:                 skeletonFaceTracker.OnFrameReady(this.Kinect, colorImageFormat, 

  17:                                     colorImage, depthImageFormat, depthImage, skeleton);

  18:                 skeletonFaceTracker.LastTrackedFrame = skeletonFrame.FrameNumber;

  19:             }

  20:         }

  21:     }

  22:  

  23: }

9. Finalmente en la función OnRender() del control, se “pinta” cada una de las caras.

   1: protected override void OnRender(DrawingContext drawingContext)

   2: {

   3:     base.OnRender(drawingContext);

   4:     foreach (var faceInformation in this.trackedSkeletons.Values)

   5:     {

   6:         faceInformation.DrawFaceModel(drawingContext);

   7:     }

   8: }

10. El ejemplo completo incluye un poco de código en la ventana principal para detectar el sensor kinect y trabajar con el mismo. Y otro par de detalles que comentaré en un next post.

El ejemplo se puede descargar desde http://sdrv.ms/MZY0Eq

 

Saludos @ La Finca

El Bruno

image image image

[#VS2012] Excellent set of training for Visual Studio 2012 and Team Foundation Server 2012

image

Buenas,

today thanks to David (compi Avanade) I gave a lap by the site Team Foundation service and I was surprised with the detail and simplicity of training materials presented there.

For example, in the section Getting Started with Visual Studio , we can see how to connect to TFS, such as upload code, create a build, etc. in a very simple manner.

image

In addition to the METRO style that appears up in the soup on MSDN, here we can see the contents in the format that I like to my: step by step. The contents of by now are in English, but are quite complete.

The complete index is as follows:

Getting Started with Visual Studio

Visual Studio connect to TFS

Setup to Build in Visual Studio

Microsoft Test Manager connect to TFS

Invite Team Members to your Project

 

Saludos @ Home

El Bruno

image image image

[#VS2012] Excelente set de training para Visual Studio 2012 y Team Foundation Server 2012

image

Buenas,

hoy gracias a David (compi de Avanade) me dí una vuelta por el site de Team Foundation Service y me quedé sorprendido con el detalle y simplicidad de los materiales de formación que se presentan allí.

Por ejemplo, en la sección Getting Started with Visual Studio, podemos ver como conectarnos a TFS, como subir código, crear una build, etc. de una forma muy simple.

image

Además del estilo METRO que aparece hasta en la sopa en MSDN, aquí también podemos ver los contenidos en el formato que más me gusta a mi: step by step. Los contenidos de por ahora estan en inglés, pero son bastante completos.

El índice completo es el siguiente:

Getting Started with Visual Studio

Connect Visual Studio to TFS

Setup a Build in Visual Studio

Connect Microsoft Test Manager to TFS

Invite Team Members to your Project

Saludos @ Home

El Bruno

image image image

[#KINECT] HowTo: Change the camera angle

image

Hi,

in today’s post we will move the angle of the sensor up or down using the SDK APIs.

It is initially possible to move the camera up or down a twenty-seventh, and to try them we will from the example of yesterday.

image

1 We modify our application to allow us to define the angle of inclination of the Kinect using a text box and a button.

2. The Xaml is as the following example

   1: <Window x:Class="ElBruno.KinectViewer.MainWindow"
   2:         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
   3:         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
   4:         Title="El Bruno - Kinect Viewer" Height="480" Width="740">
   5:     <Grid>
   6:         <Grid.RowDefinitions>
   7:             <RowDefinition Height="40"></RowDefinition>
   8:             <RowDefinition Height="*"></RowDefinition>
   9:             <RowDefinition Height="40"></RowDefinition>
  10:         </Grid.RowDefinitions>
  11:         <TextBlock Text="Camera Viewer" FontSize="20" HorizontalAlignment="Center" 
  12:                    Foreground="Black" Grid.Row="0" />
  13:         <Image x:Name="CameraViewer" Margin="10,10,10,10" 
  14:                Stretch="Fill" Grid.Row="1" />
  15:         <StackPanel Orientation="Horizontal" HorizontalAlignment="Center" Grid.Row="2" >
  16:             <TextBox x:Name="txtAngle" Text="0" FontSize="20" HorizontalAlignment="Center" Foreground="Black" />
  17:             <Button x:Name="SetCameraAngle" Click="SetCameraAngle_Click" Content="Set Camera Angle" />
  18:         </StackPanel>
  19:     </Grid>
  20: </Window>

3. Then the implementation of the event click of the button is rather simple

   1: private void SetCameraAngleClick(object sender, RoutedEventArgs e)
   2: {
   3:     _kinect.NuiCamera.ElevationAngle = Convert.ToInt32(txtAngle.Text);
   4: }

Today I will not put the example to download because it is quite simple to modify. And tomorrow some Audio and Speech if the bird allow me.

Greetings @ Here

The Bruno

Reference: http://abhijitjana.net/2011/09/18/development-with-kinect-net-sdk-part-iii-adjusting-the-kinect-camera-angle/

[#KINECT] HowTo: Cambiar el ángulo de la cámara

image

Buenas,

en el post de hoy vamos a mover el ángulo del sensor hacia arriba o hacia abajo utilizando las APIs del SDK.

Inicialmente es posible mover la cámara hacia arriba o hacia abajo unos 27º, y para probarlos vamos a partir del ejemplo del día de ayer.

image

 

1. Modificamos nuestra aplicación para que nos permita definir el ángulo de inclinación del Kinect utilizando una caja de texto y un botón.

2. El Xaml queda como el siguiente ejemplo

   1: <Window x:Class="ElBruno.KinectViewer.MainWindow"

   2:         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

   3:         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

   4:         Title="El Bruno - Kinect Viewer" Height="480" Width="740">

   5:     <Grid>

   6:         <Grid.RowDefinitions>

   7:             <RowDefinition Height="40"></RowDefinition>

   8:             <RowDefinition Height="*"></RowDefinition>

   9:             <RowDefinition Height="40"></RowDefinition>

  10:         </Grid.RowDefinitions>

  11:         <TextBlock Text="Camera Viewer" FontSize="20" HorizontalAlignment="Center" 

  12:                    Foreground="Black" Grid.Row="0" />

  13:         <Image x:Name="CameraViewer" Margin="10,10,10,10" 

  14:                Stretch="Fill" Grid.Row="1" />

  15:         <StackPanel Orientation="Horizontal" HorizontalAlignment="Center" Grid.Row="2" >

  16:             <TextBox x:Name="txtAngle" Text="0" FontSize="20" HorizontalAlignment="Center" Foreground="Black" />

  17:             <Button x:Name="SetCameraAngle" Click="SetCameraAngle_Click" Content="Set Camera Angle" />

  18:         </StackPanel>

  19:     </Grid>

  20: </Window>

3. Luego la implementación del evento click del botón es más bien simple

   1: private void SetCameraAngleClick(object sender, RoutedEventArgs e)

   2: {

   3:     _kinect.NuiCamera.ElevationAngle = Convert.ToInt32(txtAngle.Text);

   4: }

Hoy no pondré el ejemplo para descargar ya que es bastante simple de modificar. Y para mañana algo de Audio y Speech si el AVE me lo permite.

 

Saludos @ Here

El Bruno

   

Referencia: http://abhijitjana.net/2011/09/18/development-with-kinect-net-sdk-part-iii-adjusting-the-kinect-camera-angle/

[# KINECT] HowTo: Display the contents of the camera in WPF

image

Hi,

After displaying as it paints the Skeleton in Kinect here and here, today we are going to a more simple example (in what should be) where we will show the contents of the Chamber about Kinect in a WPF IMAGE.

Tutorial

1. Create a new type WPF Application project in Visual Studio 2010.

2 Add the following references

  • Microsoft.research.Kinect
    < % Program Files % > \Microsoft SDKs\Kinect\v1.0 Beta2\Assemblies\Microsoft.Research.Kinect.dll

3 We modify the MainWindow to display a title and an Image where we’ll show you the contents of the Chamber

   1: <Window x:Class="ElBruno.KinectViewer.MainWindow"
   2:         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
   3:         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
   4:         Title="El Bruno - Kinect Viewer" Height="480" Width="740">
   5:     <Grid>
   6:         <TextBlock Text="Camera Viewer" FontSize="20" 
   7:                     HorizontalAlignment="Center" Foreground="Black" />
   8:         <Image x:Name="CameraViewer" Margin="10,40,10,10" Stretch="Fill" />
   9:     </Grid>
  10: </Window>

4. Then we initialized the runtime about Kinect (lines 17 to 26), taking into account that we will only use the feed from the camera (line 22). We we also subscribe to the VideoFrameReady() event, which is that will deliver us the information to process and display it in our Image (line 36).

   1: public partial class MainWindow
   2: {
   3:     private Runtime _kinect;
   4:     private InteropBitmapHelper _imageHelper;
   5:  
   6:     public MainWindow()
   7:     {
   8:         InitializeComponent();
   9:         Loaded += MainWindowLoaded;
  10:     }
  11:  
  12:     void MainWindowLoaded(object sender, RoutedEventArgs e)
  13:     {
  14:         InitKinect();
  15:     }
  16:  
  17:     void InitKinect()
  18:     {
  19:         if (Runtime.Kinects.Count == 0)
  20:             return;
  21:         _kinect = Runtime.Kinects[0];
  22:         _kinect.Initialize(RuntimeOptions.UseColor);
  23:         _kinect.VideoStream.Open(ImageStreamType.Video, 2, 
  24:                                  ImageResolution.Resolution640x480, ImageType.Color);
  25:         _kinect.VideoFrameReady += KinectVideoFrameReady;
  26:     }
  27:  
  28:     void KinectVideoFrameReady(object sender, ImageFrameReadyEventArgs e)
  29:     {
  30:         var planarImage = e.ImageFrame.Image;
  31:         if (_imageHelper == null)
  32:         {
  33:             _imageHelper = new InteropBitmapHelper(planarImage.Width, 
  34:                                                    planarImage.Height, 
  35:                                                    planarImage.Bits);
  36:             CameraViewer.Source = _imageHelper.InteropBitmap;
  37:         }
  38:         else
  39:         {
  40:             _imageHelper.UpdateBits(planarImage.Bits);
  41:         }   
  42:     }
  43: }

5. In this example I’m using a class distributed with the SDK Kinect, InteropBitmapHelper that helps us work more effectively with the pictures.

6. Once completed the project, you can now run the same and we can see the feed from the camera’s sensor Kinect

image

Note: I know, Tablet, HP TouchSmart, 2 laptops, etc. too for a Sunday… Confundido

You can download the example since

https://SkyDrive.live.com/embedicon.aspx/code%20Samples/2011%2011%2013%20ElBruno.KinectViewer.zip?CID=bef06dffdb192125 & sc = documents

Greetings @ Home

The Bruno

[#KINECT] HowTo: Mostrar el contenido de la cámara en WPF

image

Buenas,

después de mostrar como se pinta el Skeleton en Kinect aquí y aquí, hoy vamos a un ejemplo más simple (en lo que cabe) donde mostraremos el contenido de la cámara de Kinect en un IMAGE de WPF.

Tutorial

1. Crear un nuevo proyecto de tipo WPF Application en Visual Studio 2010.

2. Agregamos las siguientes referencias

  • Microsoft.Research.Kinect
    <%Program Files%>\Microsoft SDKs\Kinect\v1.0 Beta2\Assemblies\Microsoft.Research.Kinect.dll

3. Modificamos la MainWindow para mostrar un título y un Image donde mostraremos el contenido de la cámara

   1: <Window x:Class="ElBruno.KinectViewer.MainWindow"

   2:         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

   3:         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

   4:         Title="El Bruno - Kinect Viewer" Height="480" Width="740">

   5:     <Grid>

   6:         <TextBlock Text="Camera Viewer" FontSize="20" 

   7:                     HorizontalAlignment="Center" Foreground="Black" />

   8:         <Image x:Name="CameraViewer" Margin="10,40,10,10" Stretch="Fill" />

   9:     </Grid>

  10: </Window>

4. A continuación inicializamos el runtime de Kinect (líneas 17 a 26), teniendo en cuenta que solo utilizaremos el feed de la cámara (línea 22). Además nos suscribimos al evento VideoFrameReady() que es el que nos entregará la información para procesarla y mostrarla en nuestro Image (línea 36).

   1: public partial class MainWindow

   2: {

   3:     private Runtime _kinect;

   4:     private InteropBitmapHelper _imageHelper;

   5:  

   6:     public MainWindow()

   7:     {

   8:         InitializeComponent();

   9:         Loaded += MainWindowLoaded;

  10:     }

  11:  

  12:     void MainWindowLoaded(object sender, RoutedEventArgs e)

  13:     {

  14:         InitKinect();

  15:     }

  16:  

  17:     void InitKinect()

  18:     {

  19:         if (Runtime.Kinects.Count == 0)

  20:             return;

  21:         _kinect = Runtime.Kinects[0];

  22:         _kinect.Initialize(RuntimeOptions.UseColor);

  23:         _kinect.VideoStream.Open(ImageStreamType.Video, 2, 

  24:                                  ImageResolution.Resolution640x480, ImageType.Color);

  25:         _kinect.VideoFrameReady += KinectVideoFrameReady;

  26:     }

  27:  

  28:     void KinectVideoFrameReady(object sender, ImageFrameReadyEventArgs e)

  29:     {

  30:         var planarImage = e.ImageFrame.Image;

  31:         if (_imageHelper == null)

  32:         {

  33:             _imageHelper = new InteropBitmapHelper(planarImage.Width, 

  34:                                                    planarImage.Height, 

  35:                                                    planarImage.Bits);

  36:             CameraViewer.Source = _imageHelper.InteropBitmap;

  37:         }

  38:         else

  39:         {

  40:             _imageHelper.UpdateBits(planarImage.Bits);

  41:         }   

  42:     }

  43: }

5. En este ejemplo estoy utilizando una clase distribuida con el SDK de Kinect, InteropBitmapHelper que nos ayuda a trabajar de una forma más efectiva con las imágenes.

6. Una vez terminado el proyecto, ya podemos ejecutar el mismo y podremos ver el feed de la cámara del sensor Kinect

image

Nota: ya lo sé, la tableta, un HP TouchSmart, 2 portátiles, etc. demasiado para un domingo … Confundido

Puedes descargar el ejemplo desde

https://skydrive.live.com/embedicon.aspx/Code%20Samples/2011%2011%2013%20ElBruno.KinectViewer.zip?cid=bef06dffdb192125&sc=documents

 

Saludos @ Home

El Bruno

   

[#KINECT] HowTo: Draw the Kinect skeleton in WPF

image

Hi,

Today plays close on Friday with a tutorial on the interesting > how to paint a skeleton in WPF using the 2 Kinect Beta for Windows SDK. The basis of a skeleton in Kinect is a collection of Joints that then we can "assemble the skeleton". It is also possible to assemble and paint more than one skeleton, for this example, because we only paint skeleton [0] in yellow.

Tutorial

1. Create a new type WPF Application project in Visual Studio 2010.

2 Add the following references

  • Microsoft.research.Kinect
    < % Program Files % > \Microsoft SDKs\Kinect\v1.0 Beta2\Assemblies\Microsoft.Research.Kinect.dll

3 We modify the MainWindow to display a title and a Canvas where we’ll show you the skeleton

   1: <Window x:Class="ElBruno.KinectSkeleton01.MainWindow"
   2:         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
   3:         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
   4:         Title="MainWindow" Height="480" Width="360">
   5:     <Grid>
   6:         <TextBlock Text="El Bruno - Skeleton Viewer" 
   7:                    FontSize="20" HorizontalAlignment="Center" />
   8:         <Canvas x:Name="Skeleton" Margin="10,40,10,10" 
   9:                 Background="Black" />
  10:     </Grid>
  11: </Window>

The window is similar to the following

image

4 Add a handler for the event Load() for the Window. We also added a runtime to work against the Kinect and initialize it with the basic options of work.

   1: private Runtime _kinect;
   2:  
   3: public MainWindow()
   4: {
   5:     InitializeComponent();
   6:     Loaded += MainWindowLoaded;
   7: }
   8:  
   9: void MainWindowLoaded(object sender, RoutedEventArgs e)
  10: {
  11:     InitKinect();
  12: }
  13:  
  14: void InitKinect()
  15: {
  16:     if (Runtime.Kinects.Count == 0)
  17:         return;
  18:  
  19:     _kinect = Runtime.Kinects[0];
  20:     _kinect.Initialize(RuntimeOptions.UseDepthAndPlayerIndex | 
  21:       RuntimeOptions.UseSkeletalTracking | RuntimeOptions.UseColor);
  22:  
  23:         _kinect.VideoStream.Open(ImageStreamType.Video, 2, 
  24:                 ImageResolution.Resolution640x480, ImageType.Color);
  25:         _kinect.DepthStream.Open(ImageStreamType.Depth, 2, 
  26:                 ImageResolution.Resolution320x240, ImageType.DepthAndPlayerIndex);
  27:     _kinect.SkeletonFrameReady += KinectSkeletonFrameReady;
  28: }

In this example I have not put any kind of exception handling, working with a Beta we should add something later.

5. Below we can only paint our skeleton in Kinect. For this we will use the collection of Joints that returns us the Runtime and in the event KinectSkeletonFrameReady brush the Joints and Bones that unite them.

   1: void KinectSkeletonFrameReady(object sender, SkeletonFrameReadyEventArgs e)
   2: {
   3:     foreach (var skeleton in 
   4:              e.SkeletonFrame.Skeletons.Where
   5:             (skeleton => 
   6:                       SkeletonTrackingState.Tracked == skeleton.TrackingState))
   7:     {
   8:         Skeleton.Children.Clear();
   9:         PaintBones(skeleton);
  10:         PaintJoints(skeleton);
  11:     }
  12: }

6. Course for this to work the previous routine requires implementation of PaintJoins and PaintBones. As you can see in the following code fragment, it is quite simple because only run through the collections and paints from them.

   1: private void PaintJoints(SkeletonData skeleton)
   2: {
   3:     foreach (Joint joint in skeleton.Joints)
   4:     {
   5:         var jointPos = _kinectCanvas.GetDisplayPosition(joint);
   6:         var jointLine = new Line
   7:                             {
   8:                                 X1 = jointPos.X - 3
   9:                             };
  10:         jointLine.X2 = jointLine.X1 + 6;
  11:         jointLine.Y1 = jointLine.Y2 = jointPos.Y;
  12:         jointLine.Stroke = KinectCanvas.JointColors[joint.ID];
  13:         jointLine.StrokeThickness = 6;
  14:         Skeleton.Children.Add(jointLine);
  15:     }
  16: }
  17:  
  18: private void PaintBones(SkeletonData skeleton)
  19: {
  20:     var brush = new SolidColorBrush(Colors.Yellow);
  21:     Skeleton.Children.Add(_kinectCanvas.GetBodySegment
  22:         (skeleton.Joints, brush, JointID.HipCenter, 
  23:         JointID.Spine, JointID.ShoulderCenter, JointID.Head));
  24:     Skeleton.Children.Add(_kinectCanvas.GetBodySegment
  25:         (skeleton.Joints, brush, JointID.ShoulderCenter, 
  26:         JointID.ShoulderLeft, JointID.ElbowLeft, JointID.WristLeft, JointID.HandLeft));
  27:     Skeleton.Children.Add(_kinectCanvas.GetBodySegment
  28:         (skeleton.Joints, brush, JointID.ShoulderCenter,
  29:         JointID.ShoulderRight, JointID.ElbowRight, JointID.WristRight, JointID.HandRight));
  30:     Skeleton.Children.Add(_kinectCanvas.GetBodySegment
  31:         (skeleton.Joints, brush, JointID.HipCenter, JointID.HipLeft,
  32:         JointID.KneeLeft, JointID.AnkleLeft, JointID.FootLeft));
  33:     Skeleton.Children.Add(_kinectCanvas.GetBodySegment
  34:         (skeleton.Joints, brush, JointID.HipCenter, JointID.HipRight,
  35:         JointID.KneeRight, JointID.AnkleRight, JointID.FootRight));
  36: }

In the full example you can see the KinectCanvas() class which is you own definitions to convert points joints and bones in lines.

7. If we run the application and are quick to take a screenshot can something similar to

image

The complete example can be downloaded from

https://SkyDrive.live.com/embedicon.aspx/code%20Samples/2011%2011%2011%20-%20Kinect%20Skeleton%2001.zip?CID=bef06dffdb192125 & sc = documents

Greetings @ Here

The Bruno