Эффекты шейдера 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. Если я пропускаю удаление полосы из окна перед рисованием, это дает забавный эффект обратной связи - размытые пиксели продолжают размываться, как чернила.