4.1.10【新功能教程】滤镜效果

要了解更多Mugeda功能？>>>猛戳我，学习更多教程​
 编辑地址：
http://beta.mugeda.com/animation/edit/d76c44f6
演示地址：http://b13b5c18.u.mgd5.com/cam ... .html

目前支持如下滤镜：

灰度 Grayscle
亮度 Brightness
对比度 Contrast
饱和度 Saturation
色调 Hue
模糊 Blur
阴影 Shadow
泛黄做旧 Sepia
负片 Invert

为了给元素添加滤镜，选中元素后，在属性面板选择想要添加的滤镜效果，然后点击“+”图标即可将指定的滤镜效果添加到元素上。



根据需要，可以添加1个或者多个滤镜效果。每一个添加的滤镜都可以通过调节滤镜参数来调整滤镜的渲染效果。例如，模糊滤镜可以调节模糊程度。其中，阴影滤镜包含有多个参数，可以将鼠标移动到阴影效果上显示参数并编辑。



如果不想要使用一个已经添加的滤镜效果，可以通过对应的滤镜效果右侧的删除按钮移除。



滤镜效果也支持动画。即：在关键帧上添加的滤镜效果，可以在关键帧动画时进行插值，实现滤镜效果的动画渲染。在动画插值过程中，如果某个关键帧上没有添加指定的滤镜，那么将会采用默认滤镜效果参数进行插值。例如：

如果第1个关键帧添加了100%的灰度，而第2个关键帧没有添加灰度滤镜，那么在动画过程中，第二个关键帧将会用默认灰度(0%)进行插值；

如果第2个关键帧添加了8像素的模糊，而第1个关键帧没有添加灰度滤镜，那么在动画过程中，第二个关键帧将会用默认模糊(0像素，即没有模糊）进行插值；

其它的以此类推。

目前滤镜效果的局限是，由于安卓和iOS手机上仅支持CSS滤镜，不支持Canvas滤镜，
因此手机上需要用Canvas进行渲染的部分（例如遮罩和截屏）暂时不支持滤镜，这一
点在使用中需要注意。