代码之家 › 专栏 › 技术社区 › Andy Moore

在AS3中缩放阴影的最佳方法?

filter actionscript-3 flash

Andy Moore · 技术社区 · 15 年前

我正在创建一个Flash应用程序,它既利用了Dropshadow过滤器,又利用了各种精灵的缩放。

这就是谎言 the problem :

此过滤器支持阶段缩放。但是,它不支持一般缩放、旋转和倾斜。如果对象本身被缩放(如果scalex和 scaley被设置为除 1.0),过滤器未缩放。

偶然的是,缺少旋转支持对我有利,但我真的非常需要缩放才能工作。最好的方法是什么?

我可以扩展Dropshadow对象并“使其”更新吗?

我要做我自己的自定义对象,只是用一个新的距离值重新创建自己,以匹配缩放级别吗?

什么是最好的使用方法(考虑性能)?

3 回复 | 直到 11 年前

Marty 11 年前

考虑到性能,您可以使用 Bitmap 并绘制原始大小的容器及其 DropShadowFilter 在上面。这样,过滤器将缩放和 flash甚至不需要重新计算投影的渲染。

例子:

// We need to use this container as the source for the Bitmap.
var sample:Sprite = new Sprite();


// Sample object with DropShadowFilter applied.
var rect:Sprite = new Sprite();
rect.x = rect.y = 10;
rect.graphics.beginFill(0xCC0000);
rect.graphics.drawRect(0, 0, 50, 50);
rect.graphics.endFill();
rect.filters = [new DropShadowFilter()];
sample.addChild(rect);


// Create our Bitmap.
var bitmap:Bitmap = new Bitmap();

bitmap.x = bitmap.y = 100;
bitmap.bitmapData = new BitmapData(sample.width + 20, sample.height + 20, true);
bitmap.bitmapData.draw(sample);
bitmap.scaleX = bitmap.scaleY = 0.5;

addChild(bitmap);

Triynko 11 年前

由于过滤器不能缩放,其参数值必须始终对应于像素单位。因此,您只需将过滤器值缩放为与对象相同的值。为此,只需将对象坐标系中的单位向量(长度=1)转换为全局坐标系,该距离将成为对象过滤器的全局比例因子。

每次移动或缩放对象时,都要更改应缩放和重新应用过滤器的任何过滤器值。下面是一个示例文档类,它显示了一个带有发光和投影过滤器的正方形,并且它嵌套在另一个已缩放的容器中。我还添加了一个调整舞台大小的监听器来保持舞台中央的正方形。

将其粘贴到新文档主时间线上的操作中并运行它。请注意,放置阴影的距离和大小比例,以及辉光过滤器的模糊比例。你甚至可以添加数学来解释当你有不同的X和Y模糊值时的旋转。

import flash.display.Sprite;
import flash.filters.GlowFilter;
import flash.events.Event;
import flash.display.StageScaleMode;
import flash.utils.getTimer;
import flash.geom.Point;
import flash.filters.DropShadowFilter;

//Fix the scale of the stage
stage.scaleMode = flash.display.StageScaleMode.NO_SCALE;
stage.frameRate = 60;

//Create a small green square centered at the origin
var r:Sprite = new Sprite();
r.graphics.beginFill( 0x00ff00 );
r.graphics.drawRect( -5, -5, 10, 10 );
r.graphics.endFill();

//Nest it in a container
var container:Sprite = new Sprite();
container.addChild( r )
addChild( container );

//Apply a glow filter
var GLOW_BLUR:Number = 10;
var SHADOW_DIST:Number = 5;
var SHADOW_BLUR:Number = 2;
var dropshadow:DropShadowFilter = new DropShadowFilter( SHADOW_DIST, 45, 0, 1, SHADOW_BLUR, SHADOW_BLUR, 1, 3 ); //new GlowFilter( 0x000000, 0.5, GLOW_BLUR, GLOW_BLUR, 2, 3 );
var glow:GlowFilter = new GlowFilter( 0x0000ff, 1, GLOW_BLUR, GLOW_BLUR, 1, 3 ); //new GlowFilter( 0x000000, 0.5, GLOW_BLUR, GLOW_BLUR, 2, 3 );
r.filters = [glow,dropshadow];

addEventListener( Event.ENTER_FRAME, enterFrame, false, 0, true );
addEventListener( Event.RESIZE, stageResized, false, 0, true );
var t:int = getTimer();
stageResized( null );
function enterFrame( e:Event ):void
{
    var cycle_length:Number = 2000;
    var cycle:Number = (((getTimer() - t) % cycle_length) / cycle_length) * Math.PI * 2.0;
    var scale:Number = 2 + Math.sin( cycle );
    r.scaleX = r.scaleY = scale;
    container.scaleX = container.scaleY = scale * 2;
    container.rotation = cycle / (Math.PI / 180);

    var p0:Point = new Point( 0, 0 );
    var p1:Point = new Point( 1, 0 );
    p0 = r.localToGlobal( p0 );
    p1 = r.localToGlobal( p1 );
    var globalScale:Number = Point.distance( p0, p1 );

    dropshadow.blurX = dropshadow.blurY = SHADOW_BLUR * globalScale;
    dropshadow.distance = SHADOW_DIST * globalScale;
    glow.blurX = glow.blurY = GLOW_BLUR * globalScale;
    r.filters = [glow,dropshadow];
}
function stageResized( e:Event ):void
{
    container.x = (stage.stageWidth / 2);
    container.y = (stage.stageHeight / 2);
}

-1

Alexandru 15 年前

我使用的是这样的投影滤镜,缩放、旋转、倾斜效果很好:

var localFilters :Array = new Array();
localFilters.push( dropShadowFilter );

component.filters = localFilters;

之后,如果您这样做,例如:

var m:Matrix = new Matrix();
m.scale( 1.5, 2 );

component.transform.matrix = m;

将缩放Dropshadow过滤器。