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

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 !

Related

Watermark not drawing in image

I had an error come up:
A Graphics Object cannot be Created from an Image that has an Indexed Pixel Format
So I implemented this code into my method: Solution for "A Graphics Object cannot be Created from an Image that has an Indexed Pixel Format"
But now my watermark doesnt want to draw on my image.
Please can anyone assist.
Code:
private Image AddWaterMark(Image original)
{
Image waterMark = Image.FromFile(ConfigurationManager.AppSettings["GalleryFolder"] + #"\watermark.png");
Bitmap bm = (Bitmap)original;
Size waterMarkResize = ResizeFit(new Size(original.Width, original.Height));
using (Image watermarkImage = new Bitmap(waterMark, waterMarkResize))
using (Graphics imageGraphics = Graphics.FromImage(new Bitmap(bm.Width, bm.Height)))
{
imageGraphics.DrawImage(bm, new Rectangle(0, 0, bm.Width, bm.Height), 0, 0, bm.Width, bm.Height, GraphicsUnit.Pixel);
using (TextureBrush watermarkBrush = new TextureBrush(watermarkImage))
{
int x = (original.Width / 2 - watermarkImage.Width / 2);
int y = (original.Height / 2 - watermarkImage.Height / 2);
watermarkBrush.TranslateTransform(x, y);
imageGraphics.FillRectangle(watermarkBrush, new Rectangle(new Point(x, y), new Size(watermarkImage.Width + 1, watermarkImage.Height)));
}
}
return bm;
}
You're creating a new Bitmap to pass to Graphics.FromImage then returning the uneditted original Bitmap. Create the new Bitmap independently, pass it to FromImage then return the new Bitmap.
var edit = new Bitmap(bm.Width, bm.Height);
// ...
using (Graphics imagesGraphics = Graphics.FromImage(edit))
{
// draw original
// draw watermark
}
return edit;

How to overlay two picturebox c# but the picturebox in the background can be seen

Good day
i don't know if my title is correct. sorry for my bad english
How to overlay two picturebox using c# inoder to achieve the image below, and change the opacity of upper picture box on runtime.
what i need to achieve is something like this. i have two images and i need to overlay them
first image:
enter image description here
and i have second image with a text of: Another Text on image.
and the location of the text is lower than the text location of the first image
(i can't upload more than two image because i don't have 10 reputation yet.)
i need to do like on the image below, but using two picturebox and can change the opacity in order for the second picturebox below the first one to be seen
and the output of the two image:
enter image description here
i created the output image using java. i know that i can run the jar file using c#. but the user required to changed the opacity on run time. so how can i do this?
this is the java code i used
BufferedImage biInner = ImageIO.read(inner);
BufferedImage biOutter = ImageIO.read(outter);
System.out.println(biInner);
System.out.println(biOutter);
Graphics2D g = biOutter.createGraphics();
g.setComposite(AlphaComposite.getInstance(AlphaComposite.SRC_OVER, 0.5f));
int x = (biOutter.getWidth() - biInner.getWidth()) / 2;
int y = (biOutter.getHeight() - biInner.getHeight()) / 2;
System.out.println(x + "x" + y);
g.drawImage(biInner, x, y, null);
g.dispose();
ImageIO.write(biOutter, "PNG", new File(output));
i hope my question is understandable. thank you
Here you go, just a sample, but blueBox is transparent (0.5):
public sealed partial class Form1 : Form
{
private readonly Bitmap m_BlueBox;
private readonly Bitmap m_YellowBox;
public Form1()
{
InitializeComponent();
DoubleBuffered = true;
m_YellowBox = CreateBox(Color.Yellow);
m_BlueBox = CreateBox(Color.Blue);
m_BlueBox = ChangeOpacity(m_BlueBox, 0.5f);
}
public static Bitmap ChangeOpacity(Image img, float opacityvalue)
{
var bmp = new Bitmap(img.Width, img.Height);
using (var graphics = Graphics.FromImage(bmp))
{
var colormatrix = new ColorMatrix();
colormatrix.Matrix33 = opacityvalue;
var imgAttribute = new ImageAttributes();
imgAttribute.SetColorMatrix(colormatrix, ColorMatrixFlag.Default, ColorAdjustType.Bitmap);
graphics.DrawImage(img, new Rectangle(0, 0, bmp.Width, bmp.Height), 0, 0, img.Width, img.Height,
GraphicsUnit.Pixel, imgAttribute);
}
return bmp;
}
private static Bitmap CreateBox(Color color)
{
var bmp = new Bitmap(200, 200);
for (var x = 0; x < bmp.Width; x++)
{
for (var y = 0; y < bmp.Height; y++)
{
bmp.SetPixel(x, y, color);
}
}
return bmp;
}
private void Form1_Paint(object sender, PaintEventArgs e)
{
e.Graphics.DrawImage(m_YellowBox, new Point(10, 10));
e.Graphics.DrawImage(m_BlueBox, new Point(70, 70));
}
}

How to get pixel color of Direct2D bitmap on SharpDX

I use SharpDX and I don't understand how to get pixel color at bitmap. I found CopySubresourceRegion method, but it working on Direct3D.
I've strange idea:
I can create RenderForm and drawing my bitmap on form. Then get graphics of form. Then create bitmap via "new Bitmap(width, height, graphics)". And then get pixel color from new bitmap;
I written special function for getting pixel color. This solved my problem ;)
C# - SharpDX
Color4 GetPixel(Bitmap image, int x, int y, RenderTarget renderTarget) {
var deviceContext2d = renderTarget.QueryInterface<DeviceContext>();
var bitmapProperties = new BitmapProperties1();
bitmapProperties.BitmapOptions = BitmapOptions.CannotDraw | BitmapOptions.CpuRead;
bitmapProperties.PixelFormat = image.PixelFormat;
var bitmap1 = new Bitmap1(deviceContext2d, new Size2((int)image.Size.Width, (int)image.Size.Height), bitmapProperties);
bitmap1.CopyFromBitmap(image);
var map = bitmap1.Map(MapOptions.Read);
var size = (int)image.Size.Width * (int)image.Size.Height * 4;
byte[] bytes = new byte[size];
Marshal.Copy(map.DataPointer, bytes, 0, size);
bitmap1.Unmap();
bitmap1.Dispose();
deviceContext2d.Dispose();
var position = (y * (int)image.Size.Width + x) * 4;
return new Color4(bytes[position], bytes[position + 1], bytes[position + 2], bytes[position + 3]);
}
If you are targeting Direct2D 1.1 (or higher), then you can use the ID2D1Bitmap1::Map method. This will require that you set D2D1_BITMAP_OPTIONS_CPU_READ and D2D1_BITMAP_OPTIONS_CANNOT_DRAW flags on the bitmap when creating it.

Create a Bigtiff (>4GB) File with Bitmiracle Libtiff.net

First I want to thank Bitmiracle for this great lib. Even while creating very big files, the memory footprint is very low.
A few days ago I ran into a problem where I wanted to create a tiff file bigger than 4GB. I created the tiled tiff file successfully, but it seems that the color of the tiles created beyond 4GB are somehow inverted.
Here the code relevant code:
Usage:
WriteTiledTiff("bigtiff.tiff",BitmapSourceFromBrush(new RadialGradientBrush(Colors.Aqua,Colors.Red), 256));
Methods:
public static BitmapSource BitmapSourceFromBrush(Brush drawingBrush, int size = 32, int dpi = 96)
{
// RenderTargetBitmap = builds a bitmap rendering of a visual
var pixelFormat = PixelFormats.Pbgra32;
RenderTargetBitmap rtb = new RenderTargetBitmap(size, size, dpi, dpi, pixelFormat);
// Drawing visual allows us to compose graphic drawing parts into a visual to render
var drawingVisual = new DrawingVisual();
using (DrawingContext context = drawingVisual.RenderOpen())
{
// Declaring drawing a rectangle using the input brush to fill up the visual
context.DrawRectangle(drawingBrush, null, new Rect(0, 0, size, size));
}
// Actually rendering the bitmap
rtb.Render(drawingVisual);
return rtb;
}
public static void WriteTiledTiff(string fileName, BitmapSource tile)
{
const int PIXEL_WIDTH = 48000;
const int PIXEL_HEIGHT = 48000;
int iTile_Width = tile.PixelWidth;
int iTile_Height = tile.PixelHeight;
using (Tiff tiff = Tiff.Open(fileName, "w"))
{
tiff.SetField(TiffTag.IMAGEWIDTH, PIXEL_WIDTH);
tiff.SetField(TiffTag.IMAGELENGTH, PIXEL_HEIGHT);
tiff.SetField(TiffTag.COMPRESSION, Compression.NONE);
tiff.SetField(TiffTag.PHOTOMETRIC, Photometric.RGB);
tiff.SetField(TiffTag.ROWSPERSTRIP, PIXEL_HEIGHT);
tiff.SetField(TiffTag.XRESOLUTION, 96);
tiff.SetField(TiffTag.YRESOLUTION, 96);
tiff.SetField(TiffTag.BITSPERSAMPLE, 8);
tiff.SetField(TiffTag.SAMPLESPERPIXEL, 3);
tiff.SetField(TiffTag.PLANARCONFIG, PlanarConfig.CONTIG);
tiff.SetField(TiffTag.TILEWIDTH, iTile_Width);
tiff.SetField(TiffTag.TILELENGTH, iTile_Height);
int tileC = 0;
for (int row = 0; row < PIXEL_HEIGHT; row += iTile_Height)
{
for (int col = 0; col < PIXEL_WIDTH; col += iTile_Width)
{
if (tile.Format != PixelFormats.Rgb24) tile = new FormatConvertedBitmap(tile, PixelFormats.Rgb24, null, 0);
int stride = tile.PixelWidth * ((tile.Format.BitsPerPixel + 7) / 8);
byte[] pixels = new byte[tile.PixelHeight * stride];
tile.CopyPixels(pixels, stride, 0);
tiff.WriteEncodedTile(tileC++, pixels, pixels.Length);
}
}
tiff.WriteDirectory();
}
}
The resulted file will be 6,47GB in size. I viewed it with a small tool called "vliv" vilv download
All LibTiff.Net versions including 2.4.500.0 are based on 3.x branch of the original libtiff.
Support for BigTIFF was introduced in 4.x branch of the original libtiff. Thus, at this time there are no LibTiff.Net versions designed to handle BigTiff files / files over 4GB on disk.
EDIT:
LibTiff.Net 2.4.508 adds support for BigTiff.

How to paint over a bitmap with a brush - C#/.NET

This seems like it should be simple, but I can't seem to find any way to do it. I have a custom WinForms control that has an overridden paint method that does some custom drawing.
I have a Bitmap in memory, and all I want to do is paint over the whole thing with a HashBrush, but preserve the alpha channel, so that the transparent parts of the bitmap don't get painted.
The bitmap in memory is not a simple shape, so it will not be feasible to define it as a set of paths or anything.
EDIT: In response to showing the code, there is a lot of code in the paint routine, so I'm only including a relevant snippet, which is the method in question. This method gets called from the main paint override. It accepts a list of images which are black transparency masks and combines them into one, then it uses a ColorMatrix to change the color of the combined image it created, allowing it to be overlayed on top of the background. All I want to accomplish is being able to also paint hashmarks on top of it.
private void PaintSurface(PaintEventArgs e, Image imgParent, List<Image> surfImgs, Rectangle destRect, ToothSurfaceMaterial material)
{
using (Bitmap bmp = new Bitmap(imgParent.Width, imgParent.Height,
System.Drawing.Imaging.PixelFormat.Format32bppPArgb))
{
using (Graphics g = Graphics.FromImage(bmp))
{
foreach (Image img in surfImgs)
{
g.DrawImage(img, System.Drawing.Point.Empty);
}
}
ColorMatrix matrix = new ColorMatrix(
new float[][] {
new float[] { 0, 0, 0, 0, 0},
new float[] { 0, 0, 0, 0, 0},
new float[] { 0, 0, 0, 0, 0},
new float[] { 0, 0, 0, 0.7f, 0},
new float[] { material.R / 255.0f,
material.G / 255.0f,
material.B / 255.0f,
0, 1}
});
ImageAttributes imageAttr = new ImageAttributes();
imageAttr.SetColorMatrix(matrix);
Rectangle r = GetSizedRect(imgParent, destRect);
e.Graphics.DrawImage(bmp,
r,
0,
0,
bmp.Width,
bmp.Height,
GraphicsUnit.Pixel, imageAttr);
}
}
The solution I ended up using was the following method. First I combine the individual masks into one, then create a new Bitmap and paint the whole thing with the HatchBrush, finally iterate through the mask and set the alpha values on the newly generated bitmap based on the mask.
private Bitmap GenerateSurface(Image imgParent, List<Image> surfImgs, ToothSurfaceMaterial material)
{
Bitmap mask = new Bitmap(imgParent.Width, imgParent.Height,
System.Drawing.Imaging.PixelFormat.Format32bppPArgb);
using (Graphics g = Graphics.FromImage(mask))
{
foreach (Image img in surfImgs)
{
g.DrawImage(img, System.Drawing.Point.Empty);
}
}
Bitmap output = new Bitmap(mask.Width, mask.Height,
System.Drawing.Imaging.PixelFormat.Format32bppPArgb);
using (Graphics g = Graphics.FromImage(output))
{
if (material.HatchStyle != null)
{
HatchBrush hb = new HatchBrush((HatchStyle)material.HatchStyle, material.FgColor, material.BgColor);
g.FillRectangle(hb, new Rectangle(0, 0, output.Width, output.Height));
}
else
{
SolidBrush sb = new SolidBrush(material.FgColor);
g.FillRectangle(sb, new Rectangle(0, 0, output.Width, output.Height));
}
}
var rect = new Rectangle(0, 0, output.Width, output.Height);
var bitsMask = mask.LockBits(rect, ImageLockMode.ReadOnly, PixelFormat.Format32bppArgb);
var bitsOutput = output.LockBits(rect, ImageLockMode.ReadWrite, PixelFormat.Format32bppArgb);
unsafe
{
int offset = 0;
for (int y = 0; y < mask.Height; y++)
{
byte* ptrMask = (byte*)bitsMask.Scan0 + y * bitsMask.Stride;
byte* ptrOutput = (byte*)bitsOutput.Scan0 + y * bitsOutput.Stride;
for (int x = 0; x < mask.Width; x++)
{
offset = 4 * x + 3;
ptrOutput[offset] = (byte)(ptrMask[offset] * 0.7);
}
}
}
mask.UnlockBits(bitsMask);
output.UnlockBits(bitsOutput);
return output;
}
I think you don't need any ColorMatrix which is overkill, you just need a ColorMap, here is the code which may not suit your requirement but should give you the idea. That's because I possibly don't understand your problem well, if you have any problem, just leave some comment and I'll try to improve the answer:
ImageAttributes imgA = new ImageAttributes();
ColorMap cm = new ColorMap();
cm.OldColor = Color.Black
cm.NewColor = Color.FromArgb((byte)(0.7*255), Color.Green);
imgA.SetRemapTable(new ColorMap[] {cm });
GraphicsUnit gu = GraphicsUnit.Pixel;
g.DrawImage(imageToDraw,new Point[]{Point.Empty,
new Point(backImage.Width/2,0),
new Point(0,backImage.Height/2)},
Rectangle.Round(imageToDraw.GetBounds(ref gu)),
GraphicsUnit.Pixel, imgA);
the new Point[] is an array of 3 Points used to locate the destination Rectangle.
The code above is used to Draw the imageToDraw on top of the backImage and convert and color of Black to the color Green with Opacity = 70%. That's what you want to fulfill your code.
UPDATE
This may be what you want, in fact your code doesn't show what you want, it just shows what you have which doesn't implement anything related to your problem now. I deduce this from your very first description in your question. The input is an image with background color (which will be made partially transparent later) being Black. Now the output you want is an image with all the non-Black region being painted with a HatchBrush. This output will then be processed to turn the Black background to a partially transparent background.
public void PaintHatchBrush(Bitmap input, HatchBrush brush){
using(Graphics g = Graphics.FromImage(input)){
g.Clip = GetForegroundRegion(input, Color.Black);
GraphicsUnit gu = GraphicsUnit.Pixel;
g.FillRectangle(brush, input.GetBounds(ref gu));
}
}
//This is implemented using `GetPixel` which is not fast, but it gives you the idea.
public Region GetForegroundRegion(Bitmap input, Color backColor){
GraphicsPath gp = new GraphicsPath();
Rectangle rect = Rectangle.Empty;
bool jumpedIn = false;
for (int i = 0; i < bm.Height; i++) {
for (int j = 0; j < bm.Width; j++) {
Color c = bm.GetPixel(j, i);
if (c != backColor&&!jumpedIn) {
rect = new Rectangle(j, i, 1, 1);
jumpedIn = true;
}
if (jumpedIn && (c == backColor || j == bm.Width - 1)) {
rect.Width = j - rect.Left;
gp.AddRectangle(rect);
jumpedIn = false;
}
}
}
return new Region(gp);
}
//Usage
HatchBrush brush = new HatchBrush(HatchStyle.Percent30, Color.Green, Color.Yellow);
PaintHatchBrush(yourImage, brush);
//then yourImage will have HatchBrush painted on the surface leaving the Black background intact.
//This image will be used in the next process to turn the Black background into 70%
//opacity background as you did using ColorMatrix (or more simply using ColorMap as I posted previously)

Categories

Resources