4 Replies Latest reply on Nov 13, 2007 7:58 PM by keeneydj

    image capture and send with post

    keeneydj
      Ok, like the title suggests, I have a lil paint function drawing on a canvas in flex 2. What I need is to get that image all captured and bundled up to send to asp.net VB. The site is here: we are UNLIMITED .com Click on start, then Draw, and you will get to play with that canvas. You can draw all day, different brush sizes, colors, and erase. I need a capture button there to get the image off the canvas into BYTE format. Mainly what i need help on is sending that byte array from flex to asp.net VB, and REALLY need help on catching that byte array in asp.net VB and getting it to the point i save save it to the server HDD via the file I/O. I have already been able to save XML docs to the HDD with asp.net VB to be read by flex via the file I/O. I really just need some asp.net vb code to do the "POST" catch (or request), and get the image to PNG? format to be saved. This is going to be a small paint program in flex, members can use to create their avatar. I will be implementing say a crop, copy/paste, drag and drop, resize and what not, to give my users more flexability as far as what their image looks like. I'd really like it to be as close to a basic "windows paint" program. But that's another story. For some reason every time I look up passing variables from flex (flash) to asp.net vb, it's POSTing form vars, and really none of it has dealings with images. I know it's probably really the same, but like I was trying to say, I just get all kinds of confused with working with byte arrays and asp.net vb and flex. I was actually supposed to have this site up and running this past Aug, but with the swap to flex, the pains of membership between flex and asp.net vb, and my general newbie beginnings of this whole aspect of computers. Let's just say it's taken a bit longer than expected.


      So to recap from all my babbling:

      I need to:
      (flex)
      Capture the image on that canvas (see link)
      load to asp.net VB (pref. using POST)

      (asp.net VB)
      create an asp.net vb page to receive/request that image
      reformat that image ( pref. PNG )
      save the formatted image to the server HDD

      This should be fairly simple, and I'm almost embarrassed to ask for help. I've just been trying to work through this muck for way too long, and I really need to get past this.

      code snippets would be great, although just some good resources to look at would be great too. I do entirely appreciate any help in this matter.



      Daniel Keeney
      WebMaster
      we are UNLIMITED .com
        • 1. Re: image capture and send with post
          hohohuhu

          import com.adobe.images.PNGEncoder;
          .....

          var canvas:Canvas;
          var snapshot:BitmapData = new BitmapData(canvas.width, canvas.height, true);
          snapshot.draw(canvas);

          var encBytes:ByteArray = PNGEncoder.encode(snapshot);

          // Now you got a byte array.

          Hope this help
          Note : You will need PNGEncoder from flexlib project.
          • 2. Re: image capture and send with post
            keeneydj Level 1
            Sweet, that'll get me to a byte array. What I really need, esp. now, is getting to asp.net. You can also use capture UIComponent. http://www.tricedesigns.com/tricedesigns_home/blog/2006/09/flex-2-bitmapdata-tricks-and.ht ml I like this better. It'll let me set the canvas size first through variables(canvas creation), then just capture the canvas a lot easier. Thank you hohohuhu.

            Need some good asp.net'ers now. I believe my server allows coldFusion also, so if we had to go that route to get em to the server I GUESS that'd be ok ;)

            Also now that we just captured as a png, we don't have to do any formatting on the asp.net side. Just capture and save. When I was looking up sending form vars from flash to asp.net I was finding all kinds of POST and LoadVars examples. Now for some reason I'm not finding any for asp.net. PHP out tha wahzoo though.

            Yet again, any help would be freakin awesome.

            -Dan
            • 3. Re: image capture and send with post
              jonrmayer
              You've probably already worked this one out but I thought I would post my solution - not elegant but it works

              I spent two days trying to find an asp.net solution in VB.net to no avail so here goes:

              Actionscript:

              var bitMD:BitmapData = new BitmapData(this.width,this.height)
              bitMD.draw(this);

              var _PNG:ByteArray = PNGEncoder.encode(bitMD);


              var U:URLRequest = new URLRequest
              U.method = URLRequestMethod.POST
              U.data = _PNG;
              U.contentType="application/octet-stream";
              U.url = " http://localhost/CARTO/image.aspx";
              var UR:URLLoader = new URLLoader
              UR.dataFormat = URLLoaderDataFormat.TEXT
              UR.load(U);


              ASP.NET

              Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
              Dim b() As Byte = Request.BinaryRead(Request.TotalBytes)



              Dim ms As MemoryStream = New MemoryStream(b)

              Dim img As System.Drawing.Image = Bitmap.FromStream(ms)
              Dim bmp As Bitmap = New Bitmap(img)


              Dim tempStream As New MemoryStream()
              bmp.Save(tempStream, System.Drawing.Imaging.ImageFormat.Png)
              Dim fs As New FileStream(System.Web.HttpContext.Current.Server.MapPath("test.png"), FileMode.Create)
              tempStream.WriteTo(fs)
              tempStream.Close()
              fs.Close()

              End Sub
              • 4. Re: image capture and send with post
                keeneydj Level 1
                Right on!

                That's exactly what I was having trouble with. Reading out of the memory stream was what I was skipping over. Thank you Jon