overlay text on uploaded picture

[Brian Lowe]

My web site accepts uploaded photos and stores them in a SQL table as BLObs
so they never touch the filesystem.

I have a way to create a thumbnail version of the uploaded image and store
that in the db too, again without touching metal.

I need a way to overlay some text on the image but I'm stuck.

All the help I find uses files in the filesystem, and when I try to convert
the example to my imagestream model it fails and I can't figure out why. I'm
not big on graphics, so I need some help.

Here's the (working) code I use to get the uploaded image down to a
thumbnail size...
Private Function createThumbnail(ByVal ImageStream As Stream, ByVal tWidth
As Double, ByVal tHeight As Double) As Byte()
Dim g As System.Drawing.Image
Dim thumbSize As Size
Dim imgOutput As Bitmap
Dim imgStream As MemoryStream
Dim thisFormat As Object
Dim imgbin() As Byte
Dim n As Int32
Try
g = System.Drawing.Image.FromStream(ImageStream)
thumbSize = NewthumbSize(g.Width, g.Height, tWidth, tHeight)
imgOutput = New Bitmap(g, thumbSize.Width, thumbSize.Height)
imgStream = New MemoryStream
thisFormat = g.RawFormat
imgOutput.Save(imgStream, thisFormat)
ReDim imgbin(imgStream.Length)
imgStream.Position = 0
n = imgStream.Read(imgbin, 0, imgbin.Length)
Catch ex As Exception
Throw ex
Finally
g.Dispose()
imgOutput.Dispose()
End Try
Return imgbin
End Function

And here's the (non-working) code I need fixing to get text onto the
original image.

Private Function createProof(ByVal ImageStream As Stream) As Byte()
Dim image As System.Drawing.Image
Dim graphic As System.Drawing.Graphics
Dim imgOutput As Bitmap
Dim imgStream As MemoryStream
Dim thisFormat As Object
Dim imgbin() As Byte
Dim n As Int32
Dim myBrush As Drawing2D.HatchBrush
Dim myFont As Font
Try
image = System.Drawing.Image.FromStream(ImageStream)
myBrush = New Drawing2D.HatchBrush(Drawing2D.HatchStyle.Trellis,
Color.FromArgb(127, Color.White))
myFont = New Font("Arial black", 144)
graphic = Graphics.FromImage(image)
graphic.DrawString("PROOF", myFont, myBrush, New RectangleF(10, 10, 100,
200))
imgOutput = New Bitmap(image.Width, image.Height, graphic)
imgStream = New MemoryStream
imgOutput.Save(imgStream, image.RawFormat)
ReDim imgbin(imgStream.Length)
imgStream.Position = 0
n = imgStream.Read(imgbin, 0, imgbin.Length)
Catch ex As Exception
Throw ex
Finally
graphic.Dispose()
imgOutput.Dispose()
End Try
Return imgbin
End Function

Help me out someone, please...

Brian Lowe
---------@

 

[Patrick Steele [MVP]]

My web site accepts uploaded photos and stores them in a SQL table as BLObs
so they never touch the filesystem.

I have a way to create a thumbnail version of the uploaded image and store
that in the db too, again without touching metal.

I need a way to overlay some text on the image but I'm stuck.

Just a guess, but I would try using the Graphics.FromImage() method to
get a Graphics object and then you should be able to do your overlay
with that.

 

[Brian Lowe]

Just a guess, but I would try using the Graphics.FromImage() method to
get a Graphics object and then you should be able to do your overlay
with that.

Thanks. I figured I needed a Graphics object, and also that I'd need the
FromImage() method to get my image into a form I could lay text on.

Here's my code so far...

' I have my image data as a System.IO.Stream but
' I need a System.Drawing.Graphics object
' Graphics won't convert a stream but System.Drawing.Image
' will and Graphics will convert an Image so...
image = System.Drawing.Image.FromStream(ImageStream)
graphic = Graphics.FromImage(image)
' Now I have my image data as a Graphics object
' Set up tools for writing text...
myBrush = New Drawing2D.HatchBrush(Drawing2D.HatchStyle.Trellis,
Color.FromArgb(127, Color.White))
myFont = New Font("Arial black", 144)
' Use the DrawString() method of the graphics object to
' overlay the text (tell me if I'm wrong, please)
graphic.DrawString("PROOF", myFont, myBrush, New RectangleF(10, 10, 100,
200))
' I can convert a Stream to a byte array and that's what
' I need to output. I can convert a Bitmap into a Stream, so...
' Create a Bitmap of the correct width and
' hieght using my Grpahics object image
imgOutput = New Bitmap(image.Width, image.Height, graphic)
' Prepare a new Stream
imgStream = New MemoryStream
' Send the Bitmap down the Stream
imgOutput.Save(imgStream, image.RawFormat)
' Prepare the Byte array to take the stream data
ReDim imgbin(imgStream.Length)
' Set the pointer to the start of the stream
imgStream.Position = 0
' Stream the Bitmap data into the Byte array
n = imgStream.Read(imgbin, 0, imgbin.Length)

That's the plan, anyway.

I end up with an image the right size but all black.

I don't see how I can even debug this stuff - there's nothing I can look at
between steps to show me where my graphic is up to.

I'm stuck.

Brian Lowe
---------@

 

[Patrick Steele [MVP]]

Thanks. I figured I needed a Graphics object, and also that I'd need the
FromImage() method to get my image into a form I could lay text on.

Here's my code so far...

' I have my image data as a System.IO.Stream but
' I need a System.Drawing.Graphics object
' Graphics won't convert a stream but System.Drawing.Image
' will and Graphics will convert an Image so...
image = System.Drawing.Image.FromStream(ImageStream)
graphic = Graphics.FromImage(image)
' Now I have my image data as a Graphics object
' Set up tools for writing text...
myBrush = New Drawing2D.HatchBrush(Drawing2D.HatchStyle.Trellis,
Color.FromArgb(127, Color.White))
myFont = New Font("Arial black", 144)
' Use the DrawString() method of the graphics object to
' overlay the text (tell me if I'm wrong, please)
graphic.DrawString("PROOF", myFont, myBrush, New RectangleF(10, 10, 100,
200))

At this point, the bitmap pointed to by "image" should have the text on
it and you can directly save the "image" object. No need to create a
second bitmap.

 

[Brian Lowe]

At this point, the bitmap pointed to by "image" should have the text on
it and you can directly save the "image" object. No need to create a
second bitmap.

Really? I thought .net always used ByVal by default and not ByRef. That
would mean that the image is being modfied as a side effect of methods on a
graphic object created from it. Is that right?

If it is then all I need to do is stream my original (but changed) image
back to a Byte array and I'll be able to store it in SQl as before.

I'll be very happy.

I'll let you know how I get on. Thanks for the help.


The reason I was creating a second bitmap is that I need the image in the
form of a Byte array (so I can then load it into a SQL binary field).

I couldn't go direct from a Graphics object to a Byte array (can I?) so I
loaded the graphic into a Bitmap and then saved it to a Stream and converted
the Stream into a Byte array.

I know its a kludge, and I'm sure there's a very neat and streamlined way to
do what I want, but my limited knowledge of the tools means I need help.

' I can convert a Stream to a byte array and that's what
' I need to output. I can convert a Bitmap into a Stream, so...
' Create a Bitmap of the correct width and
' height using my Graphics object image
imgOutput = New Bitmap(image.Width, image.Height, graphic)
' Prepare a new Stream
imgStream = New MemoryStream
' Send the Bitmap down the Stream
imgOutput.Save(imgStream, image.RawFormat)
' Prepare the Byte array to take the stream data
ReDim imgbin(imgStream.Length)
' Set the pointer to the start of the stream
imgStream.Position = 0
' Stream the Bitmap data into the Byte array
n = imgStream.Read(imgbin, 0, imgbin.Length)

Brian Lowe
---------@

 

[Brian Lowe]

At this point, the bitmap pointed to by "image" should have the text on
it and you can directly save the "image" object. No need to create a
second bitmap.

I understood the default to be ByVal when passing parameters into functions,
so I'd expect graphic to be a copy of image, so anything I do to it would
not change image. Am I wrong?

Obviously I am/was.

I tried saving image and lo! there was my text overlaid on the picture.

Thanks!

Next job is to work out how to size my text so it adequately covers enough
of the picture to be worth stamping "PROOF" on it. Not too small as to
appear only in a corner, and not too large as to darw outside of the image
area.

Thanks for your help.

Brian Lowe
---------@