مروری بر طراحی فیلترهای فلش با Adobe Pixel Bender (قسمت سوم)

در این مقاله که بخش نهایی از مقالات استفاده از نرم‌افزار Adobe Pixel Bender می‌باشد، به بررسی شیوه بارگذاری فیلتر با استفاده از ActionScript 3 و مقدار دهی به پارامترهای ورودی آن می‌پردازیم.
مراحل کلی انجام این عملیات در AS3 به صورت زیر است:
     1. تعریف یک شئ URLLoader با نوع داده باینری و بارگذاری فایل pbj.
     2. تعریف یک شئ از کلاس Shader و دریافت داده از خروجی مرحله قبل.
     3. مقدار دهی به پارامترهای فیلتر به صورت دلخواه.
     4. تعریف یک شئ از کلاس ShaderFilter و دریافت متغیر Shader.
     5. انتصاب متغیر ShaderFilter به خصیصه filters از DisplayObject مورد نظر.
در این مثال، ابتدا یک تصویر دلخواه به فلش وارد نموده و سپس یک MovieClip برای آن درست نموده و با نام img در stage قرار می‌دهیم.
سپس چهار کامپوننت Slider به صفحه اضافه نموده و نام آنها را به صورت slider_gp، slider_r، slider_g و slider_b تعیین می‌کنیم. محدوده Slider های مقادیر rgb از 1 تا 255 بوده و Slider مربوط به درصد Grayscale نیز از 1 تا 100 می‌باشد. (مشابه همان محدوده‌ای که در Pixel Bender برای پارامترهای تعریف شد)
کدنویسی:
import flash.display.*;
import flash.events.*;
import flash.filters.*;

var loader:URLLoader;
var shader:Shader;
var filter:ShaderFilter;

slider_gp.visible = false;
slider_r.visible = false;
slider_g.visible = false;
slider_b.visible = false;

slider_gp.addEventListener(Event.CHANGE, onSlider);
slider_r.addEventListener(Event.CHANGE, onSlider);
slider_g.addEventListener(Event.CHANGE, onSlider);
slider_b.addEventListener(Event.CHANGE, onSlider);

loader = new URLLoader();
loader.dataFormat = URLLoaderDataFormat.BINARY;
loader.addEventListener(Event.COMPLETE, onComplete);
loader.load(new URLRequest("msh_FiltRGB.pbj"));

function onComplete(e:Event) {
    shader = new Shader(loader.data);
    slider_gp.visible = true;
    slider_r.visible = true;
    slider_g.visible = true;
    slider_b.visible = true;
}

function onSlider(e:Event) {
    shader.data.grayPercent.value = [slider_gp.value];
    shader.data.red.value = [slider_r.value];
    shader.data.green.value = [slider_g.value];
    shader.data.blue.value = [slider_b.value];
    filter = new ShaderFilter(shader);
    img.filters = [filter];
}
با تغییر مقدار Slider ها، مقدار پارمترهای فیلتر تغییر کرده و به صورت بلادرنگ به شئ نمایشی مورد نظر اعمال می‌شود.
خروجی این انیمیشن را در swf زیر مشاهده می‌نمایید. (برای نمایش آن به FlashPlayer 10 نیاز دارید)

Get Adobe Flash player

About محمد شمس

برنامه‌نویس، طراح انیمیشن و علاقمند به هوش مصنوعی

One Comment

  1. سلام. روش خیلی جالب و قدرتمندی به نظر میرسد. اما کمی کدنویسی آن سخت است.

پاسخ دهید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *


× 7 = 56