Develop Reference

InteropBitmap collection to single Image

I'm using a list of InteropBitmap in order to display a set of image frames within Image control which is customized with a datatemplate.
What I'm lookin for is to export set of images in a single image, however what I get is a bad/partial image with wrong colors.
The following is the code snippet I'm using to convert set of InteropBitmap in a single image:
var firstInterop = this.InteropBitmapList[0]; // Get info from first frame, all other one are the same format.
int width = firstInterop .PixelWidth;
int height = firstInterop.PixelHeight;
int bpp = firstInterop Format.BitsPerPixel;
int stride = width * (bpp / 8);
int count = this.InteropBitmapList.Count;
byte[] buffer = new byte[stride * height * count];
for (int i = 0; i < count; i++)
{
var wb = this.InteropBitmapList[i];
wb.CopyPixels(buffer, stride, width * height * i);
}
Finally, I use buffer array to achieve my jpeg image through GDI+ or else wpf instruments. Unfortunately, both the way doesn't work as I expected.
Is there something to wrong in my code?
##EDIT
Well, thanks to Clemens answers, now I'm able to obtain a correct image, except only for its color (all colors are altered).
The issue is true only when I try to create an Image through GDI+, instead, if I use something of WPF susch as JpegBitmapEncoder all works fine.
The following code snippet allow me to achieve the right image:
byte[] buffer = MyFunc.GetBuffer();
// ...
var bitmap = System.Windows.Media.Imaging.BitmapSource.Create(width, height, 300, 300,
System.Windows.Media.PixelFormats.Rgb24, null, buffer, stride);
System.IO.FileStream stream = new System.IO.FileStream("example.jpg", System.IO.FileMode.Create);
JpegBitmapEncoder encoder = new JpegBitmapEncoder();
encoder.QualityLevel = 100;
encoder.Frames.Add(BitmapFrame.Create(bitmap));
encoder.Save(stream);
Instead, the following code return me an image with wrong colors (the red become blue and so on)
byte[] buffer = MyFunc.GetBuffer();
// ...
IntPtr unmanagedPointer = System.Runtime.InteropServices.Marshal.AllocHGlobal(buffer.Length);
System.Runtime.InteropServices.Marshal.Copy(buffer, 0, unmanagedPointer, buffer.Length);
System.Drawing.Imaging.PixelFormat format = System.Drawing.Imaging.PixelFormat.Format24bppRgb (the equivalent of WPF format..)
System.Drawing.Image myImg = new System.Drawing.Bitmap(Width, Height, stride, format, unmanagedPointer);
myImg.Save("example.jpg", System.Drawing.Imaging.ImageFormat.Jpeg);
I haven't idea why it doesn't work when I use System.Drawing classes.

The error is in the calculation of the buffer offset for the ith image. Instead of width * height * i it has to calculated as stride * height * i:
wb.CopyPixels(buffer, stride, stride * height * i);
In order to also support bits-per-pixel values that are not an integer multiples of 8, you should calculate the stride like this:
int stride = (width * bpp + 7) / 8;

copy ROI from one image and copy to on another image in wpf

I want to develop a function with the following signature:
CopyImage(ImageSource inputImage, Point inTopLeft, Point InBottomRight, ImageSource outputImage, Point outTopLeft);
This function copy part of input image (ROI defined by inTopLeft and inBottomRight) and copy it to outputImage at outTopLeft.
I can do this in WPF by manipulating pixels, but I am looking for a solution that can do it much faster.
What is the fastest way to do this in WPF?

Your method could look like this:
private BitmapSource CopyRegion(
BitmapSource sourceBitmap, Int32Rect sourceRect,
BitmapSource targetBitmap, int targetX, int targetY)
{
if (sourceBitmap.Format != targetBitmap.Format)
{
throw new ArgumentException(
"Source and target bitmap must have the same PixelFormat.");
}
var bytesPerPixel = (sourceBitmap.Format.BitsPerPixel + 7) / 8;
var stride = bytesPerPixel * sourceRect.Width;
var pixelBuffer = new byte[stride * sourceRect.Height];
sourceBitmap.CopyPixels(sourceRect, pixelBuffer, stride, 0);
var outputBitmap = new WriteableBitmap(targetBitmap);
sourceRect.X = targetX;
sourceRect.Y = targetY;
outputBitmap.WritePixels(sourceRect, pixelBuffer, stride, 0);
return outputBitmap;
}

Using WritePixels when using a writeable bitmap from a intptr to create a bitmap.

Im currently trying to use writeablebitmap to take a IntPtr of a scan of images and turn each one into a Bitmap. Im wanting to use writeablebitmap because im having an issue with standard gdi
GDI+ System.Drawing.Bitmap gives error Parameter is not valid intermittently
There is a method on a WriteableBitmap that called WritePixels
http://msdn.microsoft.com/en-us/library/aa346817.aspx
Im not sure what I set for the buffer and the stride every example I find it shows the stride as 0 although that throws an error. When I set the stride to 5 the image appear black. I know this may not be the most efficient code but any help would be appreciated.
//create bitmap header
bmi = new BITMAPINFOHEADER();
//create initial rectangle
Int32Rect rect = new Int32Rect(0, 0, 0, 0);
//create duplicate intptr to use while in global lock
dibhand = dibhandp;
bmpptr = GlobalLock(dibhand);
//get the pixel sizes
pixptr = GetPixelInfo(bmpptr);
//create writeable bitmap
var wbitm = new WriteableBitmap(bmprect.Width, bmprect.Height, 96.0, 96.0, System.Windows.Media.PixelFormats.Bgr32, null);
//draw the image
wbitm.WritePixels(rect, dibhandp, 10, 0);
//convert the writeable bitmap to bitmap
var stream = new MemoryStream();
var encoder = new JpegBitmapEncoder();
encoder.Frames.Add(BitmapFrame.Create(wbitm));
encoder.Save(stream);
byte[] buffer = stream.GetBuffer();
var bitmap = new System.Drawing.Bitmap(new MemoryStream(buffer));
GlobalUnlock(dibhand);
GlobalFree(dibhand);
GlobalFree(dibhandp);
GlobalFree(bmpptr);
dibhand = IntPtr.Zero;
return bitmap;

An efficient way to work on Bitmaps in C# is to pass temporarily in unsafe mode (I know I don't answer the question exactly but I think the OP did not manage to use Bitmap, so this could be a solution anyway). You just have to lock bits and you're done:
unsafe private void GaussianFilter()
{
// Working images
using (Bitmap newImage = new Bitmap(width, height))
{
// Lock bits for performance reason
BitmapData newImageData = newImage.LockBits(new Rectangle(0, 0, newImage.Width,
newImage.Height), ImageLockMode.ReadOnly, PixelFormat.Format32bppArgb);
byte* pointer = (byte*)newImageData.Scan0;
int offset = newImageData.Stride - newImageData.Width * 4;
// Compute gaussian filter on temp image
for (int j = 0; j < InputData.Height - 1; ++j)
{
for (int 0 = 1; i < InputData.Width - 1; ++i)
{
// You browse 4 bytes per 4 bytes
// The 4 bytes are: B G R A
byte blue = pointer[0];
byte green = pointer[1];
byte red = pointer[2];
byte alpha = pointer[3];
// Your business here by setting pointer[i] = ...
// If you don't use alpha don't forget to set it to 255 else your whole image will be black !!
// Go to next pixels
pointer += 4;
}
// Go to next line: do not forget pixel at last and first column
pointer += offset;
}
// Unlock image
newImage.UnlockBits(newImageData);
newImage.Save("D:\temp\OCR_gray_gaussian.tif");
}
}
This is really much more efficient than SetPixel(i, j), you just have to be careful about pointer limits (and not forget to unlock data when you're done).
Now to answer your question about stride: the stride is the length in bytes of a line, it is a multiple of 4. In my exemple I use the format Format32bppArgb which uses 4 bytes per pixel (R, G, B and alpha), so newImageData.Stride and newImageData.Width * 4 are always the same. I use the offset in my loops only to show where it would be necessary.
But if you use another format, for instance Format24bppRgb which uses 3 bytes per pixel (R, G and B only), then there may be an offset between stride and width. For an image 10 * 10 pixels in this format, you will have a stride of 10 * 3 = 30, + 2 to reach nearest multiple of 4, i.e. 32.

Transparency of subtitles in Vista / Windows 7

I implemented the EVR renderer into a player of mine to deal with bad resizing quality on Windows Vista+ and came to problems...
I have subtitle overlay problems with the EVR:
try to see what i'm talking about - you must set the EVR in options.
I used this to apply a 32bit alpha bitmap onto VMR9, using a DirectX surface:
private void SetVRM9MixerSettings(int width, int height, int lines)
{
int hr = 0;
VMR9AlphaBitmap alphaBmp;
// Set Alpha Bitmap Parameters for using a Direct3D surface
alphaBmp = new VMR9AlphaBitmap();
alphaBmp.dwFlags = VMR9AlphaBitmapFlags.EntireDDS | VMR9AlphaBitmapFlags.FilterMode;
// on unmanagedSurface the bitmap was drawn with transparency
alphaBmp.pDDS = unmanagedSurface;
alphaBmp.rDest = GetDestRectangle(width, height, lines);
alphaBmp.fAlpha = 1.0f;
alphaBmp.dwFilterMode = VMRMixerPrefs.BiLinearFiltering;
// for anaglyph half SBS
if (FrameMode == Mars.FrameMode.HalfSideBySide)
{
alphaBmp.rDest.left /= 2;
alphaBmp.rDest.right /= 2;
}
// Set Alpha Bitmap Parameters
hr = mixerBitmap.SetAlphaBitmap(ref alphaBmp);
DsError.ThrowExceptionForHR(hr);
}
Now however the project MediaFoundation.NET doesnt have the alphaBmp.pDDS pointer to set, so I cannot use a directdraw surface and need to use GDI (IF SOMEONE HAS A METHOD TO DO THIS IT WOULD BE COOL). But with GDI I cannot use 32bit alpha Bitmaps for true transparency - I only get 1 bit transparency with this approach:
private void SetEVRMixerSettings(int width, int height, int subtitleLines)
{
MFVideoAlphaBitmap alphaBmp = new MFVideoAlphaBitmap();
//alphaBitmap is a 32bit semitransparent Bitmap
Graphics g = Graphics.FromImage(alphaBitmap);
// get pointer to needed objects
IntPtr hdc = g.GetHdc();
IntPtr memDC = CreateCompatibleDC(hdc);
IntPtr hBitmap = alphaBitmap.GetHbitmap();
IntPtr hOld = SelectObject(memDC, hBitmap);
alphaBmp.GetBitmapFromDC = true;
alphaBmp.stru = memDC;
alphaBmp.paras = new MFVideoAlphaBitmapParams();
alphaBmp.paras.dwFlags = MFVideoAlphaBitmapFlags.Alpha | MFVideoAlphaBitmapFlags.SrcColorKey | MFVideoAlphaBitmapFlags.DestRect;
// calculate destination rectangle
MFVideoNormalizedRect mfNRect = new MFVideoNormalizedRect();
NormalizedRect nRect = GetDestRectangle(width, height, subtitleLines);
mfNRect.top = nRect.top;
mfNRect.left = nRect.left;
mfNRect.right = nRect.right;
mfNRect.bottom = nRect.bottom;
// used when viewing half side by side anaglyph video that is stretched to full width
if (FrameMode == Mars.FrameMode.HalfSideBySide)
{
mfNRect.left /= 2;
mfNRect.right /= 2;
}
alphaBmp.paras.nrcDest = mfNRect;
// calculate source rectangle (full subtitle bitmap)
MFRect rcSrc = new MFRect();
rcSrc.bottom = alphaBitmap.Height;
rcSrc.right = alphaBitmap.Width;
rcSrc.top = 0;
rcSrc.left = 0;
alphaBmp.paras.rcSrc = rcSrc;
// apply 1-bit transparency
System.Drawing.Color colorKey = System.Drawing.Color.Black;
alphaBmp.paras.clrSrcKey = ColorTranslator.ToWin32(colorKey);
// 90% visible
alphaBmp.paras.fAlpha = 0.9F;
// set the bitmap to the evr mixer
evrMixerBitmap.SetAlphaBitmap(alphaBmp);
// cleanup
SelectObject(memDC, hOld);
DeleteDC(memDC);
g.ReleaseHdc();
}
So the questions are:
How to use a DirectDraw surface to mix bitmaps on the EVR video
or
How to mix a semi transparent bitmap without DirectDraw?
Thank you very much!

I'll try to answer the second question...
Alpha blending is rather simple task.
Assume that alpha is in the range from 0.0 - 1.0, where 0.0 means fully transparent and 1.0 represents a fully opaque color.
R_result = R_Source * alpha + R_destination * (1.0 - alpha)
Since we don't really need floats here, we can switch alpha to a 0-255 range.
R_result = ( R_Source * alpha + R_destination * (255 - alpha) ) >> 8
You can optimize it further... it's up to you.
Of course, same applies for G and B.

How to create a jpg image dynamically in memory with .NET?

I have a .NET (3.5 SP1) library (DLL) written in C#. I have to extend this library by a class method which will have the following signature:
public byte[] CreateGridImage(int maxXCells, int maxYCells,
int cellXPosition, int cellYPosition)
{
...
}
This method is supposed to do the following:
Input parameters maxXCells and maxYCells define the size of a grid of cells in X and Y direction. maxXCells and maxYCells is the number of cells in each direction. The individual cells are square-shaped. (So it's kind of an asymmetric chess board.)
Input parameters cellXPosition and cellYPosition identify one special cell within this grid and this cell has to be filled with a cross.
No fancy graphics are necessary, really only black grid lines on a white background and a X in one of the cells.
The resulting graphic must have jpg format.
Creation of this graphic must happen in memory and nothing should be stored in a file on disk nor painted on the screen.
The method returns the generated image as a byte[]
I'm very unfamiliar with graphics functions in .NET so my questions are:
Is this possible at all with .NET 3.5 SP1 without additional third-party libraries (which I would like to avoid)?
What are the basic steps I have to follow and what are the important .NET namespaces, classes and methods I need to know to achieve this goal (epecially to draw lines and other simple graphical elements "in memory" and convert the result into an byte array in jpg format)?
Thank you for suggestions in advance!

The following is a full code sample that will use GDI to draw a grid and place a cross (with a red background) just like in the example image below. It uses GDI just like the other answers but the real work takes places by looping through the cells and drawing gridlines.
The following code
byte[] bytes = CreateGridImage(10,10, 9, 9, 30);
will create a 10x10 grid with a cross in the 9x9 position:
A new addition to CreateGridImage() is the addition of a boxSize argument which sets the size of each "square" in the grid
public static byte[] CreateGridImage(
int maxXCells,
int maxYCells,
int cellXPosition,
int cellYPosition,
int boxSize)
{
using (var bmp = new System.Drawing.Bitmap(maxXCells * boxSize+1, maxYCells * boxSize+1))
{
using (Graphics g = Graphics.FromImage(bmp))
{
g.Clear(Color.Yellow);
Pen pen = new Pen(Color.Black);
pen.Width = 1;
//Draw red rectangle to go behind cross
Rectangle rect = new Rectangle(boxSize * (cellXPosition - 1), boxSize * (cellYPosition - 1), boxSize, boxSize);
g.FillRectangle(new SolidBrush(Color.Red), rect);
//Draw cross
g.DrawLine(pen, boxSize * (cellXPosition - 1), boxSize * (cellYPosition - 1), boxSize * cellXPosition, boxSize * cellYPosition);
g.DrawLine(pen, boxSize * (cellXPosition - 1), boxSize * cellYPosition, boxSize * cellXPosition, boxSize * (cellYPosition - 1));
//Draw horizontal lines
for (int i = 0; i <= maxXCells;i++ )
{
g.DrawLine(pen, (i * boxSize), 0, i * boxSize, boxSize * maxYCells);
}
//Draw vertical lines
for (int i = 0; i <= maxYCells; i++)
{
g.DrawLine(pen, 0, (i * boxSize), boxSize * maxXCells, i * boxSize);
}
}
var memStream = new MemoryStream();
bmp.Save(memStream, ImageFormat.Jpeg);
return memStream.ToArray();
}
}

Create a System.Drawing.Bitmap Object.
Create a Graphics object to do your drawing.
Save the Bitmap to a MemoryStream as a JPEG object.
Don't forget to call Dispose on your temporary bitmap!
Sample code is below, you can change the pixel formats and various options below, have a look at the MSDN documentation.
public static byte[] CreateGridImage(
int maxXCells,
int maxYCells,
int cellXPosition,
int cellYPosition)
{
// Specify pixel format if you like..
using(var bmp = new System.Drawing.Bitmap(maxXCells, maxYCells))
{
using (Graphics g = Graphics.FromImage(bmp))
{
// Do your drawing here
}
var memStream = new MemoryStream();
bmp.Save(memStream, ImageFormat.Jpeg);
return memStream.ToArray();
}
}

First of all, about drawing, you can either:
Use Graphics class to use what GDI gives you
Lock bitmap and draw on it manually
As for saving, you could use MemoryStream class do keep your bytes and then get array of bytes out of it.
Sample code could look like this (assuming you want to use Graphics object to draw on bitmap:
public byte[] CreateGridImage(int maxXCells, int maxYCells,
int cellXPosition, int cellYPosition)
{
int imageWidth = 1;
int imageHeight = 2;
Bitmap bmp = new Bitmap(imageWidth, imageHeight);
using (Graphics g = Graphics.FromImage(bmp))
{
//draw code in here
}
MemoryStream imageStream = new MemoryStream();
bmp.Save(imageStream, System.Drawing.Imaging.ImageFormat.Jpeg);
bmp.Dispose();
return imageStream.ToArray();
}

Slauma,
Here is yet another way, which uses WindowsForm's DataGridView control to draw grid.
public byte[] GetData()
{
Form form = new Form();
//Create a new instance of DataGridView(WindowsForm) control.
DataGridView dataGridView1 = new DataGridView();
form.Controls.Add(dataGridView1);
//Customize output.
dataGridView1.RowHeadersVisible = false;
dataGridView1.ColumnHeadersVisible = false;
dataGridView1.ScrollBars = ScrollBars.None;
dataGridView1.AutoSize = true;
//Set datasource.
dataGridView1.DataSource = GetDataTable();
//Export as image.
Bitmap bitmap = new Bitmap(dataGridView1.Width, dataGridView1.Height);
dataGridView1.DrawToBitmap(bitmap, new Rectangle(Point.Empty, dataGridView1.Size));
//bitmap.Save("sample.jpg", System.Drawing.Imaging.ImageFormat.Jpeg);
MemoryStream ms = new MemoryStream();
bitmap.Save(ms, System.Drawing.Imaging.ImageFormat.Jpeg);
bitmap.Dispose();
form.Dispose();
return ms.ToArray();
}
/// <summary>
/// Helper method.
/// </summary>
DataTable GetDataTable()
{
DataTable dt = new DataTable();
for (int i = 0; i < 2; i++)
dt.Columns.Add(string.Format("Column{0}", i));
for (int i = 0; i < dt.Columns.Count; i++)
{
for (int j = 0; j < 10; j++)
{
dt.Rows.Add(new string[] { "X1", "Y1" });
}
}
return dt;
}
===
In the client app.config (replace this line):
<readerQuotas maxDepth="32"
maxStringContentLength="2147483647"
maxArrayLength="2147483647"
maxBytesPerRead="2147483647"
maxNameTableCharCount="2147483647" />
===
Happy Coding !