Laya 修改源代码 使图片可以变色

众所周知,目前的Laya引擎不支持图片直接变色,但是我们在游戏开发过程中,需要用到对图片进行变色处理.
这里有个方法可以修改一下Laya源代码,使图片可以直接设置颜色颜色滤镜;

如何使用及参与维护LayaAir引擎Github开源项目.

在Laya引擎源码中操作

打开src\layaAir\laya\filters\ColorFilter 加入如下代码段

	/**
     * 设置图片滤镜
     * @param	color 颜色值
     */
    setImageColor(color) {
        var arr = ColorUtils.create(color).arrColor;
        var mt = [arr[0], 0, 0, 0, 0, 0, arr[1], 0, 0, 0, 0, 0, arr[2], 0, 0, 0, 0, 0, 1, 0];
        return this.setByMatrix(mt);
    }

然后运行src\publishTool\publish.bat发布代码,再替换到自己的引擎中就可了.

在发布出来的ts源码中编辑

以TS版Laya引擎代码为例.
在Laya引擎源码中
打开LayaAir.d.ts,在ColorFilter颜色滤镜中声明一个方法

/**
* 设置图片滤镜
* @param color 颜色值
*/
	setImageColor(color:string):ColorFilter;
/**

该方法在laya.core.js中ColorFilter实现

 setImageColor(color) {
     var arr = ColorUtils.create(color).arrColor;
     var mt = [arr[0], 0, 0, 0, 0, 0, arr[1], 0, 0, 0, 0, 0, arr[2], 0, 0, 0, 0, 0, 1, 0];
     return this.setByMatrix(mt);
 }

大功告成了,之后如果需要对图片进行着色,创建这个颜色滤镜就可以了.
例:

var value = "#ff0000";
var image = new Image("res/bbs.png");
var colorFilter = new Laya.ColorFilter();
colorFilter.setImageColor(value);
image._displayObject.filters = [colorFilter];