通過重複繪製透明矩形逐漸褪色

我通過在每個幀的視圖上繪製半透明的白色矩形淡出先前繪製的對象。

但是，它們似乎永不褪色成完全白色。衰落在一些明顯的非白色陰影中具有固定點。同樣的事情發生時，試圖淡入黑。

這是alpha混合在加工過程中如何工作的標準特徵？有沒有一個相對容易方式來實現一個完全白色的背景（給定足夠的步驟）？

我想象得到的顏色是混合顏色的線性組合，這意味着限制應該是白色的。也許非白色定點是四捨五入的假象？

說明問題

示例代碼：

void setup() { 
    size(300,300); 
    background(0); 
    noStroke(); 
    frameRate(15); 
} 

void draw() { 
    fill(255,10); 
    rect(0,0,width,height); 
    fill(255); 
    rect(0,0,50,50); // for comparison to white 
}

編輯：添加的Java標籤中的更多關注

來源

2011-07-25 Szabolcs

你找到一個解決這個問題了嗎？ – LaserJesus

@LaserJesus不是真的，我已經停止玩它了。它不褪色以完成白色的原因是顏色被編碼爲整數（即不允許小數值）。 – Szabolcs

希望我不知道怎麼回事，好像你應該是正確的如果矩形的數量*這些矩形的alpha值大於255，它應該是完全白色的。無論如何，爲什麼不只是重繪每一幀（就像我通過將背景（0）線移動到繪製循環中），然後增加你的alpha值。我認爲這條道路將在未來給你更多的動畫控制權。

int a; 

void setup() { 
    size(300,300); 
    noStroke(); 
    frameRate(15); 
    a = 0; 
} 

void draw() { 
    background(0); 
    a += 1; 
    if(a<=255){ 
    fill(255,a); 
    } 
    rect(0,0,width,height); 
    fill(255); 
    rect(0,0,50,50); // for comparison to white 
}

來源

2011-10-04 12:48:34 Robin

我的觀點並不是淡出一個矩形，而是逐漸淡出到目前爲止在屏幕上繪製的所有東西，所有這些同時還吸取了新的東西。想象一下，通過屏幕移動一個「球」，而不是刪除在前一幀畫出的球，而只是「淡出」了一下。最終的結果將會是球會離開一條褪色的小路。這對更復雜的動畫可以產生很好的效果。你列出的方法只能產生一個漸變的矩形，而不是這個效果。 – Szabolcs

我做了很多挖掘工作，現在我有信心說，完全褪色的alpha通道是不可能的。然而，有一件事叫亮度，所以讓我們使用它。

void setup() { 
    size(300,300); 
    background(0); 
    noStroke(); 
    frameRate(15); 

    // White rectangle for fading comparison. 
    fill(255); 
    rect(0, 0, 50, 50); 
} 

void draw() { 
    fade(10); 
} 

void fade(final int fadeSpeed) { 
    loadPixels(); 
    for (int row = 0; row < height; row++) { 
    for (int col = 0; col < width; col++) { 
     final int pixelIndex = row * width + col; 
     int pixel = pixels[pixelIndex]; 
     int red = ((pixel >>> 16) & 0xFF) + fadeSpeed; 
     int green = ((pixel >>> 8) & 0xFF) + fadeSpeed; 
     int blue = (pixel   & 0xFF) + fadeSpeed; 
     if (red > 255) { red = 255; } 
     if (green > 255) { green = 255; } 
     if (blue > 255) { blue = 255; } 

     // Shift bits back into propper position and 
     red <<= 16; 
     green <<= 8; 
     pixel &= 0xFF000000; // Keep alpha bits. 
     pixel |= red |= green |= blue; 

     pixels[pixelIndex] = color(pixel); 
    } 
    } 
    updatePixels(); 
}

通過在同一時間我們不改變顏色，但亮度增加所有三個顏色通道（紅，綠，藍）。

來源

2015-06-18 01:42:21 Creaturo

我發現，儘管舍入誤差（如果那是它是什麼），適用於幾乎所有你可以試試，用blendMode(SUBTRACT)，然後用一個非常小的灰度顏色填充（如fill(2)）實現了逐步淡出許多draw()週期沒有所有其他方法似乎具有的「鬼影」圖像，同時保持幀速率（在實時繪圖情況下這通常是關鍵的）。

// The only reasonable way to actually "fade" out the pixels. 
blendMode(SUBTRACT); 
fill(2); 
rect(0, 0, width, height); 
blendMode(NORMAL);

來源

2018-02-22 03:51:49

通過重複繪製透明矩形逐漸褪色

回答

相關問題