• AS3 CookBook学习整理(九)


    1. 改变色彩

    新红色值 = (旧红色值 * redMultiplier) + redOffset

    新绿色值 = (旧绿色值 * greenMultiplier) + greenOffset

    新蓝色值 = (旧蓝色值 * blueMultiplier) + blueOffset

    新Alpha值 = (旧Alpha 值 * alphaMultiplier) + alphaOffset

    multiplier属性(redMultiplier, greenMultiplier, blueMultiplier, 和alphaMultiplier) 范围都在0到1,默认值为1

    package {
     import flash.display.Shape;
     import flash.display.Sprite;
     import flash.geom.ColorTransform;
     public class Sample0422 extends Sprite
     {
      public function Sample0422()
      {
       var rect:Shape = new Shape();
       rect.graphics.beginFill(0xFF0000);
       rect.graphics.drawRect(100,100,150,100);
       rect.graphics.endFill();
       this.addChild(rect);
       
       var ct:ColorTransform = rect.transform.colorTransform;
       ct.redMultiplier = 0.2;
       ct.greenMultiplier = 1;
       ct.blueMultiplier = 1;
       rect.transform.colorTransform = ct;
       //rect.transform.colorTransform = new ColorTransform(); //重置为默认值 
      }
     }
    }

    2. Matrix的用法

    构造函数是Matrix(a, b, c, d, tx, ty),默认值是Matrix(1, 0, 0, 1, 0, 0)

    a -- 在x轴方向的缩放(即乘以这个数值后得到新坐标位置)

    b -- 在y轴的倾斜度

    c -- 在x轴的倾斜度

    d -- 在y轴方向的缩放

    tx -- 沿x轴的平移量

    ty -- 沿y轴的平移量

    计算公式:

    新的X坐标 = a * X + c * Y + tx;

    新的Y坐标 = b * X + d * Y + ty;

    package {
     import flash.display.LineScaleMode;
     import flash.display.Sprite;
     import flash.events.MouseEvent;
     import flash.geom.Matrix;
     [SWF(width="800", height="600", backgroundColor="#ffffff")]
     public class Sample0506 extends Sprite
     {
      private var matrix:Matrix = new Matrix(1,0,0,1,0,0);
      private var count:Number = 1;
      public function Sample0506()
      {
       //参照 
       var rect1:Sprite = new Sprite();
       rect1.graphics.lineStyle(1,0x000000);
       rect1.graphics.beginFill(0x0000FF);
       rect1.graphics.drawRect(0,0,100,20);
       
       var rect2:Sprite = new Sprite();
       rect2.graphics.lineStyle(1,0x000000);
       rect2.graphics.beginFill(0x00FF00);
       rect2.graphics.drawRect(0,10,200,20);
       
       //matrix 
       var rect:Sprite = new Sprite();
       rect.graphics.lineStyle(1,0x000000,1,false,LineScaleMode.NONE);
       rect.graphics.beginFill(0xCCCCCC);
       rect.graphics.drawRect(0,30,100,20);   
       rect.addEventListener(MouseEvent.CLICK,onClick);
       
       var bigSprite:Sprite = new Sprite();
       bigSprite.addChild(rect1);
       bigSprite.addChild(rect2);
       bigSprite.addChild(rect);
       bigSprite.x = 100;
       bigSprite.y = 100;
       this.addChild(bigSprite);
      }
      
      private function onClick(event:MouseEvent):void
      {
       count = count + 1;
       var sprite:Sprite = event.target  as  Sprite;
       matrix.a = count; 
       //matrix.b = count;
       //matrix.ty = count; 
       sprite.transform.matrix = matrix;
      }
     }
    }

    有几个现有的方法,能方便的实现平移、缩放及旋转

    平移 -- translate(tx, ty)

    缩放 -- scale(a, d)

    旋转 -- rotate(q),例如旋转90度,是rotate((90/180)*Math.PI); 需要注意的是,旋转点始终在父容器的左上角

    而要实现倾斜,则只能设置b和c的值,b属性表示斜角沿 y 轴的正切;c属性表示斜角沿 x 轴的正切

    下面的例子演示了旋转

    package {
     import flash.display.LineScaleMode;
     import flash.display.Sprite;
     import flash.events.Event;
     import flash.geom.Matrix;
     [SWF(width="800", height="600", backgroundColor="#ffffff")]
     public class Sample0506 extends Sprite
     {
      private var rect:Sprite;
      
      public function Sample0506()
      {
       rect = new Sprite();
       rect.graphics.lineStyle(1,0x000000,1,false,LineScaleMode.NONE);
       rect.graphics.beginFill(0xCCCCCC);
       rect.graphics.drawRect(-50,-100,100,200);
       
       var bigSprite:Sprite = new Sprite();
       bigSprite.addChild(rect);
       bigSprite.x = 300;
       bigSprite.y = 300;
       bigSprite.graphics.beginFill(0xFFFF00);
       bigSprite.graphics.drawRect(0,0,200,200);
       bigSprite.graphics.endFill();  
       this.addChild(bigSprite);
       
       stage.addEventListener(Event.ENTER_FRAME,onEnter);
      }
      
      private function onEnter(event:Event):void
      {
       var tmpMatrix:Matrix = rect.transform.matrix;
       tmpMatrix.rotate((30/180)*Math.PI);
       rect.transform.matrix = tmpMatrix;
      }
     }
    }

    3. 阴影滤镜(DropShadowFilter)

    DropShadowFilter(

    distance:Number = 4,

    angle:Number = 45,

    color:uint = 0,

    alpha:Number = 1,

    blurX:Number = 4,

    blurY:Number = 4,

    strength:Number = 1,

    quality:int = 1,

    inner:Boolean = false,

    knockout:Boolean = false,

    hideObject = false

    )

    参数说明:

    distance -- 阴影的深度。默认为4,以像素为单位

    angle -- 阴影的角度。默认为45°,范围为0°-360°

    color -- 阴影的颜色。默认为0(黑色)

    alpha -- 阴影颜色的Alpha值。默认为1,范围为0 - 1

    blurX -- 水平模糊量。默认为4,范围为0 - 255(浮点)

    blurY -- 垂直模糊量。默认为4,范围为0 - 255(浮点)

    strength -- 压印的力度。值越大颜色越深,而且阴影与背景之间的对比度也越强,范围为0 - 255

    quality -- 应用滤镜的次数。默认值为1(BitmapFilterQuality.LOW),与应用一次滤镜等效。BitmapFilterQuality.MEDIUM 两次应用滤镜;值BitmapFilterQuality.HIGH 三次应用滤镜。 滤镜的值越小,呈现速度越快。

    inner -- 阴影是否为内侧阴影。值为true表明是内侧阴影,默认为false,即外侧阴影(对象外缘周围的阴影)

    knockout -- 是否应用挖空效果。为true将使对象的变为透明,并显示文档的背景颜色。默认值为false(不应用挖空效果)

    hideObject -- 是否隐藏对象(只显示阴影)。为true表示没有绘制对象本身,只有阴影是可见的。默认值为false(显示对象)

    4. 模糊滤镜(BlurFilter)

    BlurFilter(

    blurX:Number = 4,

    blurY:Number = 4,

    quality:int = 1

    )

    参数说明:

    blurX -- 水平模糊量。默认为4,范围为0 - 255(浮点),2的乘方值(如2、4、8、16和32)经过优化,呈现速度比其它值更快

    blurY -- 垂直模糊量。默认为4,范围为0 - 255(浮点),2的乘方值(如2、4、8、16和32)经过优化,呈现速度比其它值更快

    quality -- 应用滤镜的次数。默认值为1(BitmapFilterQuality.LOW),与应用一次滤镜等效。BitmapFilterQuality.MEDIUM 两次应用滤镜;值BitmapFilterQuality.HIGH 三次应用滤镜。 滤镜的值越小,呈现速度越快。

    5. 光晕滤镜(GlowFilter)

    使用GlowFilter类可以对显示对象应用发光效果。有多个用于发光样式的选项,包括内侧发光或外侧发光以及挖空模式。 在阴影滤镜的distance和 angle 属性设置为 0 时,发光滤镜与投影滤镜极为相似。

    GlowFilter(

    color:uint = 0xFF0000,

    alpha:Number = 1,

    blurX:Number = 6,

    blurY:Number = 6,

    strength:Number = 2,

    quality:int = 1,

    inner:Boolean = false,

    knockout:Boolean = false

    )

    参数说明:

    color -- 光晕的颜色,默认为0xFF0000(红色)

    alpha -- 光晕颜色的Alpha值。默认为1,范围为0 - 1

    blurX --水平模糊量。默认为6,范围为0 - 255(浮点),2的乘方值(如2、4、8、16和32)经过优化,呈现速度比其它值更快

    blurY -- 垂直模糊量。默认为6,范围为0 - 255(浮点),2的乘方值(如2、4、8、16和32)经过优化,呈现速度比其它值更快

    strength -- 压印的力度。默认为2,范围为0 - 255,值越大颜色越深,而且阴影与背景之间的对比度也越强

    quality -- 应用滤镜的次数。默认值为1(BitmapFilterQuality.LOW),与应用一次滤镜等效。BitmapFilterQuality.MEDIUM 两次应用滤镜;值 BitmapFilterQuality.HIGH 三次应用滤镜。 滤镜的值越小,呈现速度越快。

    inner -- 光晕是否为内侧。值为true表明是内侧光晕,默认为false,即外侧光晕(对象外缘周围的光晕)

    knockout -- 是否应用挖空效果。为true将使对象的变为透明,并显示文档的背景颜色。默认值为false(不应用挖空效果)

    6. 斜角滤镜(BevelFilter)

    使用BevelFilter类对显示对象添加斜角效果。斜角效果使对象(如按钮)具有三维外观

    BevelFilter(

    distance:Number = 4,

    angle:Number = 45,

    highlightColor:uint = 0xFFFFFF,

    highlightAlpha:Number = 1,

    shadowColor:uint = 0x000000,

    shadowAlpha:Number = 1,

    blurX:Number = 4,

    blurY:Number = 4,

    strength:Number = 1,

    quality:int = 1,

    type:String = "inner",

    knockout:Boolean = false

    )

    参数说明:

    distance -- 斜角的偏移距离。默认为4,以像素为单位

    angle -- 斜角的角度。默认为45°,范围为0°-360°,角度值表示理论上的光源落在对象上的角度

    highlightColor -- 斜角的加亮颜色。默认值为0xFFFFFF。对于一个矩形,angle为45°时,为左上角的颜色

    highlightAlpha -- 加亮颜色的Alpha值。默认为1,范围为0 - 1

    shadowColor -- 斜角的阴影颜色。默认值为0x000000

    shadowAlpha -- 阴影颜色的Alpha值。默认为1,范围为0 - 1

    blurX -- 水平模糊量。默认为4,范围为0 - 255(浮点),2的乘方值(如2、4、8、16和32)经过优化,呈现速度比其它值更快

    blurY -- 垂直模糊量。默认为4,范围为0 - 255(浮点),2的乘方值(如2、4、8、16和32)经过优化,呈现速度比其它值更快

    strength -- 压印的力度。默认为1,范围为0 - 255,值越大颜色越深,而且斜角与背景之间的对比度也越强

    quality -- 应用滤镜的次数。默认值为1(BitmapFilterQuality.LOW),与应用一次滤镜等效。BitmapFilterQuality.MEDIUM 两次应用滤镜;值BitmapFilterQuality.HIGH 三次应用滤镜。 滤镜的值越小,呈现速度越快。

    type -- 斜角在对象上的位置。有效值为BitmapFilterType 常数:

    BitmapFilterType.INNER

    BitmapFilterType.OUTER

    BitmapFilterType.FULL

    默认为INNER,只显示对象内部的阴影。如果为Outer,则只显示对象外部的阴影,如果为FULL,则同时显示内部和外部的阴影

    knockout -- 是否应用挖空效果。为true将使对象的变为透明,并显示文档的背景颜色。默认值为false(不应用挖空效果)

    7. 渐变光晕滤镜(GradientGlowFilter)

    使用GradientGlowFilter类对显示对象应用渐变发光效果。渐变发光是一种非常逼真的发光效果

    GradientGlowFilter(

    distance:Number = 4,

    angle:Number = 45,

    colors:Array = null,

    alphas:Array = null,

    ratios:Array = null,

    blurX:Number = 4,

    blurY:Number = 4,

    strength:Number = 1,

    quality:int = 1,

    type:String = "inner",

    knockout:Boolean = false

    )

    distance -- 光晕的偏移距离。默认为4,以像素为单位

    angle -- 角度。默认为45°,范围为0°-360°

    colors -- 定义渐变的颜色数组

    alphas -- 颜色数组中对应颜色的Alpha值的数组

    ratios -- 颜色分布比例的数组。有效值为0 - 255

    blurX -- 水平模糊量。默认为4,范围为0 - 255(浮点),2的乘方值(如2、4、8、16和32)经过优化,呈现速度比其它值更快

    blurY -- 垂直模糊量。默认为4,范围为0 - 255(浮点),2的乘方值(如2、4、8、16和32)经过优化,呈现速度比其它值更快

    strength -- 压印的力度。默认为1,范围为0 - 255,值越大颜色越深,而且发光与背景之间的对比度也越强

    quality -- 应用滤镜的次数。默认值为1(BitmapFilterQuality.LOW),与应用一次滤镜等效。BitmapFilterQuality.MEDIUM 两次应用滤镜;值BitmapFilterQuality.HIGH 三次应用滤镜。 滤镜的值越小,呈现速度越快。

    type -- 斜角在对象上的位置。有效值为BitmapFilterType 常数:

    BitmapFilterType.INNER

    BitmapFilterType.OUTER

    BitmapFilterType.FULL

    默认为INNER,只显示对象内部的阴影。如果为Outer,则只显示对象外部的阴影,如果为FULL,则同时显示内部和外部的阴影

    knockout -- 是否应用挖空效果。为true将使对象的变为透明,并显示文档的背景颜色。默认值为false(不应用挖空效果)

    8. 渐变斜角滤镜(GradientBevelFilter)

    使用GradientGlowFilter类对显示对象应用渐变斜角效果。渐变斜角是位于对象外部、内部或顶部的使用渐变色增强的有斜面的边缘。 有斜面的边缘使对象具有三维外观

    GradientBevelFilter(

    distance:Number = 4,

    angle:Number = 45,

    colors:Array = null,

    alphas:Array = null,

    ratios:Array = null,

    blurX:Number = 4,

    blurY:Number = 4,

    strength:Number = 1,

    quality:int = 1,

    type:String = "inner",

    knockout:Boolean = false

    )

    distance -- 斜角的偏移距离。默认为4,以像素为单位

    angle -- 角度。默认为45°,范围为0°-360°

    colors -- 定义渐变的颜色数组

    alphas -- 颜色数组中对应颜色的Alpha值的数组

    ratios -- 颜色分布比例的数组。有效值为0 - 255

    blurX -- 水平模糊量。默认为4,范围为0 - 255(浮点),2的乘方值(如2、4、8、16和32)经过优化,呈现速度比其它值更快

    blurY -- 垂直模糊量。默认为4,范围为0 - 255(浮点),2的乘方值(如2、4、8、16和32)经过优化,呈现速度比其它值更快

    strength -- 压印的力度。默认为1,范围为0 - 255,值越大颜色越深,而且斜角与背景之间的对比度也越强

    quality -- 应用滤镜的次数。默认值为1(BitmapFilterQuality.LOW),与应用一次滤镜等效。BitmapFilterQuality.MEDIUM 两次应用滤镜;值BitmapFilterQuality.HIGH 三次应用滤镜。 滤镜的值越小,呈现速度越快。

    type -- 斜角在对象上的位置。有效值为BitmapFilterType 常数:

    BitmapFilterType.INNER

    BitmapFilterType.OUTER

    BitmapFilterType.FULL

    默认为INNER,对象内缘上的斜角。如果为Outer, 对象外缘上的斜角。如果为FULL,对象顶部的斜角

    knockout -- 是否应用挖空效果。为true将使对象的变为透明,并显示文档的背景颜色。默认值为false(不应用挖空效果)

    9. 使用滤镜需要注意的几点

    (1) 将滤镜数组赋值给可视化对象时,赋值的是数组拷贝而不是引用

    (2) 不能直接修改对象的filter属性,应该先取得滤镜数组,添加新滤镜,再重新赋值回去

    package {
     import flash.display.Sprite;
     import flash.filters.DropShadowFilter;
     import flash.filters.GlowFilter;
     public class Sample0508 extends Sprite
     {
      public function Sample0508()
      {
       var rect:Sprite = new Sprite();
       rect.graphics.beginFill(0xFFFF00);
       rect.graphics.drawRect(100,100,200,150);
       rect.graphics.endFill();
       
       var shadow:DropShadowFilter = new DropShadowFilter();
       rect.filters = [shadow];
       
       shadow.color = 0x0000FF;//无效
        
       var arr:Array = rect.filters;
       arr.push(new GlowFilter());
       rect.filters = arr;
       
       this.addChild(rect);
      }
     }
    }

    (3) 滤镜是一层一层叠加上去的,例如,有个滤镜数组有两个滤镜:阴影滤镜和光晕滤镜(光晕滤镜在第二个位置),当第一个滤镜应用后,第二个滤镜应用在原始对象和第一个滤镜之上。如果要让每个滤镜效果都只影响原始对象而不是叠加,可以建立若干个和原始对象相等大小和位置的可视化对象,将其它滤镜应用到这些对象上,然后将滤镜的knockout属性设置为true(用于隐藏原始图形)

    package {
     import flash.display.Sprite;
     import flash.filters.DropShadowFilter;
     import flash.filters.GlowFilter;
     public class Sample0508 extends Sprite
     {
      public function Sample0508()
      {
       var rect:Sprite = new Sprite();
       rect.graphics.beginFill(0xFFFF00);
       rect.graphics.drawRect(100,100,200,150);
       rect.graphics.endFill();
       
       var rectTemp:Sprite = new Sprite();
       rectTemp.graphics.beginFill(0xFFFF00);
       rectTemp.graphics.drawRect(100,100,200,150);
       rectTemp.graphics.endFill();
       
       rect.filters = [new GlowFilter()];
       rectTemp.filters = [new DropShadowFilter(10, 45,0, 1, 4, 4, 1, 1, false, true)];
       
       this.addChild(rect);
       this.addChild(rectTemp);
      }
     }
    }

    (4) 要清除显示对象上的滤镜效果,通过赋值一个空数组或null即可

    sampleSprite.filters = [];

    10. 角度与弧度的换算

    角度(angle)转换为弧度(radian)

    radian = angle * Math.PI / 180;

    弧度(radian)转换为角度(angle)

    angle = radian * 180 / Math.Pi;

  • 相关阅读:
    react-native 通常每个套接字地址(协议/网络地址/端口)只允许使用一次。
    Hibernate HQL和原生SQL查询的一点区别
    JPA project Change Event Handler问题解决[转]
    Webstorm2016激活码[ 转]
    [支付]微信NATIVE扫码支付JAVA实现
    jeecms附件标签用法
    Eclipse查找类路径快捷方式
    第4条:用辅助函数来取代复杂的表达式
    关于python2中的unicode和str以及python3中的str和bytes
    第2条:遵循PEP8风格指南
  • 原文地址:https://www.cnblogs.com/CoderWayne/p/1778068.html
Copyright © 2020-2023  润新知