title: Kinect V2 Color Stream Byte Order
body: <p>I'm working on an application which will stream the color, depth, and IR video data from the Kinect V2 sensor. Right now I'm just putting together the color video part of the app. I've read through some tutorials and actually got some video data coming into my app - the problem seems to be that the byte order seems to be in the wrong order which gives me an oddly discolored image (see below).</p>
  
  <p><img src="https://i.stack.imgur.com/gAMXU.jpg" alt="enter image description here"> </p>
  
  <p>So, let me explain how I got here.  In my code, I first open the sensor and also instantiate a new multi source frame reader.  After I've created the reader, I create an event handler called Reader_MultiSourceFrameArrived:</p>
  
  <pre><code>void Reader_MultiSourceFrameArrived(object sender, MultiSourceFrameArrivedEventArgs e)
      {
          if (proccessing || gotframe) return;
  
          // Get a reference to the multi-frame
          var reference = e.FrameReference.AcquireFrame();
  
          // Open color frame
          using (ColorFrame frame = reference.ColorFrameReference.AcquireFrame())
          {
              if (frame != null)
              {
                  proccessing = true;
                  var description = frame.ColorFrameSource.FrameDescription;
  
                  bw2 = description.Width / 2;
                  bh2 = description.Height / 2;
                  bpp = (int)description.BytesPerPixel;
  
                  if (imgBuffer == null)
                  {
                      imgBuffer = new byte[description.BytesPerPixel * description.Width * description.Height];
                  }
  
                  frame.CopyRawFrameDataToArray(imgBuffer);
                  gotframe = true;
                  proccessing = false;
              }
          }
      }
  </code></pre>
  
  <p>Now, every time a frame is received (and not processing) it should copy the frame data into an array called imgBuffer. When my application is ready I then call this routine to convert the array into a Windows Bitmap that I can display on my screen.</p>
  
  <pre><code>if (gotframe)
          {
              if (theBitmap.Rx != bw2 || theBitmap.Ry != bh2) theBitmap.SetSize(bw2, bh2);
  
              int kk = 0;
              for (int j = 0; j &lt; bh2; ++j)
              {
                  for (int i = 0; i &lt; bw2; ++i)
                  {
                      kk = (j * bw2 * 2 + i) * 2 * bpp;
                      theBitmap.pixels[i, bh2 - j - 1].B = imgBuffer[kk];
                      theBitmap.pixels[i, bh2 - j - 1].G = imgBuffer[kk + 1];
                      theBitmap.pixels[i, bh2 - j - 1].R = imgBuffer[kk + 2];
                      theBitmap.pixels[i, bh2 - j - 1].A = 255;
                  }
              }
              theBitmap.needupdate = true;
              gotframe = false;
          }
  }
  </code></pre>
  
  <p>So, after this runs theBitmap now contains the image information needed to draw the image on the screen... however, as seen in the image above - it looks quite strange.  The most obvious change is to simply change the order of the pixel B,G,R values when they get assigned to the bitmap in the double for loop (which I tried)... however, this simply results in other strange color images and none provide an accurate color image.  Any thoughts where I might be going wrong? </p>