04. Basic shapes

  1. Det är väldigt enkelt att rita rektanglar, cirklar och andra tvådimensionella figurer i Processing.

 void setup()
 {
   size(displayWidth, displayHeight);  // fönstrets storlek   
   smooth();                           // mjukar upp
 }
 
 void draw()
 {
   grid();        // kör grid funktionen
   rectangle();   // kör rectangle funktionen
   tri();         // kör tri funktionen
   quads();       // kör quads funktionen
 } 
 
 void rectangle()  // rektanglar
 {
    strokeWeight(10);               // tjocklek
    stroke(#917BCE);                // färg på linje HEX
    fill( 100, 100, 70 );           // fyllning (RÖD, GRÖN, BLÅ)
    rect( 10, 10, 300, 120 );       // hörnpunkternas koordinater 
    rect( 400, 10, 400, 450, 20 );  // hörnpunkternas koordinater samt rundning
  }
  
 void tri()             // trianglar
 {
    stroke(#F7EFE6);    // färg på linje HEX
    strokeWeight(5);    // tjocklek
    fill( 0, 0, 255 );  // fyllning (RÖD, GRÖN, BLÅ)
    triangle( 560, 180, 620, 300, 500, 300 );  // hörnpunkternas koordinater
    triangle( 40, 340, 140, 460, 20, 420 );    // hörnpunkternas koordinater
  }  
  
 void quads()         // fyrhörningar
  {    
    stroke(#4DB99F);  // färg på linje HEX
    strokeWeight(5);  // tjocklek
    noFill();         // ingen fyllning
    quad( 0, 40, 310, 440, 900, 700, 980, 700);    // hörnpunkternas koordinater
    quad( 300, 0, 620, 300, 980, 460, 980, 200 );  // hörnpunkternas koordinater
  }
  
 void grid()         // rutsystem
  {  
    int gridsize = 24;     // rutsystemets storlek
    strokeWeight(1);       // tjocklek
    stroke( 225 );         // färg på linje SVARTVIT
    for ( int i = 0; i < displayWidth/gridsize+1; i++ ) 
    {
      line( i*gridsize, 0, i*gridsize, displayHeight );  // lodräta linjere
    }
    for ( int i = 0; i < displayHeight/gridsize-1; i++ ) 
    {
      line( 0, i*gridsize, displayWidth, i*gridsize );   // vågräta linjer
    }
  }

 

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s