overlay text on uploaded picture

Discussion in 'ASP .Net' started by Brian Lowe, Jun 21, 2004.

  1. Brian Lowe

    Brian Lowe Guest

    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
    ---------@
     
    Brian Lowe, Jun 21, 2004
    #1
    1. Advertising

  2. In article <u7$>, ess
    says...
    > 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.

    --
    Patrick Steele
    Microsoft .NET MVP
    http://weblogs.asp.net/psteele
     
    Patrick Steele [MVP], Jun 21, 2004
    #2
    1. Advertising

  3. Brian Lowe

    Brian Lowe Guest

    "Patrick Steele [MVP]" <> wrote in message
    news:...
    > 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
    ---------@
     
    Brian Lowe, Jun 21, 2004
    #3
  4. In article <eS3$>, ess
    says...
    > "Patrick Steele [MVP]" <> wrote in message
    > news:...
    > > 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))


    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.

    --
    Patrick Steele
    Microsoft .NET MVP
    http://weblogs.asp.net/psteele
     
    Patrick Steele [MVP], Jun 22, 2004
    #4
  5. Brian Lowe

    Brian Lowe Guest

    "Patrick Steele [MVP]" <> wrote in message
    news:...
    > In article <eS3$>, ess


    > > ' 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.


    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, Jun 22, 2004
    #5
  6. Brian Lowe

    Brian Lowe Guest

    "Patrick Steele [MVP]" <> wrote in message
    news:...
    > In article <eS3$>, ess
    > says...
    > > "Patrick Steele [MVP]" <> wrote in message
    > > news:...


    > > 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.


    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
    ---------@
     
    Brian Lowe, Jun 24, 2004
    #6
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Matt G
    Replies:
    1
    Views:
    1,186
    Deepak Kumar Vasudevan
    Aug 22, 2003
  2. image overlay

    , Sep 9, 2005, in forum: Java
    Replies:
    1
    Views:
    547
    jan V
    Sep 9, 2005
  3. Ross
    Replies:
    1
    Views:
    650
    Martin Johansen
    Jan 6, 2005
  4. Doug H

    Renaming an Uploaded Picture File

    Doug H, Mar 13, 2010, in forum: Perl Misc
    Replies:
    5
    Views:
    222
    J├╝rgen Exner
    Mar 15, 2010
  5. Replies:
    8
    Views:
    1,324
    Mick White
    Apr 19, 2005
Loading...

Share This Page