We Keep Coding

How to WritePixels (array of ushort[]) to WritableBitmap BGR32

I'm working with WriteableBitmap (PixelFormats.Bgr32).
This is the format I need to save for the rest of the program to work.
Writable = new WriteableBitmap(inImage.XSize, inImage.YSize, dpi, dpi, PixelFormats.Bgr32, null);
The image from the device comes in grayscaled, (ushort[] Gray16).
To use this image in my program I use the following code (inImage - received image, ImageData = ushort[]):
int[] pixels = Array.ConvertAll(inImage.ImageData, val => checked((int)val));
Writable.WritePixels(new Int32Rect(0, 0, width, height), pixels, width * 4, 0);
If I just use
Writable.WritePixels(new Int32Rect(0, 0, width, height), inImage.ImageData, width * 4, 0);
I get a message about insufficient buffer size. (System.ArgumentException: "Buffer size is not sufficient."
)
Code
int[] pixels = Array.ConvertAll(inImage.ImageData, val => checked((int)val))
or
int[] pixels = new int[inImage.XSize * inImage.YSize];
for (int i = 0; i < inImage.ImageData.Length; i++)
{
pixels[i] = inImage.ImageData[i];
}
This seems to me to be a very long and slow and unoptimized process.
Is there any way to optimize the process and immediately write ushort[] array to WriteableBitmap (Bgr32) without converting it to int[] ?
EDIT***
I need this code to be able to work with images with a resolution of 4300x4300 with 45 FPS.
Below is the full code how I load images (this code is called 45 times per second to load a new image)
public class ImageStruct
{
public ushort[] ImageData;
public int XSize;
public int YSize;
public int XDpi;
public int YDpi;
}
WriteableBitmap Writeable;
public void LoadFrame(ImageStruct inImage)
{
var width = inImage.XSize;
var height = inImage.YSize;
var destBpp = PixelFormats.Bgr32.BitsPerPixel / 8;
var uPixels = inImage.ImageData;
fluoroWritable = new WriteableBitmap(inImage.XSize, inImage.YSize, 96, 96, PixelFormats.Bgr32, null);
var iPixels = Array.ConvertAll(uPixels, val => checked((int)val));
fluoroWritable.WritePixels(new Int32Rect(0, 0, width, height), iPixels, width * 4, 0);
}
This code works well when FPS is ~10,
If you increase the FPS, it starts to freeze. Profiling shows that it is the moment when I make from ushort[] => int[] takes the longest time.
I tried to use the code suggested in the answer below:
unsafe public void LoadFrameWithLock(ImageStruct inImage)
{
var width = inImage.XSize;
var height = inImage.YSize;
var destBpp = PixelFormats.Bgr32.BitsPerPixel / 8;
var uPixels = inImage.ImageData;
fluoroWritable = new WriteableBitmap(inImage.XSize, inImage.YSize, 96, 96, PixelFormats.Bgr32, null);
fluoroWritable.Lock();
int* outputIntValues = (int*)fluoroWritable.BackBuffer;
ushort[] inputShortValues = inImage.ImageData;
for (int i = 0; i < inputShortValues.Length; i++)
{
byte as8bpp = (byte)(inputShortValues[i] >> 8);
outputIntValues[i] = /*B*/ as8bpp | /*G*/ (as8bpp << 8) | /*R*/ (as8bpp << 16);
}
fluoroWritable.AddDirtyRect(new Int32Rect(0, 0, fluoroWritable.PixelWidth, fluoroWritable.PixelHeight));
fluoroWritable.Unlock();
}
But the FPS with this code is even lower and in addition the WPF application has a completely hanging interface. and images have no grayscale, but are completely black and white (white or black pixels).
I need the BGR32 format because this WritableBitmap (WPF Image object) is then overlaid with shader effects, and I can also get color images in another place.

Is there any way to optimize the process and immediately write ushort[] array to WriteableBitmap (Bgr32) without converting it to int[] ?
Yes, instead of calling WritePixels use the Lock method so the BackBuffer will be available as a naked pointer (do not forget to call Unlock when you are finished).
Please note though that as your source and target pixel formats are different (16bpp grayscale vs. 32bpp BGRx) simple casting of short values to int will not be correct. All 16 bit grayscale values must be converted to 8 bit RGB values:
// the result as you defined in OP
Writable = new WriteableBitmap(inImage.XSize, inImage.YSize, dpi, dpi, PixelFormats.Bgr32, null);
// you must be in an unsafe scope to use pointers
int* outputIntValues = (int*)Writable.BackBuffer;
short[] inputShortValues = inImage.ImageData;
// converting pixels to BGR32
for (int i = 0; i < inputShortValues.Length; i++)
{
// taking the most significant bits from the 16bpp gray values
byte as8bpp = (byte)(inputShortValues[i] >> 8);
outputIntValues[i] = /*B*/ as8bpp | /*G*/ (as8bpp << 8) | /*R*/ (as8bpp << 16);
}
// notifying the consumers that we edited the raw content
Writable.AddDirtyRect(new Int32Rect(0, 0, Writable.PixelWidth, Writable.PixelHeight));
// releasing the buffer
Writable.Unlock();
The sample above needs to be inside of an unsafe scope because of the pointer and you must enable unsafe blocks for your project in your .csproj file.
To make things simpler you can use my Drawing Libraries, which now has dedicated WPF support so the conversion will just be literally two lines. It does not need unsafe context and is actually faster than the example above because it uses parallel processing:
// Interpret your short[] as a grayscale bitmap
using var bmpGrayscale = BitmapDataFactory.CreateBitmapData(buffer: inImage.ImageData,
size: new Size(inImage.XSize, inImage.XSize),
stride: inImage.XSize * 2, // if input pixels are contiguous
KnownPixelFormat.Format16bppGrayScale));
// Convert it to a BGR32 WriteableBitmap (async overloads are available, too)
WriteableBitmap bmpResult = bmpGrayscale.ToWriteableBitmap(PixelFormats.Bgr32);

Image Manipulation c#

I have the following code which takes an array of bytes which i generated and writes them out to this bitmap. If i set the pixel format to Format4bppIndexed, then i get a readable image repeating width wise 4 times, if i set it to Format1bppIndexed(which is the correct setting) then i get one big unreadable image.
The image was a decoded Jbig2 image , i know the bytes are correct i can't seem to figure out how to get it into a 1bpp readable format.
Does anyone have any advice on that matter
Bitmap bitmap = new Bitmap(width, height, PixelFormat.Format1bppIndexed);
//Create a BitmapData and Lock all pixels to be written
BitmapData bmpData = bitmap.LockBits(
new Rectangle(0, 0, bitmap.Width, bitmap.Height),
ImageLockMode.WriteOnly, bitmap.PixelFormat);
//Copy the data from the byte array into BitmapData.Scan0
Marshal.Copy(newarray, 0, bmpData.Scan0, newarray.Length);
//Unlock the pixels
bitmap.UnlockBits(bmpData);

The following may work although, if I remember correctly, Stride sometimes has an effect and a simple block-copy won't suffice (line by line must be used instead).
Bitmap bitmap = new Bitmap(
width,
height,
System.Drawing.PixelFormat.Format16bppGrayScale
);
To handle the Stride you'd want:
BitmapData^ data = bitmap->LockBits(oSize,
ImageLockMode::ReadOnly, bitmap->PixelFormat);
try {
unsigned char *pData = (unsigned char *)data->Scan0.ToPointer();
for( int x = 0; x < bmpImage->Width; ++x )
{
for( int y = 0; y < bmpImage->Height; ++y )
{
// Note: Stride is data width of scan line rounded up
// to 4 byte boundary.
// Requires use of Stride, not (width * pixelWidth)
int ps = y*bmpImage->Width*(nBitsPerPixel / 8)
+ x * (nBitsPerPixel / 8);
int p = y * data->Stride + x * (nBitsPerPixel / 8);
Byte lo = newarray[ps + 1];
Byte hi = newarray[ps + 0];
pData[p + 1] = lo;
pData[p + 0] = hi;
}
}
} finally {
bmpImage->UnlockBits(data);
}
Note: This was written in C++/CLI. Let me know if you need C# equivalents for any of the operations here. (Also, I pulled it from a read from bitmap rather than a write to bitmap so it may yet be a bit rough, but should hopefully give you the idea...)

I figured this out Although i'm still not sure why it should matter.
Based on this stackoverflow posting How can I load the raw data of a 48bpp image into a Bitmap?
I used the WPF classes instead of the GDI and wrote the code like this
var bitmap = new WriteableBitmap(width, height, 96, 96, System.Windows.Media.PixelFormats.BlackWhite, null);
bitmap.WritePixels(new System.Windows.Int32Rect(0, 0, width, height), newarray, stride, 0);
MemoryStream stream3 = new MemoryStream();
var encoder = new TiffBitmapEncoder ();
encoder.Frames.Add(BitmapFrame.Create(bitmap));
encoder.Save(stream3);
This correctly creates the image.
If anyone has any insight into why this might be the case please comment below
The port which now mostly works(lots of cleanup code) was based on a java implementation of JPedal Big2 Decoder to .NET. If anyone knows anyone interested send them here
https://github.com/devteamexpress/JBig2Decoder.NET

C# wrong color preview image

Im new in building apps with C#. Im working with images and doing some analysis with them. After clicking on image i get RGB value of current pixel. All values are next stored in listview with preview image. And there is my problem. The preview image is not the same, as RGB value of the current pixel. If i did this same with pictureboxes, then the colors were correct. But i dont know how to implement pictureboxes into listView or listBox.
There is my source code, which create bitmap for my color preview .
private Image createImage(Color col)
{
PixelFormat px_format = PixelFormat.Format32bppRgb;
int pixelFormatSize = Image.GetPixelFormatSize(px_format) / 8;
int stride = 16 * pixelFormatSize;
int padding = (stride % 4);
stride += padding == 0 ? 0 : 4 - padding; //pad out to multiple of 4
SharedPinnedByteArray byteArray = new SharedPinnedByteArray(stride * 16);
Bitmap bmp = new Bitmap(16, 16, stride, px_format, byteArray.bitPtr);
Graphics gpx = Graphics.FromImage(bmp);
SolidBrush brush = new SolidBrush(col);
gpx.FillRectangle(brush, 0, 0, 16, 16);
gpx.Dispose();
return bmp;
}
And here is how im calling function and adding items to listView
listView1.SmallImageList.Images.Add(createImage(color));
listView1.Items.Add(color.R.ToString() + "," + color.G.ToString() + "," + color.B.ToString() + ",", listView1.SmallImageList.Images.Count - 1);
Best regards
Gabriel

Since the default list view color depth is 8 bit, you need to change it to 24 or 32 bit:
listView1.SmallImageList.ColorDepth = ColorDepth.Depth24Bit;

Pixel Manipulation in CGBitmapContext depend on the view's superview?

I came across something really strange with while manipulating pixels using CGBitmapContext. Basically I'm changing the Alpha values of PNGs. I have an example where I can successfully Zero the Alpha value of a PNGs pixel EXCEPT when my ImageView's superview is an ImageView with an image… Why this is? I'm not sure if it's a bug or if something in the Context is set up incorrectly.
Below is an example. It zeros' alpha values successfully, but when you give the superview's UIImageView an Image, it doesn't work right. The pixels that should have an Alpha of zero are slightly visible. But when you remove the image from the superview's UIImageView the Alpha values are zeroed correctly, you see the white background behind it perfectly. I've tried using several different CGBlendModes but that doesn't seem to do it.
Here is a dropbox link to an example project demonstrating this strange event:
https://www.dropbox.com/s/e93hzxl5ru5wnss/TestAlpha.zip
And here is the code copy/pasted:
// Create a Background ImageView
UIImageView Background = new UIImageView(this.View.Bounds);
// Comment out the below line to see the Pixels alpha values change correctly, UnComment the below line to see the pixel's alpha values change incorrectly. Why is this?
// When Commented out, The pixels whose alpha value I set to zero become transparent and I can see the white background through the image.
// When Commented in, I SHOULD see the "GrayPattern.png" Image through the transparent pixels. I can kind of see it, but for some reason I still see the dirt pixels who's alpha is set to zero! Is this a bug? Is the CGBitmapContext set up incorrectly?
Background.Image = UIImage.FromFile("GrayPattern.png");
this.View.AddSubview(Background);
UIImageView MyImageView = new UIImageView(UIScreen.MainScreen.Bounds);
UIImage sourceImage = UIImage.FromFile("Dirt.png");
MyImageView.Image = sourceImage;
Background.AddSubview(MyImageView);
CGImage image = MyImageView.Image.CGImage;
Console.WriteLine(image.AlphaInfo);
int width = image.Width;
int height = image.Height;
CGColorSpace colorSpace = CGColorSpace.CreateDeviceRGB();
int bytesPerRow = image.BytesPerRow;
int bytesPerPixel = bytesPerRow / width;
int bitmapByteCount = bytesPerRow * height;
int bitsPerComponent = image.BitsPerComponent;
CGImageAlphaInfo alphaInfo = CGImageAlphaInfo.PremultipliedLast;
// Allocate memory because the BitmapData is unmanaged
IntPtr BitmapData = Marshal.AllocHGlobal(bitmapByteCount);
CGBitmapContext context = new CGBitmapContext(BitmapData, width, height, bitsPerComponent, bytesPerRow, colorSpace, alphaInfo);
context.SetBlendMode(CGBlendMode.Copy);
context.DrawImage(new RectangleF(0, 0, width, height), image);
UIImageView MyImageView_brush = new UIImageView(new RectangleF(0, 0, 100, 100));
UIImage sourceImage_brush = UIImage.FromFile("BB_Brush_Rect_MoreFeather.png");
MyImageView_brush.Image = sourceImage_brush;
MyImageView_brush.Hidden = true;
Background.AddSubview(MyImageView_brush);
CGImage image_brush = sourceImage_brush.CGImage;
Console.WriteLine(image_brush.AlphaInfo);
int width_brush = image_brush.Width;
int height_brush = image_brush.Height;
CGColorSpace colorSpace_brush = CGColorSpace.CreateDeviceRGB();
int bytesPerRow_brush = image_brush.BytesPerRow;
int bytesPerPixel_brush = bytesPerRow_brush / width_brush;
int bitmapByteCount_brush = bytesPerRow_brush * height_brush;
int bitsPerComponent_brush = image_brush.BitsPerComponent;
CGImageAlphaInfo alphaInfo_brush = CGImageAlphaInfo.PremultipliedLast;
// Allocate memory because the BitmapData is unmanaged
IntPtr BitmapData_brush = Marshal.AllocHGlobal(bitmapByteCount_brush);
CGBitmapContext context_brush = new CGBitmapContext(BitmapData_brush, width_brush, height_brush, bitsPerComponent_brush, bytesPerRow_brush, colorSpace_brush, alphaInfo_brush);
context_brush.SetBlendMode(CGBlendMode.Copy);
context_brush.DrawImage(new RectangleF(0, 0, width_brush, height_brush), image_brush);
for ( int x = 0; x < width_brush; x++ )
{
for ( int y = 0; y < height_brush; y++ )
{
int byteIndex_brush = (bytesPerRow_brush * y) + x * bytesPerPixel_brush;
byte alpha_brush = GetByte(byteIndex_brush+3, BitmapData_brush);
// Console.WriteLine("alpha_brush = " + alpha_brush);
byte setValue = (byte)(255 - alpha_brush);
// Console.WriteLine("setValue = " + setValue);
int byteIndex = (bytesPerRow * y) + x * bytesPerPixel;
SetByte(byteIndex+3, BitmapData, setValue);
}
}
// Set the MyImageView Image equal to the context image, but I still see all top image, I dont' see any bottom image showing through.
MyImageView.Image = UIImage.FromImage (context.ToImage());
context.Dispose();
context_brush.Dispose();
// Free memory used by the BitmapData now that we're finished
Marshal.FreeHGlobal(BitmapData);
Marshal.FreeHGlobal(BitmapData_brush);
public unsafe byte GetByte(int offset, IntPtr buffer)
{
byte* bufferAsBytes = (byte*) buffer;
return bufferAsBytes[offset];
}
public unsafe void SetByte(int offset, IntPtr buffer, byte setValue)
{
byte* bufferAsBytes = (byte*) buffer;
bufferAsBytes[offset] = setValue;
}
Update I've found a workaround (though its performance is pretty unacceptable for what I"m doing) The workaround is simply taking the result image of from my above code, convert it to NSData, then convert the NSData back to a UIIMage... Magically the image looks correct! This workaround; however, is not acceptable for what I'm doing because it literally takes 2 seconds to do this with my Image and that is way too long for my App. A couple hundred ms would be fun, but 2 seconds is way to long for me. If this is a bug hopefully it gets resolved!
Here is the workaround (poor performance) code. Just add this code to the end of the code above (or download my dropbox project and add this code to the end of it and run):
NSData test = new NSData();
test = MyImageView.Image.AsPNG();
UIImage workAroundImage = UIImage.LoadFromData(test);
MyImageView.Image = workAroundImage;
Here are before and after pictures. Before is without the workaround, After includes the workaround.
Notice the Gray doens't show up completely. It's covered in some light brown as if the alpha value isn't full zeroed.
Notice with the workaround you can see the gray perfectly and clearly, no light brown over it at all. The only thing I did was Convert the image to NSData, then back to UIImage again! Very strange...

Calculating the required buffer size for the WriteableBitmap.WritePixels method

How do I calculate the required buffer size for the WriteableBitmap.WritePixels method?
I am using the overload taking four parameters, the first is an Int32Rect, the next is a byte array containing the RGBA numbers for the colour, the third is the stride (which is the width of my writeable bitmap multiplied by the bits per pixel divided by 8), and the last is the buffer (referred to as the offset in Intellisense).
I am getting the Buffer size is not sufficient runtime error in the below code:
byte[] colourData = { 0, 0, 0, 0 };
var xCoordinate = 1;
var yCoordinate = 1;
var width = 2;
var height = 2;
var rect = new Int32Rect(xCoordinate, yCoordinate, width, height);
var writeableBitmap = new WriteableBitmap(MyImage.Source as BitmapSource);
var stride = width*writeableBitmap.Format.BitsPerPixel/8;
writeableBitmap.WritePixels(rect, colourData, stride,0);
What is the formula I need to use to calculate the buffer value needed in the above code?

The stride value is calculated as the number of bytes per "pixel line" in the write rectangle:
var stride = (rect.Width * bitmap.Format.BitsPerPixel + 7) / 8;
The required buffer size is the number of bytes per line multiplied by the number of lines:
var bufferSize = rect.Height * stride;
Provided that you have a 2x2 write rectangle and a 32-bits-per-pixel format, e.g. PixelFormats.Pbgra32, you get stride as 8 and bufferSize as 16.

The stride is simply the width in bytes of your input buffer. It is called stride, because sometimes there is extra memory behind each line of an image, which makes it impossible to use the width of the image to read each line of an image.
So in your example, this is 2. You do not need to calculate anything with the bits per pixel of the bitmap, the WritePixels method knows all this information. You need to provide the information about how your input data is structured.
However, as mentioned in the other answer, your example won't work if the bitmap is also 2x2. Then the starting coordinate would be 0,0.
EDIT:
When I look closer at your example, I see the mistake. You say the colourData is the input color. But this is input per pixel. So if you want to change a rect of 2x2, you need the following inputdata:
byte[] colourData = { 0, 0, 0, 0, 0, 0, 0, 0,
0, 0, 0, 0, 0, 0, 0, 0 };
And then the bytes per pixel is equal to that of the bitmap, so that is 4, times the width of each line (2), makes total 8.

Here's Microsoft's reflected code that performs the check within CopyPixels
int num = ((sourceRect.Width * this.Format.BitsPerPixel) + 7) / 8;
if (stride < num)
{
throw new ArgumentOutOfRangeException("stride", MS.Internal.PresentationCore.SR.Get("ParameterCannotBeLessThan", new object[] { num }));
}
int num2 = (stride * (sourceRect.Height - 1)) + num;
if (bufferSize < num2)
{
throw new ArgumentOutOfRangeException("buffer", MS.Internal.PresentationCore.SR.Get("ParameterCannotBeLessThan", new object[] { num2 }));
}

Although user Clemens answered the question concerning the buffer size, the questioner was not aware that he calculated the buffer size already correct and the problem was somewhere else.
While details are given and discussed in comments there is lacking one comprehensive snippet (and complete usage example of .WritePixels (without .CopyPixels) as well).
Here it is (I scanned similar questions, but this has been the best place):
var dpiX = 96;
var writeableBitmap = new WriteableBitmap(width, height, dpiX, dpiX, PixelFormats.Bgra32, null); // Pixelformat of Bgra32 results always in 4 bytes per pixel
int bytesPerPixel = (writeableBitmap.Format.BitsPerPixel + 7) / 8; // general formula
int stride = bytesPerPixel * width; // general formula valid for all PixelFormats
byte[] pixelByteArrayOfColors = new byte[stride * height]; // General calculation of buffer size
// The numbers in the array are indices to the used BitmapPalette,
// since we initialized it with null in the writeableBitmap init, they refer directly to RGBA, but only in this case.
// Choose a light green color for whole bitmap (for not easy to find commented MSDN example with random colors, see https://msdn.microsoft.com/en-us/library/system.windows.media.imaging.writeablebitmap(VS.85).aspx
for (int pixel = 0; pixel < pixelByteArrayOfColors.Length; pixel += bytesPerPixel)
{
pixelByteArrayOfColors[pixel] = 0; // blue (depends normally on BitmapPalette)
pixelByteArrayOfColors[pixel + 1] = 255; // green (depends normally on BitmapPalette)
pixelByteArrayOfColors[pixel + 2] = 0; // red (depends normally on BitmapPalette)
pixelByteArrayOfColors[pixel + 3] = 50; // alpha (depends normally on BitmapPalette)
}
writeableBitmap.WritePixels(new Int32Rect(0, 0, width, height), pixelByteArrayOfColors, stride, 0);

I am work with this.
60z fs
this.playerOpacityMaskImage.WritePixels(
new Int32Rect(0, 0, this.depthWidth, this.depthHeight),
this.greenScreenPixelData,
this.depthWidth * ((this.playerOpacityMaskImage.Format.BitsPerPixel + 7) / 8),
0);

I am not sure but try this works for 24 bit rgb
{
//your code
var stride = width * 3;
WriteableBitmap bmp = new WriteableBitmap(width, height, 96, 96, PixelFormats.Bgr24, null);
bmp.WritePixels(new System.Windows.Int32Rect(0, 0, width , height),byte[],stride,0));
}