psykopath on DeviantArthttp://creativecommons.org/licenses/by-nc-sa/3.0/https://www.deviantart.com/psykopath/art/BitmapData-tutorial-47892266psykopath

Deviation Actions

psykopath's avatar

BitmapData tutorial

By
Published:
1.2K Views

Description

EDITL I've edited the swf so now pressing any key should swap the filter between blur, highlight, and fade. I havent added this script into the description.

Was helping ~awesty with this, so here it is for everybody.Its not fancy, and cheaply commented, but hopefully someone can learn something from it.

//START COPYING HERE
//Import to let you use the classes
import flash.display.*
import flash.filters.*
import flash.geom.*
//Create and show the bitmap
var bmp:BitmapData = new BitmapData(550, 400, true, 0xFF000000)
var bmpholder:MovieClip = createEmptyMovieClip("bmpholder", 1)
bmpholder.attachBitmap(bmp, 1)

//Convolution Filter is kind of like blur
//The numbers 3 are the dimensions of the matrix, then there is
//a matrix with 9 bits. See the matrix has 9 bits, and the dimentsions are 3 by 3.
//Im not quite sure how to make other numbers work, but this basic
//setup works really well.
//The last number (9) is the divisior. if it is the same as ur matrix
//length then u get a blur effect. Lower number make it get brighter
//and higher number make it fade out
//So, 8.9 makes it get brighter, 9 is blur, and 9.2 is fade
var convo:ConvolutionFilter = new ConvolutionFilter(3, 3, [1,1,1,1,1,1,1,1,1], 8.9)

//Now makew the holder and two squares
var clipholder:MovieClip = createEmptyMovieClip("clipholder", 2)
var square:MovieClip = clipholder.createEmptyMovieClip("square", 1)
//draw the square
square.beginFill(0xFF0000, 50)
square.moveTo(-12, -12)
square.lineTo(12, -12)
square.lineTo(12, 12)
square.lineTo(-12, 12)
square.endFill()
square.xv = 4
square.yv = 2
square.onEnterFrame = function() {
    this._x += this.xv
    this._y += this.yv
    if (this._x>550 || this._x<0) {
        this.xv *= -1
    }
    if (this._y>400 || this._y<0) {
        this.yv *= -1
    }
    bmp.draw(clipholder)
    //this next line applies the filter.
    bmp.applyFilter(bmp, bmp.rectangle, new Point(0,0), convo)
}
var square2:MovieClip = clipholder.createEmptyMovieClip("square2", 2)
//draw the square
square2._x = 500
square2.beginFill(0x0066DD, 50)
square2.moveTo(-12, -12)
square2.lineTo(12, -12)
square2.lineTo(12, 12)
square2.lineTo(-12, 12)
square2.endFill()
square2.xv = -4
square2.yv = 2
square2.onEnterFrame = function() {
    this._x += this.xv
    this._y += this.yv
    //Bounce off the edges
    if (this._x>550 || this._x<0) {
        this.xv *= -1
    }
    if (this._y>400 || this._y<0) {
        this.yv *= -1
    }
    bmp.draw(clipholder)
    //this next line applies the filter.
    bmp.applyFilter(bmp, bmp.rectangle, new Point(0,0), convo)
}

//What is happening here actually isnt good.

//See how the onEnterFrame for both squares is applying the filter,
//this means the filter is applied twice. A better way to di it is just make the
//last object drawn call the filter.
//STOP COPYING NOW

That all works prefectly fine, if it doesnt then youve done something wrong. Note: The bitmapData class is only for Flash 8 and up.
Image size
550x400px 775 B
Comments15
Join the community to add your comment. Already a deviant? Log In
stephenchong318's avatar
fantastic and nice hehe