Coloring regions of images

[Flep]

In this tutorial we see how to color the sections of an image using the method floodFill() of the BitmapData class of Actionscript 3.0.

This method works almost like magic wand tool in Photoshop (or other photo editor) with a setting of zero tolerance.

It fills in all contiguous regions of the same pixel color with the specified color.

This method allows us to create such an application of coloring and much more.

The example that I created works with an external black and white GIF image.

The image has been loaded into Flash and with a ColorPicker component, check the color you will use to fill in certain areas of the image.

For example, choose a color and click to image's area.

Actionscript

package
{
	import flash.display.*;
	import flash.events.*;
	import flash.net.*;
	import flash.geom.*;
	
	public class Main extends MovieClip
	{
		private var bitmap:Bitmap;
		private var bitmapdata:BitmapData;
		
		private var holder_mc:MovieClip;
		
		private var current_color:uint=0;
		
		public function Main()
		{
			addEventListener(Event.ADDED_TO_STAGE,init);
		}
		
		private function init(evt:Event):void
		{
			removeEventListener(Event.ADDED_TO_STAGE,init);
			
			reset_btn.label="RESET";
			
			loadImage();
		}
		
		private function loadImage():void
		{
			if(holder_mc!=null)
			{
				removeChild(holder_mc);
				bitmapdata.dispose();
				bitmap=null;
				holder_mc=null;
			}
			var request:URLRequest=new URLRequest("jerry.gif");
			var loader:Loader=new Loader();
			loader.contentLoaderInfo.addEventListener(Event.COMPLETE,onImageLoaded);
			loader.load(request);
		}
		
		private function onImageLoaded(evt:Event):void
		{
			bitmap=evt.target.loader.content as Bitmap;
			bitmapdata=bitmap.bitmapData;
			holder_mc=new MovieClip();
			holder_mc.addChild(bitmap);
			addChild(holder_mc);
			
			addListeners();
		}
		
		private function addListeners():void
		{
			color_picker.addEventListener(Event.CHANGE,onColorChange);
			
			holder_mc.mouseChildren=false;
			//holder_mc.buttonMode=true;
			holder_mc.addEventListener(MouseEvent.MOUSE_DOWN, paint);
			
			reset_btn.addEventListener(MouseEvent.MOUSE_DOWN,reset);
		}
		
		private function onColorChange(evt:Event):void
		{
			current_color=evt.target.selectedColor;
		}
		
		private function paint(evt:MouseEvent):void
		{
			var xx:Number=evt.localX;
			var yy:Number=evt.localY;
			bitmapdata.floodFill(xx,yy,current_color);
		}
		
		private function reset(evt:MouseEvent):void
		{
			loadImage();
		}
	}
}

Source files:

[mikyun_patel13]

thanks
this one is great

[yasdar2002]

Hi nice work
ls I want to understand why when I use your file jerry.gif everything work very well , but if i use one of my image (gif, jpeg or png) , the flash doesn't work very well ?
Thanks
Untitled.png

[davis123]

Flash web development services of this Flash development company constitute the following:

Multi layered business solutions for small, medium and large enterprises.
Original and creative Flash designs that attract and engage visitors
Effective Flash software development and rich multimedia solutions to present clients successfully to their target customers
Brand positioning, promotion and growth through effective designs that pull traffic and facilitate client conversion


flash web development company