void setup() {
size(800,600);
smooth();
}
void draw() {
int circlex = 0;
int circley = 0;
while(true){
ellipse(circlex,circley,50,50);
circlex = circlex + 2;
circley = circley + 1;
}
}
I'm very new to Java and I want to know why this only shows a background and nothing happens.
The infinite while loop is blocking rendering, so your sketch is never finishing rendering a frame. The draw() function already gets called multiple times per second: use that as your infinite loop.
Also move your local variables to the top of your code so they're visible through out the Processing sketch. This way you won't reset the values back to 0 all the time, cancelling out the position incrementation:
int circlex = 0;
int circley = 0;
void setup() {
size(800, 600);
smooth();
}
void draw() {
ellipse(circlex, circley, 50, 50);
circlex = circlex + 2;
circley = circley + 1;
}
Related
So I am currently doing a generative GIF from Processing and currently saving these frames out. I am wondering how can I make the background transparent? For now, it is currently black but I want to make it transparent. Thanks !!
static final int NUM = 150;
static final float X[] = new float[NUM];
static final float Y[] = new float[NUM];
static final float T[] = new float[NUM];
void initCoordinates(boolean setup) {
for(int i = 0 ; i < NUM; i++) {
if (setup) {
T[i] = random(0, 180); // [0, PI]
}
// the magic curve
X[i] = 50 * sin(T[i]) * (exp(cos(T[i])) - 3*cos(4*T[i]) - pow(sin(T[i]/10), 5));
Y[i] = 50 * cos(T[i]) * (exp(cos(T[i])) - 3*cos(4*T[i]) - pow(sin(T[i]/10), 5));
}
}
void setup (){
size (800, 800, P2D);
//colorMode(HSB);
initCoordinates(true);
}
void draw(){
background(0);
//stroke(100);
//line (400,100,400,700);
//line (100,400,700,400);
translate(width/2, height/2);
//stroke(255);
beginShape();
for (int i = 0; i<NUM; i++){
T[i] +=.004;
if (T[i] > 180) {
T[i] = 0;
}
initCoordinates(false);
stroke(random(200, 255), random(200, 255), random(200, 255));
fill(random(155,255),random(100,55), random(0,10));
rect(X[i],Y[i], random(1,15), random(1,15));
endShape();
}}
void keyPressed(){
if(keyPressed && key==' ') saveFrame("frame1/frame-#####.png");
}
Reference:
Making a transparent background (application) in Processing language
Thanks to Kevin Workman for showing us how to do this with a Processing window. However, once the image is saved to a .png file it is on a solid black background. There are ways of getting it on a lighter background, but that is another topic. If you want to see the butterfly pattern more distinctly, try moving 'background(0,128)' from draw() to setup(). Not sure what you are trying to achieve.
import java.awt.*;
import java.awt.event.*;
import javax.swing.*;
javax.swing.JFrame frame;
static final int NUM = 150;
static final float X[] = new float[NUM];
static final float Y[] = new float[NUM];
static final float T[] = new float[NUM];
void initCoordinates(boolean setup) {
for (int i = 0; i < NUM; i++) {
if (setup) {
T[i] = random(0, 180); // [0, PI]
}
// the magic curve
X[i] = 50 * sin(T[i]) * (exp(cos(T[i])) - 3*cos(4*T[i]) - pow(sin(T[i]/10), 5));
Y[i] = 50 * cos(T[i]) * (exp(cos(T[i])) - 3*cos(4*T[i]) - pow(sin(T[i]/10), 5));
}
}
void setup() {
size(800,800);
background(0,128);
frame = (javax.swing.JFrame) ((processing.awt.PSurfaceAWT.SmoothCanvas) surface.getNative()).getFrame();
frame.dispose();
frame.setUndecorated(true);
frame.setOpacity(.5f);
frame.setVisible(true);
initCoordinates(true);
}
void draw() {
translate(width/2, height/2);
beginShape();
for (int i = 0; i<NUM; i++) {
T[i] +=.004;
if (T[i] > 180) {
T[i] = 0;
}
initCoordinates(false);
stroke(random(200, 255), random(200, 255), random(200, 255));
fill(random(155, 255), random(100, 55), random(0, 10));
rect(X[i], Y[i], random(1, 15), random(1, 15));
endShape();
}
}
void mousePressed(){
println("frame saved.");
saveFrame("frame1/frame-#####.png");
}
I couldn't get keyPressed() to work on the transparent window so I switched to mousePressed() to save the image. Operating system was MacOS.
I am learning how to code in Processing 4.
I am trying to make a code where when keyPressed() is clicked, one circle is drawn then when the button is pressed again, the first circle remains and then a second circle is drawn but with extent increased by 10, then the key pressed for a final time (3) and the third circle is drawn with the extent increased by 3 then it stops producing more circles.
This is the code I have so far but I am confused on how to approach it. Right now, the first circle just increases in size and it doesn't draw a second one. How do I draw 3 circles, one once keyPressed()?
int sizeIncrease = 10;
int initialSize = 70;
void setup() {
size(500, 500);
}
void draw() {
background(0);
stroke(255,0,0);
strokeWeight(25);
fill(255);
pushMatrix();
translate(20, 50);
circle(width/2, height/2, initialSize);
popMatrix();
}
void keyPressed() {
initialSize += sizeIncrease;
}
Add a variable count. Increment the variable when a key is pressed and draw the circles in a for-loop:
int sizeIncrease = 10;
int initialSize = 70;
int count = 1;
void setup() {
size(500, 500);
}
void draw() {
background(0);
noFill();
stroke(255);
pushMatrix();
translate(20, 50);
for (int i = 0; i < count; i++) {
circle(width/2, height/2, initialSize + i*sizeIncrease);
}
popMatrix();
}
void keyPressed() {
count ++;
}
int sizeIncrease = 10;
int initialSize = 70;
int count = 1;
void setup() {
size(500, 500);
}
void draw() {
background(0);
noFill();
stroke(255);
pushMatrix();
translate(20, 50);
for (int i = 0; i < count; i++)
{
circle(width/2, height/2, initialSize + i*sizeIncrease);
**if(i == 1)
{
sizeIncrease = 3;
}**
}
popMatrix();
}
void keyPressed() {
count ++;
}
I am trying to create a vertical carousel in processing with three ellipses.
I am able to get this done with two ellipses – that the carousel repeats itself over and over.
So far so good – it thought I could use the same logic for three but I am wrong. I started to think it works with more variables but wrong again… what am I missing in the logic? I really can not figure out how to set the values to make it seamless repeating itself…
Here is the example with two (this one is "seamless"):
float yspeed = 5;
float circleY;
int d = 720;
void setup() {
size(1080, 1620 );
circleY = 0;
}
void draw() {
background(255);
fill(0);
noStroke();
ellipse(width/2, circleY+height/2, d,d);
ellipse(width/2, circleY-height/2, d,d );
circleY = circleY + yspeed;
if (circleY > height) {
circleY=0;}
}
Here is my WIP with three … (BTW colors are only to see better):
float yspeed1 = 5;
float yspeed2 = 5;
float yspeed3 = 5;
float circleY1;
float circleY2;
float circleY3;
int d = 720;
void setup() {
size(1080, 1620);
circleY1 = 0;
circleY2 = 0;
circleY3 = 0;
}
void draw() {
background(255);
noStroke();
fill(255, 0, 0);
ellipse(width/2, circleY1, d, d);
circleY1= circleY1 + yspeed1;
if (circleY1 > height+d/2 ) {
circleY1=0;
}
fill(0, 255, 0);
ellipse(width/2, circleY2-810, d, d);
circleY2= circleY2 + yspeed2;
if (circleY2 > height+d/2 ) {
circleY2=0 ;
}
fill(0, 0, 255);
ellipse(width/2, circleY2-1620, d, d);
circleY3= circleY3 + yspeed3;
if (circleY3 > height+d/2 ) {
circleY3=0 ;
}
}
The one with three always starts at the intital point for all of them – but I thought that using individual variables would change it?
Thank you for any kind of help!
I found a solution myself! I used a trick – I did it with a loop and used four instead of three – three is in the end the only ones you see anyway!
float yspeed = 1;
float circleY;
int d = 360;
void setup() {
size(540, 810 );
circleY = 0;
}
void draw() {
background(255);
fill(0);
noStroke();
// fill(255,0,0);
translate(0, - height/2);
for (int i = 0; i< 5; i++) {
ellipse(width/2, circleY+height/2*i, d, d);
}
circleY = circleY + yspeed;
if (circleY > 405) {
circleY= 0;
}
}
I am trying to make a spinning cube in Processing's P3D with this code:
int sizes = 500;
int rotation = 0;
void setup() {
size(500, 500, P3D);
}
void draw() {
lights();
translate(sizes/2, sizes/2, 0);
rotateY(rotation * (PI/180));
rotateX(rotation * (PI/180));
background(0);
box(sizes/2);
rotation = (rotation + 1);
}
When I run it the cube does spin as I wanted, but there are strange 'artifacts' (for lack of a better name) left behind its edges.
What causes this issue, and can it be solved?
I tried this and it worked. Maybe instead of using backround(0), set every pixel to black like the background function does manually.
int sizes = 500;
int rotation = 0;
void setup() {
size(500, 500, P3D);
}
void draw() {
fill(255);
lights();
translate(sizes/2, sizes/2, 0);
rotateY(rotation * (PI/180));
rotateX(rotation * (PI/180));
loadPixels();
for(int i = 0; i < pixels.length; i++) pixels[i] = color(0);
box(sizes/2);
rotation = (rotation + 1);
}
I need to create a loop which will space circles equally around a circle in Processing.
I know I can somehow implement a FOR loop.
I need to be able to increase or decrease the number of circles around this circle (with button presses) but keep them equally spaced.
I know the formula's I need to include in the FOR loop to get the X and Y axis. The formulas:
being
X = R*cos(angle-90)+Y0
Y = R*sin(angle-90)+X0
I understand the three parameters of the FOR loop; when does it start, when does it finish, what changes when it runs.
What I can't see is how to implement the formulas into the FOR loop.
Many thanks
Here is the code I do have
void setup () {
size (600, 600);
background (255, 255, 255);
smooth ();
ellipse (width/2, height/2, 200, 200); // the guide circle. Not needed in final code.
}
void draw() {
for (int i = 0; i < 20; i ++) {
for (int j = 0; j < 20; j ++) {
ellipse (i *20, j * 20, 20, 20);
}
}
}
This code should do the trick:
float incrementalAngle = 0.0;
void setup(){
size(600, 600);
smooth();
background(0);
ellipse(width/2, height/2, 200, 200);
drawCircles(20, 200);
}
void draw(){
}
void drawCircles(int circlesNumber, int bigCircleNumber){
float angle = incrementalAngle;
for(int i = 0; i < circlesNumber; i++){
ellipse(bigCircleNumber * cos(incrementalAngle) + height/2,
bigCircleNumber * sin(incrementalAngle) + width/2,
circlesNumber, circlesNumber);
incrementalAngle += TWO_PI / circlesNumber;
}
}
So the second loop wasn't needed, and the formula you were trying to introduce would go in the X and Y position of your ellipse, there by playing whit the angle and the cos and sin you can get the result you were looking for.
What's left now is for you to get the number of circles you want by the clicking inside a mousePressed() method and drawing that amount.
Hope this comes useful and call me if you need more help
Regards
Jose.
Thank you to everyone who helped.
I managed to do it (slightly differently to you #Jose Gonzalez
int nbr_circles = 2;
void setup() {
size(600, 600);
smooth();
background(255);
}
void draw() {
background(255);
float cx = width/2.0;
float cy = height/2.0;
fill(0);
//float x, y; //
for (int i = 0; i < nbr_circles; i++)
{
float angle = i * TWO_PI / nbr_circles;
float x = cx + 110.0 * cos(angle);
float y = cy + 110.0 * sin(angle);
ellipse(x, y, 20, 20);
}
}
void mousePressed() {
if (mouseButton == LEFT) {
if (nbr_circles < 20)
nbr_circles = nbr_circles + 1;
} else if (mouseButton == RIGHT) {
if (nbr_circles > 2)
nbr_circles = nbr_circles - 1;
}
}