ActionScript
TypeScript
JavaScript

给显示对象设置发光滤镜

发布时间:2017-03-15

发光滤镜可以让在显示对象的边缘显示一圈发光效果,在引擎中发光滤镜类是GlowFilter,GlowFilter接受四个参数。

GlowFilter的构造函数如下:

/**
* 创建发光滤镜
* @param	color	滤镜的颜色
* @param	blur	边缘模糊的大小
* @param	offX	X轴方向的偏移
* @param	offY	Y轴方向的偏移
*/
GlowFilter(color:String, blur:Number = 4, offX:Number = 6, offY:Number = 6)

发光滤镜的引擎示例(必须用WEBGL渲染 否则不会有效果):

(function()
{
	var Sprite     = Laya.Sprite;
	var Stage      = Laya.Stage;
	var GlowFilter = Laya.GlowFilter;
	var Texture    = Laya.Texture;
	var Browser    = Laya.Browser;
	var Handler    = Laya.Handler;
    var Loader = Laya.Loader;

	(function()
	{
			Laya.init(1000, 900,Laya.WebGL);
			//加载引擎需要的资源
			Laya.loader.load([{url: "res/atlas/comp.json", type: Loader.ATLAS}], Handler.create(this, onLoaded));
           Laya.stage.bgColor ="#ffffff";
	})();

	function onLoaded()
		{
			//不带遮罩的显示对象
			var sprite0 = new Sprite();
			sprite0.graphics.drawTexture(Loader.getRes("comp/image.png"));
			sprite0.pos(100, 100);	
			Laya.stage.addChild(sprite0);
			
			
			//带遮罩的显示对象
			var sprite1 = new Sprite();
			sprite1.graphics.drawTexture(Loader.getRes("comp/image.png"));
			sprite1.pos(400, 100);	
			Laya.stage.addChild(sprite1);
			
			
			var glowFilter = new GlowFilter("#c30c30", 10, 0, 0);
			//给sprite1添加模糊滤镜
			sprite1.filters = [glowFilter];
			
		}
})();		
	

blob.png