処理中の画像の不透明度

Question

私はここでやろうとしています。私はお互いの上に2つの画像を持っていたいと思います。マウスイベントをドラッグして上のイメージをクリックすると、選択された最上位イメージの領域が消えて、下のイメージが表示されます。

私はそれを見る方法、私はこれを行うことができ、2つの方法があります：

は、私が（選択されたエリア内で）時間をかけて、トップの画像は、透明 または を作ることができ、私はスプレーで個別のピクセルを削除することができますファッションをスタイルすることができます。スプレーはMSの塗料からその日に戻ってくると思う。

は相続人だけでお互い

PImage sand; 
    PImage fossil; 

void setup() 
{ 
    size(400,400); 
    background(255,255,0); 
    frameRate(30); 

    fossil = loadImage("foss.jpg"); 
    sand = loadImage("sand.jpeg"); 
} 

void draw() 
{ 

    image(fossil, 0, 0, width,height); 
    image(sand, 0, 0, width,height); 
    smooth(); 

if (mousePressed) { 
    fill(0); 
    tint(255,127); //the opacity function 
    } else { 
    fill(255); 
    } 
} 

の上に画像を産む私は始めたいくつかの非常に基本的なコードは、だから、誰も、おそらく私が見落としてきた簡単な方法が不透明度を作成したり、これらの2つの方法上の任意のコメントを持っています？

---

恐らく私は以下の2つのコメントが明確化を求めているので、私のスペックではっきりしていませんでした。

最も単純な言葉では、私はお互いの上に2枚の画像を持っています。下の画像を見えるようにするトップレベルの画像をいくつか変更できるようにしたいと思います。しかし、私はトップレベルの画像の一部だけにこの変更を加える必要があります。

私はどちらが良い選択肢かを知りたいと思います。 tint（）を使用してトップイメージの一部を透明にするか、トップレイヤーからピクセルを削除するには

次に、私はそのアプローチを進めます。どのようにそれを行うかについての任意の指示も感謝しています。

これが混乱をなくすことを望みます。

Answer 1

画像をクロスフェードしたい場合は、コードの示唆どおりにtint（）を使用します。あなたは非常に近い、実際にあった：

PImage sand; 
PImage fossil; 

void setup() 
{ 
    size(400, 400); 
    fossil = loadImage("CellNoise.jpg"); 
    sand = loadImage("CellVoronoi.jpg"); 
} 

void draw() 
{ 
    //tint from 255 to 0 for the top image 
    tint(255,map(mouseX,0,width,255,0)); 
    image(fossil, 0, 0, width, height); 
    //tint from 0 to 255 for the bottom image - 'cross fade' 
    tint(255,map(mouseX,0,width,0,255)); 
    image(sand, 0, 0, width, height); 
} 

あなたは、単に先のイメージにソースイメージからピクセルをコピーすることができ、「スプレー缶スタイル」浸食のために。ここはあなたのピクセルをループ（どのように多くの、どのような順序など）したい効果のような「スプレー」を得るために、しかしがcopy()機能を使用する方法の基本的な例ですどのようにあなた次第です：

PImage sand,fossil; 
int side = 40;//size of square 'brush' 
void setup() 
{ 
    size(400, 400); 
    fossil = loadImage("CellNoise.jpg"); 
    sand = loadImage("CellVoronoi.jpg"); 
} 
void draw() 
{ 
    image(fossil, 0, 0, 400, 400); 
    if(mousePressed) { 
    for(int y = 0 ; y < side ; y++){ 
     for(int x = 0; x < side; x++){ 
     //copy pixel from 'bottom' image to the top one 
     //map sketch dimensions to sand/fossil an dimensions to copy from/to right coords 
     int srcX = (int)map(mouseX+x,0,width+side,0,sand.width); 
     int srcY = (int)map(mouseY+y,0,height+side,0,sand.height); 
     int dstX = (int)map(mouseX+x,0,width+side,0,fossil.width); 
     int dstY = (int)map(mouseY+y,0,height+side,0,fossil.height); 
     fossil.set(dstX, dstY, sand.get(srcX,srcY)); 
     } 
    } 
    } 
} 

私が四角形（私の場合は40x40）をコピーするために単純にループしていることに注意してください。ループを作り、さまざまな効果を得る他の楽しい方法を見つけることができます。

楽しくお楽しみください！