Question

我一直在寻找渐变蒙版来为我在AS3中绘制的一些形状的边缘添加羽毛/模糊效果（仅使用代码），但我需要它来处理正方形/矩形以及圆形。

是否有任何类型的矩阵允许这种类型的转换？我真的可以使用一些指导。

目标是保持文件大小不变，这意味着我不想添加任何PNG用作掩码。

提前致谢。

[编辑]

我已经使用了我正在使用的代码来绘制形状，并且我正在尝试为每个形状添加一个羽状边缘（除了情况3和4，我试图用不同的方式绘制形状产品类型）变量 imageCont 是我试图掩盖的图像的容器。但我似乎无法在圆形/椭圆形或矩形上放置羽毛边缘。

public function drawMask (drawI:int, clipWidth:int, clipHeight:int) {

        var maskingShape:Shape = new Shape();
        this.addChild(maskingShape);
        maskingShape.x = 0;
        maskingShape.y = 0;

        var matr:Matrix = new Matrix();
        var colors:Array = [0xFFFFFF, 0xFFFFFF];
        var alphas:Array = [1, 0];
        var ratios:Array = [200,255];
        matr.createGradientBox( clipWidth, clipHeight );

        //Calculate the positions automatically so they're centered
        var centerX = 250 - (clipWidth / 2);
        var centerY = 250 - (clipHeight / 2);

        maskingShape.graphics.lineStyle();
        //Only draw what we wanted..
        switch ( drawI ) {
            case 1:
                showBalloonApp();
                maskingShape.graphics.beginGradientFill ( GradientType.RADIAL, colors, alphas, ratios, matr );
                maskingShape.graphics.drawEllipse ( centerX, centerY, clipWidth, clipHeight );
            break;
            case 2:
                showBalloonApp();
                maskingShape.graphics.beginGradientFill ( GradientType.RADIAL, colors, alphas, ratios, matr );
                maskingShape.graphics.drawRoundRect ( centerX, centerY, clipWidth, clipHeight, 100, 100 );
            break;
            case 3:
                hideBalloonApp();
                //verticle shadow
                maskingShape.graphics.beginFill ( 0x3B3B3B, 0.65 );
                maskingShape.graphics.drawRect ( ( centerX + clipWidth - 30 ), centerY, 30, clipHeight );
                maskingShape.graphics.endFill();
                //horizontal shadow
                maskingShape.graphics.beginFill ( 0x3B3B3B, 0.65 );
                maskingShape.graphics.drawRect ( centerX, ( centerY + clipHeight - 30 ), clipWidth, 30 );
                maskingShape.graphics.endFill();
                //rectangle
                maskingShape.graphics.drawRect ( centerX, centerY, clipWidth, clipHeight );
            break;
            case 4:
                hideBalloonApp();
                //verticle shadow
                maskingShape.graphics.beginFill ( 0x3B3B3B, .65 );
                maskingShape.graphics.drawRect ( ( centerX + clipWidth - 20 ), centerY, 20, clipHeight );
                maskingShape.graphics.endFill();
                //horizontal shadow
                maskingShape.graphics.beginFill ( 0x3B3B3B, .65 );
                maskingShape.graphics.drawRect ( centerX, ( centerY + clipHeight - 20 ), clipWidth, 20 );
                maskingShape.graphics.endFill();
                //rectangle
                maskingShape.graphics.drawRect ( centerX, centerY, clipWidth, clipHeight );
            break;
            default:
                showBalloonApp( );
                maskingShape.graphics.beginGradientFill ( GradientType.RADIAL, colors, alphas, ratios, matr );
                maskingShape.graphics.drawEllipse ( centerX, centerY, clipWidth, clipHeight );
            break;
        }
        //End the filling process
        maskingShape.graphics.endFill ( );

        //Cache them as Bitmap items
        imageCont.cacheAsBitmap = true;
        maskingShape.cacheAsBitmap = true;

        //Apply the mask
        imageCont.mask = maskingShape;
    }

Answer 1

由于你没有提供你所尝试的任何代码或信息，所以知道如何回答有点困难，所以我将从一些基础知识开始 - 掩码和蒙版的DisplayObject都有在这个原理图代码的行中是渐变掩码的位图：

gradientMask.cacheAsBitmap = true;
drawing.cacheAsBitmap = true;
drawing.mask = gradientMask;

ActionScript 3羽毛矢量

1 个答案: