Difference between revisions of "CSC103 Processing Lab: Solution Sketches"

From dftwiki3
Jump to: navigation, search
(Random Circles with Varying Size and Color)
(Switching between rectangles and circles on mousePressed)
 
(3 intermediate revisions by the same user not shown)
Line 122: Line 122:
 
==Switching between rectangles and circles on mousePressed==
 
==Switching between rectangles and circles on mousePressed==
 
<br />
 
<br />
<code><pre>
+
<showafterdate after="20171019 12:00" before="20171231 00:00">
void&nbsp;setup()&nbsp;{
+
::<source lang="java">
&nbsp;&nbsp;size(480,&nbsp;480&nbsp;);
+
 
&nbsp;&nbsp;smooth();
+
void setup() {
}
+
  size(480, 480 );
  &nbsp;
+
  smooth();
void&nbsp;draw()&nbsp;{
+
}
&nbsp;&nbsp;//background(&nbsp;200&nbsp;);
+
   
  &nbsp;
+
void draw() {
&nbsp;&nbsp;if&nbsp;(&nbsp;mousePressed&nbsp;==&nbsp;true&nbsp;)&nbsp;{
+
  //background( 200 );
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;fill(&nbsp;231,&nbsp;47,&nbsp;39&nbsp;);&nbsp;//&nbsp;red
+
   
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;ellipse(mouseX,&nbsp;mouseY,&nbsp;80,&nbsp;80);
+
  if ( mousePressed == true ) {
&nbsp;&nbsp;}
+
      fill( 231, 47, 39 ); // red
&nbsp;&nbsp;else&nbsp;{
+
      ellipse(mouseX, mouseY, 80, 80);
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;fill(&nbsp;255,&nbsp;200,&nbsp;8&nbsp;);&nbsp;//&nbsp;orange
+
  }
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;rect(mouseX,&nbsp;mouseY,&nbsp;80,&nbsp;80);
+
  else {
&nbsp;&nbsp;}
+
      fill( 255, 200, 8 ); // orange
  &nbsp;
+
      rect(mouseX, mouseY, 80, 80);
}
+
  }
</pre></code>
+
   
 +
}
 +
</source>
 +
</showafterdate>
 
<br />
 
<br />
 +
 
==Tall-skinny, vs. short-wide Rectangles==
 
==Tall-skinny, vs. short-wide Rectangles==
 
<br />
 
<br />
Line 208: Line 212:
 
</pre></code>
 
</pre></code>
 
<br />
 
<br />
 +
==Diagonal of Orange Circles==
 +
<br />
 +
::<source lang="java">
 +
void setup() {
 +
  size( 400, 400 );
 +
  smooth();
 +
}
 +
 +
void draw() {
 +
 +
  background(200);
 +
  fill( 250, 200, 8 );
 +
 +
  // count from 20 to 380 jumping 20 each time.
 +
  for( int xy = 20; xy < 400; xy = xy + 20 ) {
 +
 +
    // and draw a circle in that position, on a diagonal line
 +
    // where x and y have the same value.
 +
    ellipse( xy, xy, 15,15 );
 +
 +
  }
 +
}
 +
</source>
 +
<br />
 +
 
==Cross of Orange Circles==
 
==Cross of Orange Circles==
 
<br />
 
<br />
<code><pre>
+
::<source lang="java">
void&nbsp;setup()&nbsp;{
+
void setup() {
&nbsp;&nbsp;size(&nbsp;400,&nbsp;400&nbsp;);
+
  size( 400, 400 );
&nbsp;&nbsp;smooth();
+
  smooth();
}
+
}
  &nbsp;
+
   
void&nbsp;draw()&nbsp;{
+
void draw() {
  &nbsp;
+
   
&nbsp;&nbsp;background(200);
+
  background(200);
  &nbsp;
+
   
&nbsp;&nbsp;//&nbsp;count&nbsp;from&nbsp;20&nbsp;to&nbsp;380&nbsp;jumping&nbsp;20&nbsp;each&nbsp;time.
+
  // count from 20 to 380 jumping 20 each time.
&nbsp;&nbsp;for(&nbsp;int&nbsp;x&nbsp;=&nbsp;20;&nbsp;x&nbsp;<&nbsp;400;&nbsp;x&nbsp;=&nbsp;x&nbsp;+&nbsp;20&nbsp;)&nbsp;{
+
  for( int x = 20; x < 400; x = x + 20 ) {
  &nbsp;
+
   
&nbsp;&nbsp;&nbsp;&nbsp;//&nbsp;and&nbsp;draw&nbsp;a&nbsp;circle&nbsp;in&nbsp;that&nbsp;position,&nbsp;on&nbsp;a&nbsp;horizontal&nbsp;line.
+
    // and draw a circle in that position, on a horizontal line.
&nbsp;&nbsp;&nbsp;&nbsp;fill(&nbsp;250,&nbsp;200,&nbsp;8&nbsp;);
+
    fill( 250, 200, 8 );
&nbsp;&nbsp;&nbsp;&nbsp;ellipse(&nbsp;200,&nbsp;x,&nbsp;15,15&nbsp;);&nbsp;
+
    ellipse( 200, x, 15,15 );  
&nbsp;&nbsp;&nbsp;&nbsp;ellipse(&nbsp;x,&nbsp;200,&nbsp;15,15&nbsp;);&nbsp;
+
    ellipse( x, 200, 15,15 );  
  &nbsp;
+
   
&nbsp;&nbsp;}
+
  }
}
+
}
</pre></code>
+
</source>
 
<br />
 
<br />
 +
 
==Diagonal Orange Circles==
 
==Diagonal Orange Circles==
 
<br />
 
<br />

Latest revision as of 14:29, 18 October 2017

Solutions

Orange Rectangles


 void setup() {
   size(480, 480 );
   smooth();
 }
  
 void draw() {
   // ellipse(mouseX, mouseY, 80, 80);
   fill( 255, 200, 8 );
   rect( mouseX, mouseY, 80, 80 );
 }


Swapping mouseX and mouseY


 void setup() {
   size(480, 480 );
   smooth();
 }
  
 void draw() {
   // ellipse(mouseX, mouseY, 80, 80);
   fill( 255, 200, 8 );
   rect( mouseY, mouseX, 80, 80 );
 }


Squares and Circles


void setup() {
    size( 500, 500 );
    smooth();
}

void draw() {
   fill( 200, 100, 100 );
   ellipse( mouseX, mouseY, 80, 80 );
   fill( 200, 0, 250 ); 
   rect( mouseX, mouseY, 80, 80 );

}


Squares move Horizontally, Circles Vertically


void setup() {
    size( 500, 500 );
    smooth();
}

void draw() {
   fill( 200, 100, 100 );
   ellipse( 100, mouseY, 80, 80 );
   fill( 200, 0, 250 ); 
   rect( mouseX, 100, 80, 80 );

}


Random Circles


void setup() {
    size( 500, 500 );
    smooth();
}

void draw() {
   fill( 200, 150, 200 );
   ellipse( random(500), random(500), 80, 80 );
   // fill( 200, 0, 250 ); 
   // rect( mouseX, 100, 80, 80 );

}


Random Circles with Varying Size and Color


void setup() {
    size( 500, 500 );
    smooth();
}

void draw() {
   fill( 200, random(255), mouseX/2 );
   ellipse( random(500), random(500), mouseX, mouseX );
   // fill( 200, 0, 250 ); 
   // rect( mouseX, 100, 80, 80 );

}


Random Circles in Square Areas


void setup() {
    size( 500, 500 );
    smooth();
}

void draw() {
   fill( 200, random(255), mouseX/2 );
   ellipse( random(100,200), random(100,200), mouseX, mouseX );

   fill( 200, mouseX/2, random(255) );
   ellipse( random(300,400), random(300,400), mouseX, mouseX );

}


Switching between rectangles and circles on mousePressed


<showafterdate after="20171019 12:00" before="20171231 00:00">

void setup() {
  size(480, 480 );
  smooth();
}
 
void draw() {
  //background( 200 );
 
  if ( mousePressed == true ) {
      fill( 231, 47, 39 ); // red
      ellipse(mouseX, mouseY, 80, 80);
  }
  else {
      fill( 255, 200, 8 ); // orange
      rect(mouseX, mouseY, 80, 80);
  }
 
}

</showafterdate>

Tall-skinny, vs. short-wide Rectangles


 void setup() {
   size(480, 480 );
   smooth();
 }
  
 void draw() {
   //background( 200 );
  
   if ( mousePressed == true ) {
       fill( 231, 47, 39 ); // red
       rect(mouseX, mouseY, 200, 20);
   }
   else {
       fill( 255, 200, 8 ); // orange
       rect(mouseX, mouseY, 20, 100);
   }
  
 }


Drawing lines on mousePressed


 void setup() {
   size(480, 480 );
   smooth();
 }
  
 void draw() {
   //background( 200 );
   if ( mousePressed ) {
     line( mouseX, mouseY, pmouseX, pmouseY );
   }
   
 }
 


Vertical Circles


 void setup() {
   size( 400, 400 );
   smooth();
 }
  
 void draw() {
  
   background(200);
  
   // count from 20 to 380 jumping 20 each time.
   for( int x = 20; x < 400; x = x + 20 ) {
  
     // and draw a circle in that position, on a horizontal line.
     fill( 250, 200, 8 );
     ellipse( 200, x, 15,15 ); 
  
   }
 }
 


Diagonal of Orange Circles


void setup() {
  size( 400, 400 );
  smooth();
}
 
void draw() {
 
  background(200);
  fill( 250, 200, 8 );
 
  // count from 20 to 380 jumping 20 each time.
  for( int xy = 20; xy < 400; xy = xy + 20 ) {
 
     // and draw a circle in that position, on a diagonal line
     // where x and y have the same value.
     ellipse( xy, xy, 15,15 ); 
 
  }
}


Cross of Orange Circles


void setup() {
  size( 400, 400 );
  smooth();
}
 
void draw() {
 
  background(200);
 
  // count from 20 to 380 jumping 20 each time.
  for( int x = 20; x < 400; x = x + 20 ) {
 
    // and draw a circle in that position, on a horizontal line.
    fill( 250, 200, 8 );
    ellipse( 200, x, 15,15 ); 
    ellipse( x, 200, 15,15 ); 
 
  }
}


Diagonal Orange Circles


 void setup() {
   size( 400, 400 );
   smooth();
 }
  
 void draw() {
  
   background(200);
   
   // count from 20 to 380 jumping 20 each time.
   for( int x = 20; x < 400; x = x + 20 ) {
        fill( 255, 200, 8 );
        ellipse( x, x, 15, 15 ); 
     }
 }
 


Orange Circles Left of the Mouse


 void setup() {
   size( 400, 400 );
   smooth();
 }
  
 void draw() {
  
   background(200);
   
   // count from 20 to 380 jumping 20 each time.
   for( int x = 20; x < 400; x = x + 20 ) {
     fill( 250, 200, 8 );
 
     if ( x < mouseX ) {   
        ellipse( x, x, 15,15 ); 
     }
   } 
 }
 


Growing Multicolored Circles


 void setup() {
   size( 400, 400 );
   smooth();
 }
  
 void draw() {
  
   background(200);
   
   // count from 20 to 380 jumping 20 each time.
   for( int x = 20; x < 400; x = x + 20 ) {
     fill( 250, x/2, 255-x/2 );
 
     if ( x < mouseX ) {   
        ellipse( x, x, x/2,x/2 ); 
     }
   } 
 }