Gölgelendiriciyi harmanlama modu olarak kullanma

Gölgelendiricinin harmanlama modu olarak kullanılması, diğer harmanlama modlarının kullanılmasına benzer. Gölgelendirici, görsel olarak birbiriyle harmanlanmış iki görüntüleme nesnesinin oluşturduğu görünümü tanımlar. Gölgelendiriciyi harmanlama modu olarak kullanmak için, Shader nesnenizi ön plan görüntüleme nesnesinin blendShader özelliğine atayın. blendShader özelliğine null dışında bir değer atanması, görüntüleme nesnesinin blendMode özelliğini otomatik şekilde BlendMode.SHADER olarak ayarlar. Aşağıdaki listede bir gölgelendiricinin harmanlama modu olarak kullanılması gösterilmektedir. Bu örnekte, foreground öğesinin diğer içeriklerin üzerine geldiğinin ve görüntüleme listesinde diğer görüntüleme içerikleriyle aynı üst öğede bulunan foreground adında bir görüntüleme nesnesi olduğunun varsayıldığını unutmayın:

foreground.blendShader = myShader;

Gölgelendiriciyi harmanlama modu olarak kullandığınızda, gölgelendiricinin en az iki girdiyle tanımlanması gerekir. Örnekte gösterildiği gibi, girdi değerlerini kodunuzda ayarlamazsınız. Bunun yerine, iki harmanlanmış görüntü otomatik şekilde gölgelendirici girdisi olarak kullanılır. Ön plan görüntüsü ikinci görüntü olarak ayarlanır. (Bu, harmanlama modunun uygulandığı görüntüleme nesnesidir.) Ön plan görüntüsünün sınırlama kutusunun arkasındaki tüm piksellerin bileşiği alınarak bir arka plan görüntüsü oluşturulur. Arka plan görüntüsü, birinci girdi görüntüsü olarak ayarlanır. İkiden çok girdi bekleyen bir gölgelendirici kullanırsanız, bu iki girdi dışındaki tüm girdiler için bir değer sağlamanız gerekir.

Aşağıdaki örnekte bir gölgelendiricinin harmanlama modu olarak kullanılması gösterilmektedir. Bu örnek, renk parlaklığını esas alarak açık bir harmanlama modu kullanır. Harmanlama sonucunda, harmanlanan nesnelerin herhangi birindeki en açık piksel değeri, görüntülenen piksel olur.

Bu iki örnekte önemli ActionScript kodu bulunur:

• init(): Uygulama yüklendiğinde init() yöntemi çağrılır. Bu yöntemde kod, gölgelendirici bayt kodu dosyasını yükler.

• onLoadComplete(): onLoadComplete() yönteminde kod, shader adında bir Shader nesnesi oluşturur. Daha sonra üç nesne çizer. Bunlardan ilki olan backdrop, harmanlanmış nesnelerin arkasında bulunan koyu gri bir arka plandır. İkincisi olan backgroundShape, yeşil degrade elipstir. Üçüncü nesne olan foregroundShape ise turuncu degrade elipstir.

  foregroundShape elips, harmanlamanın ön plan nesnesidir. Harmanlamanın arka plan görüntüsünün bir bölümünü backdrop öğesinin bir parçası ve bir bölümünü de üstüne foregroundShape nesnesinin sınırlama kutusu gelen backgroundShape öğesinin bir parçası oluşturur. foregroundShape nesnesi, görüntüleme listesinde en öndeki nesnedir. Bu kısmen backgroundShape öğesinin ve tamamen backdrop öğesinin üzerine gelir. Bu üst üste gelme nedeniyle, harmanlama modu uygulanmadan turuncu elips (foregroundShape) tamamen gösterilirken, yeşil elipsin (backgroundShape) bir kısmı gizlenir:

  

  Ancak harmanlama modu uygulandığında, yeşil elipsin açık renkli kısmı, üzerini örten foregroundShape bölümünden daha açık olduğundan "saydam olarak" görünür:

  

Aşağıda, bu örneğin ActionScript kodu verilmiştir. Bu sınıfı Flash Builder'da yalnızca ActionScript projesi için ana uygulama sınıfı olarak veya Flash Professional'da FLA dosyasının belge sınıfı olarak kullanın:

package 
{ 
    import flash.display.BlendMode; 
    import flash.display.GradientType; 
    import flash.display.Graphics; 
    import flash.display.Shader; 
    import flash.display.Shape; 
    import flash.display.Sprite; 
    import flash.events.Event; 
    import flash.geom.Matrix; 
    import flash.net.URLLoader; 
    import flash.net.URLLoaderDataFormat; 
    import flash.net.URLRequest; 
     
    public class LumaLighten extends Sprite 
    { 
        private var shader:Shader; 
        private var loader:URLLoader; 
         
        public function LumaLighten() 
        { 
            init(); 
        } 
         
        private function init():void 
        { 
            loader = new URLLoader(); 
            loader.dataFormat = URLLoaderDataFormat.BINARY; 
            loader.addEventListener(Event.COMPLETE, onLoadComplete); 
            loader.load(new URLRequest("LumaLighten.pbj")); 
        } 
         
         
        private function onLoadComplete(event:Event):void 
        { 
            shader = new Shader(loader.data); 
             
            var backdrop:Shape = new Shape(); 
            var g0:Graphics = backdrop.graphics; 
            g0.beginFill(0x303030); 
            g0.drawRect(0, 0, 400, 200); 
            g0.endFill(); 
            addChild(backdrop); 
             
            var backgroundShape:Shape = new Shape(); 
            var g1:Graphics = backgroundShape.graphics; 
            var c1:Array = [0x336600, 0x80ff00]; 
            var a1:Array = [255, 255]; 
            var r1:Array = [100, 255]; 
            var m1:Matrix = new Matrix(); 
            m1.createGradientBox(300, 200); 
            g1.beginGradientFill(GradientType.LINEAR, c1, a1, r1, m1); 
            g1.drawEllipse(0, 0, 300, 200); 
            g1.endFill(); 
            addChild(backgroundShape); 
             
            var foregroundShape:Shape = new Shape(); 
            var g2:Graphics = foregroundShape.graphics; 
            var c2:Array = [0xff8000, 0x663300]; 
            var a2:Array = [255, 255]; 
            var r2:Array = [100, 255]; 
            var m2:Matrix = new Matrix(); 
            m2.createGradientBox(300, 200); 
            g2.beginGradientFill(GradientType.LINEAR, c2, a2, r2, m2); 
            g2.drawEllipse(100, 0, 300, 200); 
            g2.endFill(); 
            addChild(foregroundShape); 
             
            foregroundShape.blendShader = shader; 
            foregroundShape.blendMode = BlendMode.SHADER; 
        } 
    } 
}

Aşağıda, “LumaLighten.pbj” Pixel Bender bayt kodu dosyasını oluşturmak için kullanılan, LumaLighten gölgelendirici çekirdeğinin kaynak kodu verilmiştir:

<languageVersion : 1.0;> 
kernel LumaLighten 
< 
    namespace : "com.quasimondo.blendModes"; 
    vendor : "Quasimondo.com"; 
    version : 1; 
    description : "Luminance based lighten blend mode"; 
> 
{ 
    input image4 background; 
    input image4 foreground; 
 
    output pixel4 dst; 
     
    const float3 LUMA = float3(0.212671, 0.715160, 0.072169); 
 
    void evaluatePixel() 
    { 
        float4 a = sampleNearest(foreground, outCoord()); 
        float4 b = sampleNearest(background, outCoord()); 
        float luma_a = a.r * LUMA.r + a.g * LUMA.g + a.b * LUMA.b; 
        float luma_b = b.r * LUMA.r + b.g * LUMA.g + b.b * LUMA.b; 
         
        dst = luma_a > luma_b ? a : b; 
    } 
}

Harmanlama modlarını kullanma hakkında daha fazla bilgi için, bkz. Karışım modları uygulama.