Flash tutorial to create glow effect using actionscript

In this tutorial,  with the help of actionscript, we shall draw a star, fill color to it and provide outer glow to the same. We shall also include actionscript event to change glow color.

Select frame 1 and paste the below code in the actions window.

import flash.filters.GlowFilter;

var mc:MovieClip = createglowstar("glowstarColor");
mc.onRelease = function()
{
var filter:GlowFilter = this.filters[0];
filter.color = 0x3399FF;
this.filters = new Array(filter);
}
function createglowstar(name:String):MovieClip
{
var art:MovieClip = this.createEmptyMovieClip(name, this.getNextHighestDepth());
var w:Number = 100;
var h:Number = 100;
art.beginFill(0xf7f7f7);
art.lineTo(100, 0);
art.lineTo(150, -100);
art.lineTo(200, 0);
art.lineTo(300, 0);
art.lineTo(200, 50);
art.lineTo(250, 150);
art.lineTo(150, 75);
art.lineTo(50, 150);
art.lineTo(100, 50);
art.lineTo(0, 0);
art._x = 50;
art._y = 150; 

var filter:GlowFilter = new GlowFilter(0xccaa00, .8, 16, 16, 5, 5, false, false);
var filterArray:Array = new Array();
filterArray.push(filter);
art.filters = filterArray;
return art;

}

Press Ctrl+Enter to view Glow effect.

Explanation to the code above

First and foremost we will need to import flash.filters package which contains classes for the bitmap filter effects

import flash.filters.GlowFilter;


Next, lets define a variable for movieclip and draw a star and add glow effect to the same. If you are not familiar with actionscript drawing, please go through my drawing tutorial before you proceed.

var mc:MovieClip = createglowstar("glowstarColor");
function createglowstar(name:String):MovieClip
{
var art:MovieClip = this.createEmptyMovieClip(name, this.getNextHighestDepth());
var w:Number = 100;
var h:Number = 100;
art.beginFill(0xf7f7f7);
art.lineTo(100, 0);
art.lineTo(150, -100);
art.lineTo(200, 0);
art.lineTo(300, 0);
art.lineTo(200, 50);
art.lineTo(250, 150);
art.lineTo(150, 75);
art.lineTo(50, 150);
art.lineTo(100, 50);
art.lineTo(0, 0);
art._x = 50;
art._y = 150; 

var filter:GlowFilter = new GlowFilter(0xccaa00, .8, 16, 16, 5, 5, false, false);
var filterArray:Array = new Array();
filterArray.push(filter);
art.filters = filterArray;
return art;

}


Now right below movieclip variable let add event to change glow filter color

mc.onRelease = function()
{
var filter:GlowFilter = this.filters[0];
filter.color = 0x3399FF;
this.filters = new Array(filter);
}


I hope you enjoyed this tutorial. Please do write to me if you have any query.

Tags: Glow effect in flash, actionscript filters, Glow in as2, Flash glow effect at runtime,

Download free Photo Gallery Download Free Photo Gallery

You can download Imajine's Scrapbook Photo Gallery absolutely free of cost and to customize , you need no knowledge of Adobe Flash.  Click here to view Scrapbook Photo Gallery / download

Bookmark and Share

ABOUT IMAJINE

Team Imajine is a good mix of design and code –with an eye for detail and strong belief in accessibility and usability. We are a web design and development boutique firm focusing on generating a strong online presence and visibility for our customers.

Apart from web design, logo design, content management systems, print and web development services, Imajine’s creative portfolio extends to photography, game programming and tutorial development (CSS3, HTML5, illustrator, Adobe Fireworks, Adobe Photoshop and Adobe Flash).

Leveraging on latest web technologies, we at Imajine adopt a progressive approach to design, develop and innovate affordable solutions with increased returns and enhanced business perceptions.

Looking for affordable web solutions? Contact Imajine to initiate a discussion on your web requirements.

jayanthi.varma@imajine.in  |  © 2008 - 2012 Imajine.