NOTE: This is preliminary software and/or hardware and APIs are preliminary and subject to change.
In my previous blog post, I show you how to display the color, depth and infrared streams of Kinect version 2 by transforming the raw binary data into Windows bitmaps.
This time, we’ll dive into the most essential part of Kinect: Body tracking.
The initial version of Kinect allowed us to track up to 21 body joints. The second version allows up to 25 joints. The new joints include the fists and thumbs! Moreover, due to the enhanced depth sensor, the tracking accuracy has been significantly improved. Experienced users will notice less jittering and much better stability. Once again, I would like to remind you of my video, which demonstrates the new body tracking capabilities:
Watch the video on YouTube
Next, we are going to implement body tracking and display all of the new joints on-screen. We’ll extend the project we created previously. You can download the source code here.
Extending the project
In the previous blog post, we created a project with an <Image> element for displaying the streams. We now need to add a <Canvas> control for drawing the body. Here is the updated XAML code:
<Image Name="camera" />
<Canvas Name="canvas" />
We also added a reference to Microsoft.Kinect namespace and initialized the sensor:
_sensor = KinectSensor.Default;
if (_sensor != null)
We also added a list of bodies, where all of the body/skeleton related data will be saved. If you have developed for Kinect version 1, you notice that the Skeleton class has been replaced by the Body class.
Remember the MultiSourceFrameReader? This class gives us access on every stream, including the body stream! We simply need to let the sensor know that we need body tracking functionality by adding an additional parameter when initializing the reader:
_reader = _sensor.OpenMultiSourceFrameReader(FrameSourceTypes.Color |
_reader.MultiSourceFrameArrived += Reader_MultiSourceFrameArrived;
The Reader_MultiSourceFrameArrived method will be called whenever a new frame is available. Let’s specify what will happen in terms of the body data:
- Get a reference to the body frame
- Check whether the body frame is null – this is crucial
- Initialize the _bodies list
- Call the GetAndRefreshBodyData method, so as to copy the body data into the list
- Loop through the list of bodies and do awesome stuff!
Always remember to check for null values. Kinect provides you with approximately 30 frames per second – anything could be null or missing! Here is the code so far:
void Reader_MultiSourceFrameArrived(object sender, MultiSourceFrameArrivedEventArgs e)
var reference = e.FrameReference.AcquireFrame();
using (var frame = reference.BodyFrameReference.AcquireFrame())
if (frame != null)
_bodies = new Body[frame.BodyFrameSource.BodyCount];
foreach (var body in _bodies)
if (body != null)
This is it! We now have access to the bodies Kinect identifies. Next step is to display the skeleton information on-screen. Each body consists of 25 joints. The sensor provides us with the position (X, Y, Z) and the rotation information for each one of them. Moreover, Kinect lets us know whether the joints are tracked, hypothsized or not tracked. It’s a good practice to check whether a body is tracked before performing any critical functions. The following code illustrates how we can access the different body joints:
if (body != null)
Joint head = body.Joints[JointType.Head];
float x = head.Position.X;
float y = head.Position.Y;
float z = head.Position.Z;
The supported joints by Kinect 2 are the following:
Neck and thumbs are new joints added in the second version of Kinect.
Knowing the coordinates of every joint, we can now draw some objects using XAML and C#. However, Kinect provides a distance in millimetres, so we need to map the millimetres to screen pixels. In the attached project, I have made this mapping for you. So, the only method you need to call is the DrawPoint or the DrawLine. Here is the DrawPoint:
public static void DrawPoint(this Canvas canvas, Joint joint)
if (joint.TrackingState == TrackingState.NotTracked) return;
joint = joint.ScaleTo(canvas.ActualWidth, canvas.ActualHeight);
Ellipse ellipse = new Ellipse
Width = 20,
Height = 20,
Fill = new SolidColorBrush(Colors.LightBlue)
Canvas.SetLeft(ellipse, joint.Position.X - ellipse.Width / 2);
Canvas.SetTop(ellipse, joint.Position.Y - ellipse.Height / 2);
Similarly, you can draw lines using the Line object. Download the sample project and check by yourself.
Here is the end result you saw in the video:
Notice that the body joints are not perfectly aligned to the background image. Why? Because the color, infrared and depth sensors are not one above the other, so they have a slightly different point of view. You can use the coordinate mapper of the SDK and align them if necessary.
Download the source code
Body tracking was similarly done in the previous sensor. In the next blog post, we are going to see something totally new: facial expressions and hand states.
PS: New Kinect book - 20% off
This blog post is part of a new book I am publishing a new ebook in a few days. The book is an in-depth developer guide about Kinect, using simple language and step-by-step examples. You'll learn usability tips, performance tricks and best practices for implementing robust Kinect apps. Please meet Kinect Essentials, the essence of my 3 years of teaching, writing and developing for the Kinect platform. Oh, did I mention that you'll get a 20% discount if you simply subscribe now? Hurry up
Subscribe here for 20% off