SDK Version: 1.8
Usually Kinect applications are develop as stand alone applications. In this blog I'll describe how to develop web based application with Kinect.
In this post I'm going to create an MVC 4 application which show some basic Kinect Information.
KinectInfo Model
This model use to set and get the Kinect Information.
Define this class in the Model section in your ASP.Net MVC application.
public class KinectInfo
{
public string ConnectionId { get; set; }
public string UniqueDeviceId { get; set; }
public string Status { get; set; }
public bool ColourStream { get; set; }
public bool DepthStream { get; set; }
public bool SkeletonTracking { get; set; }
public int SensorAngle { get; set; }
}
We are going to create a model helper for set the values getting from the KinectSensor class in the Kinect SDK.
public KinectInfo SetKinectInfo(KinectSensor kinect)
{
KinectInfo _infoModel = new KinectInfo()
{
ConnectionId = kinect.DeviceConnectionId,
UniqueDeviceId = kinect.UniqueKinectId,
Status = kinect.Status.ToString(),
ColourStream = kinect.ColorStream.IsEnabled,
DepthStream = kinect.DepthStream.IsEnabled,
SkeletonTracking = kinect.SkeletonStream.IsEnabled,
SensorAngle = kinect.ElevationAngle
};
return _infoModel;
}
Controller class
This is the controller class of our MVC Application.
public class HomeController : Controller
{
private static KinectSensor kinect;
public ActionResult Index()
{
InitializeSensor();
return View();
}
private void InitializeSensor()
{
try
{
if (KinectSensor.KinectSensors.Count > 0)
{
kinect = KinectSensor.KinectSensors[0];
StartKinect();
kinect.DepthStream.Enable();
kinect.ColorStream.Enable();
kinect.SkeletonStream.Enable();
}
}
catch (Exception e)
{
ViewBag.Msg = string.Format("Error: {0}", e.ToString());
}
}
This method define to Initialize the Kinect sensor.
This assume only one Kinect is attached to your system.
kinect = KinectSensor.KinectSensors[0];
Then we enable the data streams that we want. (ex: skeleton stream to capture the body movements)
private ActionResult StartKinect()
{
if (kinect != null && !kinect.IsRunning)
{
kinect.Start();
ViewBag.Msg = "Kinect Started";
}
return View();
}
The above method allows to start the Kinect sensor.
If the kinect sensor is not started we can't use it functionality.
public ActionResult StopSensor()
{
if (kinect != null && kinect.IsRunning)
{
kinect.Stop();
ViewBag.Msg = "Kinect Stoped";
kinect = null;
}
return View();
}
The Kinect stop method allows to stop the kinect sensor when we done with the work and when we want to close the application.
public ActionResult ShowKinectInfo()
{
KinectInfoHelper helper = new KinectInfoHelper();
var infoModel = helper.SetKinectInfo(kinect);
return View(infoModel);
}
This action result use to get the Kinect infomation and pass it to the view.
}
ShowKinectInfo view
This is the front end for our application.
We bind the KinectInfo model with this view.
@model KinectWebMvc.Models.KinectInfo
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>ShowKinectInfo</title>
</head>
<body>
<div>
<table>
<tr>
<td>Connection Id: </td>
<td>@Html.DisplayTextFor(m => m.ConnectionId)</td>
</tr>
<tr>
<td>Unique Device Id: </td>
<td>@Html.DisplayTextFor(m => m.UniqueDeviceId)</td>
</tr>
<tr>
<td>Status: </td>
<td>@Html.DisplayTextFor(m => m.Status)</td>
</tr>
<tr>
<td>Colour Stream: </td>
<td><input type="checkbox" checked="@Html.CheckBoxFor(m => m.ColourStream)"/></td>
</tr>
<tr>
<td>Depth Stream: </td>
<td><input type="checkbox" checked="@Html.CheckBoxFor(m => m.DepthStream)"/></td>
</tr>
<tr>
<td>Skeleton Tracking: </td>
<td><input type="checkbox" checked="@Html.CheckBoxFor(m => m.SkeletonTracking)"/></td>
</tr>
<tr>
<td>Sensor Angle: </td>
<td>@Html.TextBoxFor(m => m.SensorAngle)</td>
</tr>
</table>
</div>
</body>
</html>
Now you are ready to go.
Run the application and have fun.
