如何应用KineticJS过滤器？

Question

我发现KineticJS过滤器文档非常令人沮丧，无法在线查找示例，尤其是考虑到亮度。

kinetic.filters docs link提到了Kinetic.Filters.Brighten（imageData），但没有关于如何将参数传递给它或如何使用它的信息。

我需要的只是舞台上一层图像的工作示例，以及两个按钮 - 一个用于使图像更亮，另一个用于使图像更暗。谁能帮帮我呢？

谢谢！

Answer 1

真的，过滤器的文档很差。

增亮过滤器的示例：（kineticjs 4.5.0）

    darth = new Kinetic.Image({
      x: 10,
      y: 10,
      image: imageObj,
      draggable: true,
      filter: Kinetic.Filters.Brighten,
      filterBrightness: -50
    });

对于动画，您可以使用本教程：http://www.html5canvastutorials.com/kineticjs/html5-canvas-tween-blur-filter-with-kineticjs/

    var tween = TweenLite.to(darth, 0.6, {
      paused: true,
      setFilterBrightness: 50,
      onUpdate: function() {
        layer.batchDraw(); 
      }
    });