FLASH :: Flash AS3 face detection and recognition library

Today I am showing you a nice AS3 library which allows face detection and recognition in a photo. I already blogged about a similar topic in PHP face detection class post, but this time we’ll work with AS3 and face recognition.
You may say: is there a difference between face detection and face recognition? Or are you just using these words randomly?
There is a slight difference, let me explain:
Face detection looks for some features which distinguish an human face from the rest of stuff in a photograpy: usually when we have a pair of eyes, nose, and a mouth we may say we are in front of a face (ok, I made it a bit simpler than it really is, but this is the concept behind it). Let’s think about the Facebook tag option when you upload a new photo.
Face recognition looks for A SPECIFIC face in a photo, just like cameras in an airport looking for some most wanted terrorist faces. With some tweakings, face recognition can be used as face detection.
Oskar Wicha’s ActionScript 3 library allow us to do both things using Eigenfaces concept, basically some patterns which should match a human face.
The following script wants the path of an image in the input text at the bottom of the stage and once you click anywhere, it loads the image and places a tag on any face it recognizes.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68

package { import flash.display.Sprite; import flash.display.Loader; import flash.net.URLRequest; import flash.geom.Rectangle; import flash.text.TextField; import flash.text.TextFieldType; import flash.events.MouseEvent; // classes to import import com.oskarwicha.images.FaceDetection.FaceDetector; import com.oskarwicha.images.FaceDetection.Events.FaceDetectorEvent; public class Main extends Sprite { // face detector constructor private var detector:FaceDetector; private var imageCanvas:Sprite=new Sprite(); private var tagCanvas:Sprite=new Sprite(); private var urlText:TextField = new TextField(); public function Main() { addChild(imageCanvas); addChild(tagCanvas); urlText.type=TextFieldType.INPUT; urlText.border=true; urlText.background=true; urlText.backgroundColor=0xFFFFFF; urlText.x=10; urlText.y=450; urlText.width=620; urlText.height=20; urlText.text="http://i1.tribune.com.pk/wp-content/uploads/2011/06/twilight-640x480.jpg"; addChild(urlText); stage.addEventListener(MouseEvent.CLICK,loadImage); loadImage(null); } private function loadImage(e:MouseEvent):void { while (imageCanvas.numChildren>0) { imageCanvas.removeChildAt(0); } tagCanvas.graphics.clear(); var imageLoader:Loader = new Loader(); var loader:Loader = new Loader(); loader.load(new URLRequest(urlText.text)); imageCanvas.addChild(loader); detector=new FaceDetector(); // loading face image from an url. use loadFaceImageFromBitmap if you want to load it from a bitmap   detector.loadFaceImageFromUrl(urlText.text); // listener which will be called each time a face will be detected.; // with EACH TIME I mean if two faces are detected, callback function will be called twice detector.addEventListener(FaceDetectorEvent.FACE_CROPPED,facesDetected); // listener which will be called when no faces are detected; detector.addEventListener(FaceDetectorEvent.NO_FACES_DETECTED,noFacesDetected); } private function facesDetected(e:FaceDetectorEvent):void { imageCanvas.alpha=1; // faces detected are stored in an array of rectangles var facesDetected:Array=detector.objectDetector.detected; for (var i:Number=0; i<facesDetected.length; i++) { tagCanvas.graphics.lineStyle(2,0xFF0000); tagCanvas.graphics.beginFill(0x000000,0.2); var faceRectangle:Rectangle=facesDetected[i]; tagCanvas.graphics.drawRect(faceRectangle.x,faceRectangle.y,faceRectangle.width,faceRectangle.height); tagCanvas.graphics.endFill(); } } private function noFacesDetected(e:FaceDetectorEvent):void { imageCanvas.alpha=0.5; } } }

And you will get something like that:

It’s just an image because I cannot load external image due to cross domain policy, but try it by yourself, just enter an url and click with the mouse anywhere we running your Flash IDE
Remember that face detection and recognition could be no that accurate, so in some cases it will miss faces, in some other cases it will detect false positive faces.
Download the source code with the library and a zipped file with Eigenfaces data which must be placed in the same folder of your main file. Also, you’ll probably have to customize the path to your FaceRecognitionLib.swc library.