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

Question

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

Answer 1

事实上，事情变得很简单。为了更新塑料条，我将窗口内容绘制为位图，然后将其提供给着色器以绘制条带（此处称为“模糊”）：

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 样本的简单框过滤器。如果我在绘制之前跳过从窗口中删除条带，它会产生有趣的反馈效果 - 模糊的像素继续像墨水一样模糊。