Online shooting of user portraits Using Flash

Many websites support online camera photos and simple editing when uploading user headers in addition to traditional methods. After the video is uploaded, the image data is submitted to the server (such as ASP. net). This function is exactly required in the past few days. After studying it, the idea is as follows:

1. first obtain the camera video

2. bitmapdata. Draw is used for video

3. Place a square on the top to allow users to adjust their positions manually and scale the positions.

4. After the user completes the adjustment, the bitmapdata in the specified region is copypixes (that is, the pixels in the specified region are copied)

5. Perform JPEG compression on the new bitmapdata obtained in the previous step, and then convert it to a base64 string.

6. Send the string to ASP. NET and restore it to an image and save it (I .e., base64 decoding)

 

Flash Code: (step 1 is omitted)

Import flash. media. camera; import flash. text. textfield; import flash. media. video; import flash. text. textformat; import FL. controls. button; import flash. utils. timer; import flash. events. mouseevent; import flash. display. bitmapdata; import flash. display. bitmap; import flash. display. sprite; import flash. geom. rectangle; import flash. events. event; VaR _ Cam: Camera; VaR _ txtinfo: textfield = txtinfo; VaR _ txtmsg: textfiel D = txtmsg; VaR _ btnget: button = btnget; VaR _ btnsave: button = btnsave; VaR _ video: Video = myvideo; VaR _ Timer: timer; VaR _ videoisworked: boolean = false; VaR _ BMP: bitmap; VaR _ BMP test: bitmap; VaR _ mask: SPRITE; VaR _ slider: simpleslider; Init (); function Init (): void {This. _ txtmsg. visible = false; this. _ btnget. label = "photo"; this. _ btnsave. label = "save"; this. _ txtinfo. selectable = false; var style: textformat = new te Xtformat (); style. font = ""; style. size = 12; // font size style. color = 0x000000; // RGB style. leading = 7; // line spacing this. _ btnget. setstyle ("textformat", style); this. _ btnsave. setstyle ("textformat", style); getcamera ();} function getcamera (): void {This. _ btnget. enabled = false; this. _ btnsave. enabled = false; this. _ Cam = camera. getcamera (); If (_ Cam = NULL) {This. _ txtinfo. TEXT = "no camera device detected! "; Return;} _ Cam. addeventlistener (statusevent. status, camerastatushandler); _ Cam. addeventlistener (activityevent. activity, cameraactivityhandler); _ Cam. setquality (0, 0); this. _ video. attachcamera (this. _ Cam);} // triggered when the user selects whether the camera is triggered; function camerastatushandler (E: statusevent): void {If (E. code = "camera. muted ") {This. _ txtinfo. TEXT = "you are not allowed to use the camera! ";} Else if (E. code = "camera. unmuted ") {This. _ txtinfo. TEXT = "getting the camera video... "; _ timer = new timer (); // checks the camera status every Ms. A total of 20 cameraactivityhandler (null );}} // function cameraactivityhandler (E: activityevent): void {If (! _ Videoisworked) {If (_ timer! = NULL) {_ timer. addeventlistener (timerevent. timer, checkcamera); _ timer. addeventlistener (timerevent. timer_complete, checkcameracomplete); _ timer. start () ;}}// timer callback function, used to check whether the camera device is correct. Function checkcamera (E: timerevent): void {This. _ txtinfo. TEXT = "getting the camera video... "; if (this. _ Cam. currentfps> 0) {_ timer. stop (); _ videoisworked = true; this. _ txtinfo. TEXT = ""; // The camera works properly. This. _ txtinfo. TEXT = "the camera is normal. Please click to take a photo"; // trace ("_ Cam. Width = ", _ Cam. width, ", _ Cam. height = ", _ Cam. height); this. _ btnget. addeventlistener (mouseevent. click, btnget_click); this. _ btnget. enabled = true; this. _ video. width = 240; this. _ video. height = 180; // trace (this. _ video. width, this. _ video. height) ;}} function btnget_click (E: mouseevent): void {var BMI: bitmapdata = new bitmapdata (_ Cam. width, _ Cam. height); BMI. draw (_ video); // trace (BMI. width, BMI. height); If (this. _ BMP = Null) {This. _ BMP = new Bitmap (BMI); addchild (_ BMP); _ BMP. X = 260; _ BMP. y = 10; _ BMP. width = _ video. width; _ BMP. height = _ video. height; If (this. _ mask = NULL) {This. _ mask = new sprite (); this. _ mask. graphics. beginfill (0 xffffff, 0.3); this. _ mask. graphics. drawrect (0, 0, 125,125); this. _ mask. graphics. endfill (); this. _ mask. graphics. linestyle (1, 0xff0000, 1); this. _ mask. graphics. lineto (1,124); this. _ mask. graphics. lineto (1 24,124); this. _ mask. graphics. lineto (124,1); this. _ mask. graphics. lineto (1, 1); addchild (this. _ mask); this. _ mask. X = 260 + 57; this. _ mask. y = 10 + 27; this. _ mask. buttonmode = true; this. _ mask. addeventlistener (mouseevent. mouse_down, mask_startdrag); this. stage. addeventlistener (mouseevent. mouse_up, stage_enddrag); If (_ slider = NULL) {_ slider = new simpleslider (125,180,180); _ slider. backwidth = 120; _ slider. backhei Ght = 6; _ slider. handleheight = 16; _ slider. addeventlistener (event. change, slider_change); addchild (_ slider); _ slider. X = 320; _ slider. y = 205; this. _ txtmsg. visible = true ;}} else {This. _ BMP. bitmapdata = BMI;} This. _ btnsave. enabled = true; this. _ txtinfo. TEXT = "drag the left square to adjust the position"; this. _ btnsave. addeventlistener (mouseevent. click, btnsave_click);} function btnsave_click (E: Event): void {// because the video size is inconsistent with the size of the camera's original pixel (that is, the video may have been zoomed, So adjust the ratio back to the initial state) var ratio: Number = This. _ Cam. width/This. _ BMP. width; var imgwidth: Int = This. _ mask. width * ratio; var imgheight: Int = This. _ mask. height * ratio; // trace (ratio); var bone density: bitmapdata = new bitmapdata (imgwidth, imgheight, false, 0xffff99); bone density. copypixels (this. _ BMP. bitmapdata, new rectangle (this. _ mask. x-260) * ratio, (this. _ mask. y-10) * ratio, imgwidth, imgheight), new point (); If (this. _ BMP test = Null) {This. _ BMP test = new Bitmap (BMI); addchild (_ BMP test); _ BMP test. X = 375; _ BMP test. y = 230;} else {This. _ BMP test. bitmapdata = BMI;} _ BMP test. width = This. _ mask. width; _ BMP test. height = This. _ mask. height; trace ("_ BMP test. width = ", this. _ mask. width, ", _ BMP test. height = ", this. _ mask. height); var jsonencoder: jpgencoder = new jpgencoder (); var jsonarr: bytearray = jsonencoder. encode (BMI); // compress into JPEG trace (jpegarr. le Ngth); var base64string: String = base64.encode (jpegarr); txtbase64.text = base64string; trace (base64string. length);} function slider_change (E: Event): void {// trace (E); this. _ BMP. height = This. _ slider. value; this. _ BMP. width = This. _ BMP. height * 4/3;} function mask_startdrag (E: mouseevent): void {This. _ mask. startdrag (false, new rectangle (240-125,180-125);} function stage_enddrag (E: mouseevent): void {This. _ Mask. stopdrag (); // trace ("x =", _ mask. x); // trace ("Y =", _ mask. y);} function checkcameracomplete (E: timerevent): void {This. _ txtinfo. TEXT = "the device is unavailable! (Possibly occupied) "; _ timer. removeeventlistener (timerevent. Timer, checkcamera); _ timer. removeeventlistener (timerevent. timer_complete, checkcameracomplete); _ timer = NULL ;}

Online flash demonstration (requires a camera to be connected to a computer)

C # processing example:

Using system; using system. drawing; using system. drawing. imaging; using system. io; using system. web; namespace onlinephotocapture {// <summary> // restore the image base64 string to the image and adjust the size and save it (by Yang Guo http://yjmyzz.cnblogs.com under the bodhi tree /) /// </Summary> public class savephoto: ihttphandler {public void processrequest (httpcontext context) {context. response. contenttype = "text/plain "; string base64string = "/9j/4 keys/keys // keys/J5 + keys + tl5ufo6ery8/t19vf4 + fr/2 gamaweaahedeqa/keys/D/ signature + naztstevltawqsg/hbkf/samples + samples/8ayd5fw/mkafn065ggwijx1hi/samples/x4s/h/samples/WB + p5t/apxosa/samples/evlp0/Samples/ j5tvlb + 9fx + Memory + 4oubahhj4xrcc/memory/FIB/d + memory/hour/h/memory + Memory + acjj1c50 + memory/d + memory/mkqcnulphev/jp/wpgkupwo/ wcw3/jp/wakahjvllvl + SN/aaoaenusf + E/5o3 + facjvbah/X/+ on/queues + on/hquwe13tr1uf/acg3 + queues/J6/queues/egnhpc/queues /8ajjf4ucim1eyp/LF/amcb/cgcftvtd0m/8dp + firg2o2p/wcwv/jp/wakakt7eqs2zoj5y4wmh1pjp/z "; image BMP = NULL; memorystream MS = NULL; try {byte [] B = convert. frombase64string (base64string); MS = new memorystream (B); BMP = imageresize (New Bitmap (MS), 125,125); BMP. save (context. request. mappath ("logo.jpg"), imageformat. JPEG); context. response. write ("success");} catch (exception ex) {context. response. write ("Failure:" + ex. message. tostring ();} finally {BMP. dispose (); Ms. dispose ();}} /// <summary> /// modify the image size /// </Summary> /// <Param name = "imgsrc"> </param> /// <returns> </returns> private image imageresize (image imgsrc, int width, int height) {image newimage = imgsrc. getthumbnailimage (125,125, null, new intptr (); graphics G = graphics. fromimage (newimage); G. drawimage (newimage, 0, 0, newimage. width, newimage. height); G. dispose (); Return newimage;} public bool isreusable {get {return false ;}}}}