|
|
|
Mediablock rounded mask and dropshadow filter 12 Months ago
|
Hello Sunny; I wrote a function that sets a rounded mask and a dropshadow filter for a targeted mediablock. At runtime:
1. It automaticaly draws a rounded rectangle that matches the size of the targeted mediablock.
2. It sets it as a mask.
3. It applies a drop shadow filter.
4. You can set the corner parameter and the filter's parameters.You can see the result on the picture.  The code: | Code: : |
import flash.filters.DropShadowFilter;
function roundedMask(mediablock:MovieClip):Void {
//Rounded Corner Parameter
var corner:Number = 6;
//Dropshadow Filter Parameters
var distance:Number = 3;
var angleInDegrees:Number = 90;
var color:Number = 0x000000;
var alpha:Number = 0.8;
var blurX:Number = 6;
var blurY:Number = 6;
var strength:Number = 1;
var quality:Number = 3;
var inner:Boolean = false;
var knockout:Boolean = false;
var hideObject:Boolean = false;
//Template Function
var n:Number = mediablock._parent.getNextHighestDepth();
var w:Number = mediablock._width;
var h:Number = mediablock._height;
var mask_mc:MovieClip = mediablock._parent.createEmptyMovieClip("rounded_mask"+n, mediablock._parent.getNextHighestDepth());
mask_mc._x = mediablock._x;
mask_mc._y = mediablock._y;
mask_mc.moveTo(corner,0);
mask_mc.lineStyle(0,0,0);
mask_mc.beginFill(0,100);
mask_mc.lineTo(w-corner,0);
mask_mc.curveTo(w,0,w,corner);
mask_mc.lineTo(w,h-corner);
mask_mc.curveTo(w,h,w-corner,h);
mask_mc.lineTo(corner,h);
mask_mc.curveTo(0,h,0,h-corner);
mask_mc.lineTo(0,corner);
mask_mc.curveTo(0,0,corner,0);
mask_mc.endFill();
mediablock.setMask(mask_mc);
var filter:DropShadowFilter = new DropShadowFilter(distance, angleInDegrees, color, alpha, blurX, blurY, strength, quality, inner, knockout, hideObject);
var filterArray:Array = new Array();
filterArray.push(filter);
mediablock.filters = filterArray;
}
roundedMask(home_picture);
|
I was wondering, is there a way to make it work for mediablocks inserted with the new flashText editor?
Or is there a way to edit the Mediablock component to automatically set the rounded mask for all its instances on stage? |
|
|
|
|
|
|
The administrator has disabled public write access.
|
|
|
|
Re:Mediablock rounded mask and dropshadow filter 12 Months ago
|
Nice! Yes you can easily tell Flashblocks to process all instances of Mediablocks by setting the flashblocks.Mediablock.OnComplete function like this. | Code: : |
flashblocks.Mediablock.OnComplete = function (obj) {
roundedMask(obj.target);
}
|
You can see other examples of this in the demo site, on frame 2, layer, "Mediablock". |
|
|
|
|
|
|
The administrator has disabled public write access.
|
|
|
|
Re:Mediablock rounded mask and dropshadow filter 12 Months ago
|
I made some simple adjustments to your code, placing the mask inside of the Mediablock instance. This way when the Mediablock is removed from the stage so will the mask be removed and setting the x and y are no longer necessary so animation is more natural. | Code: : |
import flash.filters.DropShadowFilter;
function roundedMask(mediablock:MovieClip):Void {
//Rounded Corner Parameter
var corner:Number = 6;
//Dropshadow Filter Parameters
var distance:Number = 3;
var angleInDegrees:Number = 90;
var color:Number = 0x000000;
var alpha:Number = 0.8;
var blurX:Number = 6;
var blurY:Number = 6;
var strength:Number = 1;
var quality:Number = 3;
var inner:Boolean = false;
var knockout:Boolean = false;
var hideObject:Boolean = false;
//Template Function
var w:Number = mediablock._width;
var h:Number = mediablock._height;
var mask_mc:MovieClip = mediablock.createEmptyMovieClip("rounded_mask", 2);
mask_mc.moveTo(corner,0);
mask_mc.lineStyle(0,0,0);
mask_mc.beginFill(0,100);
mask_mc.lineTo(w-corner,0);
mask_mc.curveTo(w,0,w,corner);
mask_mc.lineTo(w,h-corner);
mask_mc.curveTo(w,h,w-corner,h);
mask_mc.lineTo(corner,h);
mask_mc.curveTo(0,h,0,h-corner);
mask_mc.lineTo(0,corner);
mask_mc.curveTo(0,0,corner,0);
mask_mc.endFill();
mediablock.setMask(mask_mc);
var filter:DropShadowFilter = new DropShadowFilter(distance, angleInDegrees, color, alpha, blurX, blurY, strength, quality, inner, knockout, hideObject);
var filterArray:Array = new Array();
filterArray.push(filter);
mediablock.filters = filterArray;
}
|
Once again, I just confirmed that placing your function call inside of the flashblocks.Mediablock.OnComplete function will indeed apply the filters and mask to every Mediablock.
| Code: : |
flashblocks.Mediablock.OnComplete = function (obj:Object) {
roundedMask(obj.target);
}
|
Great work - looks good! |
|
|
|
|
|
|
Last Edit: 2008/01/10 08:27 By admin.
|
|
|
The administrator has disabled public write access.
|
|
|
|
Re:Mediablock rounded mask and dropshadow filter 11 Months, 3 Weeks ago
|
|
Very Clever Guys, gold star on the fridge!
Thanks for shareing
Uni-Boy
|
|
|
|
|
|
|
The administrator has disabled public write access.
|
|
|
|
Re:Mediablock rounded mask and dropshadow filter 4 Months, 1 Week ago
|
|
Im a new one here, so hello.
One question and quite a dumb one, where do you insert this code to make it work?
Cheers
Fab
|
|
|
|
|
|
|
The administrator has disabled public write access.
|
|
|
|
Re:Mediablock rounded mask and dropshadow filter 4 Months, 1 Week ago
|
|
it will work most anywhere but I would place this code on the same on the root and on the same frame as your main Flashblocks component.
|
|
|
|
|
|
|
The administrator has disabled public write access.
|
|
Favoured: 0
