Эффекты шейдера Flex: рендеринг одного объекта в другой

Я хочу создать такой эффект: перетаскиваемый полупрозрачный объект (назовем его "пластиковая полоса") поверх окна с произвольными объектами. Пластиковая полоска должна быть мутной, то есть она размывает содержимое под собой (не стирается сама по себе). Какой лучший способ сделать это с помощью шейдера PixelBender на Flex?

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();
}

Шейдер - это простой блочный фильтр из образцов PixelBender. Если я пропускаю удаление полосы из окна перед рисованием, это дает забавный эффект обратной связи - размытые пиксели продолжают размываться, как чернила.

Другие вопросы по тегам