Question

我想在任意对象的窗口上产生这样的效果：可拖动的半透明对象（让我们称之为“塑料条”）。塑料条应该是浑浊的，即它使其下面的内容模糊（本身不模糊）。使用Flex上的PixelBender着色器，最好的方法是什么？

Answer 1

实际上，它变得简单了。要更新塑料条，我将窗口内容绘制到位图中，然后将其提供给着色器以绘制条带（此处称为blurred）：

private function onBlurredUpdate():void {
    matrix.identity();
    matrix.translate(-blurred.x, -blurred.y);
    clipRect.width = blurred.width;
    clipRect.height = blurred.height;

    body.removeChild(blurred);
    bitmapData.draw(body, matrix, null, null, clipRect);
    body.addChild(blurred);

    shader.data.src.input = bitmapData;

    var graphics:Graphics = blurred.graphics;
    graphics.clear();
    graphics.lineStyle(2, 0xC0C0C0);
    graphics.beginShaderFill(shader);
    graphics.drawRoundRect(0, 0, blurred.width, blurred.height, 10, 10);
    graphics.endFill();
}

Shader是PixelBender样本的简单盒式过滤器。如果我在绘制之前跳过从窗口移除条带，它会产生有趣的反馈效果 - 模糊的像素继续像墨水一样模糊。

Flex着色器效果：将一个对象渲染到另一个对象

1 个答案: