rendering bitmap using Android ANativeWindow

Question

I'm experiencing an issue where the bitmap isn't rendered properly on the surfaceview. the rendering is done in the native layer using ANativeWindow. to confirm the image I receive from the camera is good I have dumped the buffer on the filesystem and it looks good, but when trying to render it it is shown like the image below.

here is how I attempt to copy the bitmap to the ANativeWindow.

    static int counter = 0;
    std::string name =  "/sdcard/irImage" + std::to_string(counter++) + ".png";
    stbi_write_png(name.c_str(), WIDTH, HEIGHT, 4, mFormattedIRBuffer, WIDTH*4);

    ANativeWindow_Buffer buffer;
    if (_window)
    {
        if (ANativeWindow_lock(_window, &buffer, NULL) == 0)
        {
            memcpy(buffer.bits, mFormattedIRBuffer, WIDTH * HEIGHT * 4);
            ANativeWindow_unlockAndPost(_window);
        }
    }

when I try to render single colors (purple, yellow, pink) it displayed correctly on the surfaceview.

Any idea what I am missing here ?

UPDATE:

for some reason buffer.stride is differnt than buffer.width which i belive is causing the distortion on the surfaceview. the resolution i work with is 224x171 the stride appears to be 256. when working with higher resolution I don't have this problem. the stride is always the same as the width of the image.

Answer 1

to overcome this problem of buffer.width being not the same as buffer.stride I had to pad the width of the image to match the stride. I had width = 224 and stride = 256 so I used padding of 16 on left and 16 on right. I am not sure if this is a limitation of ANativeWindow when working with low resolution images, but when I work with high resolution the width and strides are always equal