gistfile1.pde

// gradient fill using PImage and texture()

Gradient gradient;
 
void setup () 
{
    size(100, 100, P3D);      // needs to be P3D / OPENGL since we use texture()
    
    // create a Gradient size 100 x 100 px with two colors
    gradient = new Gradient( 100, 100, 0xFF880000, 0xFFFFFFFF );
 
    // let it render horizontal
    gradient.horizontal();
}
 
void draw() 
{
    // see: http://processing.org/reference/vertex_.html
    noStroke();
    beginShape();
        texture(gradient);         // use gradient as texture
        vertex( 10, 20,   0,   0);
        vertex( 80, 5,    100, 0);
        vertex( 95, 90,   100, 100);
        vertex( 40, 95,   0,   100);
    endShape();
}
 
 
// ------ Gradient class -------- //
 
class Gradient
extends PImage
{
    int color1, color2;
    
    Gradient ( int _w, int _h )
    {
        super(_w, _h);
        
        color1 = 0xFF000000;
        color2 = 0xFFFFFFFF;
    }
    
    Gradient ( int _w, int _h, int _c1, int _c2 )
    {
        super(_w, _h);
        
        color1 = _c1;
        color2 = _c2;
    }
    
    void vertical ()
    {
        float as = (((color2 >> 24) & 0xFF) - ((color1 >> 24) & 0xFF)) / this.height;
        float rs = (((color2 >> 16) & 0xFF) - ((color1 >> 16) & 0xFF)) / this.height;
        float gs = (((color2 >>  8) & 0xFF) - ((color1 >>  8) & 0xFF)) / this.height;
        float bs = (((color2 >>  0) & 0xFF) - ((color1 >>  0) & 0xFF)) / this.height;
        
        for ( int ih=0; ih < this.height; ih++ )
        {
            int c = color( ((color1 >> 16) & 0xFF) + round(rs * ih),
                           ((color1 >>  8) & 0xFF) + round(gs * ih),
                           ((color1 >>  0) & 0xFF) + round(bs * ih),
                           ((color1 >> 24) & 0xFF) + round(as * ih)
                          );
            for ( int iw=0; iw < this.width; iw++ )
            {
                this.pixels[iw+(ih*this.width)] = c;
            }
        }   
    }
    
    
    void horizontal ()
    {
        float as = (((color2 >> 24) & 0xFF) - ((color1 >> 24) & 0xFF)) / this.width;
        float rs = (((color2 >> 16) & 0xFF) - ((color1 >> 16) & 0xFF)) / this.width;
        float gs = (((color2 >>  8) & 0xFF) - ((color1 >>  8) & 0xFF)) / this.width;
        float bs = (((color2 >>  0) & 0xFF) - ((color1 >>  0) & 0xFF)) / this.width;
        
        for ( int iw=0; iw < this.width; iw++ )
        {
            int c = color( ((color1 >> 16) & 0xFF) + round(rs * iw),
                           ((color1 >>  8) & 0xFF) + round(gs * iw),
                           ((color1 >>  0) & 0xFF) + round(bs * iw),
                           ((color1 >> 24) & 0xFF) + round(as * iw)
                          );
            for ( int ih=0; ih < this.height; ih++ )
            {
                this.pixels[iw+(ih*this.width)] = c;
            }
        }   
    }
}