html5直播滤镜,滤镜的集中实现 - layabox问答社区-HTML5引擎社区-LayaAir开发者社区...

感谢，仿照楼主写了个as3版本的。这里贴出来

public class FilterTest {

public function FilterTest() {

//初始化引擎

Laya.init(1110, 1110,WebGL);

//设置舞台背景色

Laya.stage.bgColor="#fffff";

//加载资源

Laya.loader.load("res/atlas/comp.json",Handler.create(this,completeLoad),null,Loader.ATLAS);

}

public function completeLoad():void

{

//原始位图

createImg(200,50);

//红色滤镜

createRedFilter();

//创建发光滤镜位图**/

createGlowFilter();

//创建阴影滤镜位图

createShadeFilter();

//创建糊滤滤镜位图

createBlurFilter();

}

/**创建位图方法**/

public function createImg(w:int,h:int):Sprite

{

var img:Sprite=new Sprite();

Laya.stage.addChild(img);

img.loadImage("comp/image.png",w,h);

return img;

}

/**创建红色滤镜位图方法**/

public function createRedFilter():void

{

//颜色滤镜矩阵,红色

var colorMatrix:Array=

[

1,0,0,0,0,//R

0,0,0,0,0,//G

1,0,0,0,0,//B

0,0,0,1,0,//A

];

//创建红色颜色滤镜

var redFilter:ColorFilter = new ColorFilter(colorMatrix);

//在坐标280,50位置创建一个位图

var img:Sprite = createImg(420,50);

//添加红色颜色滤镜效果

img.filters = [redFilter];

}

/**创建发光滤镜位图方法**/

public function createGlowFilter():void

{

//创建发光滤镜位图

var glowFliter:GlowFilter=new GlowFilter("#ff0000",15,0,0);

//在坐标280,50创建位图

var img:Sprite=createImg(640,50);

//添加发光滤镜

img.filters = [glowFliter];

}

/**创建阴影滤镜位图方法**/

public function createShadeFilter():void

{

//创建阴影滤镜

var glowFilter:GlowFilter = new GlowFilter("#000000",8,8,8);

//在坐标460,50创建位图

var img:Sprite = createImg(200,280);

//添加阴影滤镜

img.filters = [glowFilter];

}

/**创建糊滤滤镜位图方法**/

public function createBlurFilter():void

{

//创建模糊滤镜实例

var blurFilter:BlurFilter = new BlurFilter();

//设置模糊强度

blurFilter.strength = 5;

//在坐标280,50创建位图

var img:Sprite = createImg(420,280);

//添加滤镜效果

img.filters = [blurFilter];

}

}