I am trying to create 100 frames where the numbers 0-100 are "printed" in the center of every frame. If I try the code below I get the error "It looks like you're mixing "active" and "static" modes".
size(1440,900);
font = loadFont("Arial-Black-96.vlw");
textFont(font,96);
int x = 0;
void draw() {
background(204);
y=0;
if (x < 100) {
text(y, 10, 50);
x = x + 1;
y=y+1;
} else {
noLoop();
}
// Saves each frame as screen-0001.tif, screen-0002.tif, etc.
saveFrame();
}
You need to wrap the first 3 lines in the setup() function.
Like:
void setup(){
size(1440,900);
font = loadFont("Arial-Black-96.vlw");
textFont(font,96);
}
I answered this without running the code, there were others issues, here a version of your code:
PFont font;
int x = 0;
int size = 96;
void setup() {
size(1440, 900);
font = createFont("Arial-Black", size);
textFont(font);
}
void draw() {
background(204);
if (x <= 100) {
String number = nf(x, 2);
text(number, width/2 - textWidth(number)/2, height/2);
x++;
saveFrame();
}
else {
exit();
}
}
Related
I have tried many methods, and can't seem to grasp the idea of extracting an index from my array of strings to help me generate my desired number of building with a desired height, please help, here is my example
edit: Hi, i saw your feedback and posted my code below, hopefully it helps with the idea overall, as much as it is just creating rects, its more complicated as i need to involve arrays and string splitting along with loops. i more or less got that covered but i as i said above, i cannot extract the values from my array of string and create my facades at my own desired number and height
String buffer = " ";
String bh = "9,4,6,8,12,2";
int[] b = int(split(bh, ","));
int buildingheight = b.length;
void setup () {
size(1200, 800);
background(0);
}
void draw () {
}
void Textbox() {
textSize(30);
text(buffer, 5, height-10);
}
void keyTyped() {
if (key == BACKSPACE) {
if (buffer.length() > 0) {
buffer = buffer.substring(0, buffer.length() - 1);
}
} else if (key == ENTER) {
background(0);
stroke(0);
GenerateFacade();
println(buffer);
}
else {
buffer = buffer + key;
Textbox();
}
}
void GenerateFacade() {
fill(128);
for (int i = 0; i < b.length; i++) {
for (int j = 0; j < b.length; j++) {
if (int(b[j]) > buildingheight) {
buildingheight = int(b[j]);
}
}
rect(i*width/b.length, height - (int(b[i])*height/buildingheight), width/b.length, int(b[i])*height/buildingheight);
}
}
For the next time it would be great if you provide us with some code so we know what you tried and maybe can point you to the problem you have.
You need just the keyPressed function and some variables
int x = 0;
int buildingWidth = 50;
int buildingHeight = height / 6;
void setup(){
size(1000, 500);
background(255);
}
void draw(){
}
void keyPressed(){
if(key >= '0' && key <= '9'){
int numberPressed = key - '0' ;
fill(0);
rect(x, height - buildingHeight * numberPressed,
buildingWidth, buildingHeight * numberPressed);
x += buildingWidth;
}
}
This is my result
I am currently using a processing sketch to work through a large number of images I have in a folder. I have set an onClick command to advance to the next image in the string. It is quite time consuming and I would like to automate the action that once the sketch is completed the sketch would repeat it's self selecting the next image from the string. The onClick command also save the image the export folder but each time saves with the same file name, I've tried to set up sequential numbering but it hasn't worked so far. Any help would be greatly appreciated.
String[] imgNames = {"1.jpg", "2.jpg", "3.jpg"};
PImage img;
int imgIndex = 0;
void nextImage() {
background(255);
frameRate(10000);
loop();
frameCount = 0;
img = loadImage(imgNames[imgIndex]);
img.loadPixels();
imgIndex += 1;
if (imgIndex >= imgNames.length) {
imgIndex = 0;
}
}
void paintStroke(float strokeLength, color strokeColor, int strokeThickness) {
float stepLength = strokeLength/4.0;
// Determines if the stroke is curved. A straight line is 0.
float tangent1 = 0;
float tangent2 = 0;
float odds = random(1.0);
if (odds < 0.7) {
tangent1 = random(-strokeLength, strokeLength);
tangent2 = random(-strokeLength, strokeLength);
}
// Draw a big stroke
noFill();
stroke(strokeColor);
strokeWeight(strokeThickness);
curve(tangent1, -stepLength*2, 0, -stepLength, 0, stepLength, tangent2, stepLength*2);
int z = 1;
// Draw stroke's details
for (int num = strokeThickness; num > 0; num --) {
float offset = random(-50, 25);
color newColor = color(red(strokeColor)+offset, green(strokeColor)+offset, blue(strokeColor)+offset, random(100, 255));
stroke(newColor);
strokeWeight((int)random(0, 3));
curve(tangent1, -stepLength*2, z-strokeThickness/2, -stepLength*random(0.9, 1.1), z-strokeThickness/2, stepLength*random(0.9, 1.1), tangent2, stepLength*2);
z += 1;
}
}
void setup() {
size(1600, 700);
nextImage();
}
void draw() {
translate(width/2, height/2);
int index = 0;
for (int y = 0; y < img.height; y+=1) {
for (int x = 0; x < img.width; x+=1) {
int odds = (int)random(20000);
if (odds < 1) {
color pixelColor = img.pixels[index];
pixelColor = color(red(pixelColor), green(pixelColor), blue(pixelColor), 100);
pushMatrix();
translate(x-img.width/2, y-img.height/2);
rotate(radians(random(-90, 90)));
// Paint by layers from rough strokes to finer details
if (frameCount < 20) {
// Big rough strokes
paintStroke(random(150, 250), pixelColor, (int)random(20, 40));
} else if (frameCount < 1000) {
// Thick strokes
paintStroke(random(75, 125), pixelColor, (int)random(8, 12));
} else if (frameCount < 1500) {
// Small strokes
paintStroke(random(20, 30), pixelColor, (int)random(1, 4));
} else if (frameCount < 10000) {
// Big dots
paintStroke(random(5, 10), pixelColor, (int)random(5, 8));
} else if (frameCount < 10000) {
// Small dots
paintStroke(random(1, 2), pixelColor, (int)random(1, 3));
}
popMatrix();
}
index += 1;
}
}
if (frameCount > 10000) {
noLoop();
}
// if(key == 's'){
// println("Saving...");
// saveFrame("screen-####.jpg");
// println("Done saving.");
// }
}
void mousePressed() {
save("001.tif");
nextImage();
}
Can't you just call the nextImage() function from inside this if statement?
if (frameCount > 10000) {
noLoop();
}
Would be:
if (frameCount > 10000) {
nextImage();
}
As for using different filenames, just use an int that you increment whenever you save the file, and use that value in the save() function. Or you could use the frameCount variable:
save("img" + frameCount + ".tif");
If you have follow-up questions, please post a MCVE instead of your whole project. Try to isolate one problem at a time in a small example program that only does that one thing. Good luck.
Is there any simple library to get gui functionalities like text fields, text areas in processing? . I have written a pong game in processing and I want text fields to get the name of the players.
In the code below I wanted a text field to get names from the players
here is my code
int butt=0;
float velx=-2;
float vely=-2;
float x=350,y=200;
int s=150;
int score1=0,score2=0;
float speed = 1;
float speed_cont = 0.0001;
void setup(){
size(700,400);
smooth();
background(100,200,100);
}
void draw(){
stroke(255);
strokeWeight(15);
fill(100,100,200);
rect(175,100,340,100);
fill(255);
textSize(38);
text("CLICK TO PALY",200,160);
fill(0);
textSize(30);
text("Done By BOBO(TARUN GOVIND KESHAV)",50,300);
textSize(18);
text("mail: tarun.83581#gmail.com",50,330);
noStroke();
if (mousePressed && (mouseButton == LEFT)) {
butt=1;
}
if(butt==1){
background(210);
textSize(32);
text("score :", 100,30);
text(score1,300,30);
text(":",400,30);
text(score2,500,30);
x = x+velx*speed;
y = y+vely*speed;
speed = speed +speed_cont; // speed control value
if(x<=75){
x=350;y=200;score2+=1;
}
if((x>=625)){
x=350;y=200;score1+=1;
}
if((x<=80)&(y>s)&(y<(s+80))){
velx = -velx;
}
if((y>=380)||(y<=20)){
vely = -vely;
}
if((x>=620)&(y>mouseY)&(y<(mouseY+80))){
velx = -velx;
}
ball(x,y);
slider(s);
slider1(mouseY);
}
}
void ball(float x,float y){
fill(0);
arc(x,y,40,40,0,2*PI);
}
void slider(int y){
fill(200,100,100);
rect(20,y,40,80);
}
void keyPressed(){
if(keyCode == UP){s=s-15;}
if(keyCode == DOWN){s = s+15;}
}
void slider1(int y){
fill(200,100,100);
rect(640,y,40,80);
}
On the processing.org website there are 3 GUI libraries listed on the libraries page (https://processing.org/reference/libraries/)
I've worked with http://www.sojamo.de/libraries/controlP5/ before, it's not to hard to get running I will cover your needs.
For a project I made a code that creates a computer wallpaper with icons. One Icon I set to draw a loading bar when clicked (void mousePressed). I want to be able to see the rectangle(loading bar)start at a determined location using RectMode(CORNER) and have the width increase every few seconds until the bar is about 3/4 full and then stop and remain.
please give suggestions
this draws the finished bar but i want to see each increment for a couple seconds
void setup(){
size(800,600);
}
void mousePressed(){
if (mousePressed && mouseX>width/4 && mouseX<width-width/4 && mouseY>height/3 && mouseY<height- height/3){
rectMode(CORNER);
noStroke();
fill(0,180,0,180);
for( int r = 0; r <= 7; r++){
if (r == 1)
i = 50;
rect(width/2-348,height/2-35,i,height/8-4);
if (r == 2)
i = 150;
rect(width/2-348,height/2-35,i,height/8-4);
if (r == 3)
rect(width/2-348,height/2-35,i,height/8-4);
i = 250;
if (r == 4)
rect(width/2-348,height/2-35,i,height/8-4);
i = 350;
if (r == 5)
rect(width/2-348,height/2-35,i,height/8-4);
i = 450;
if (r == 6)
rect(width/2-348,height/2-35,i,height/8-4);
i = 550;
if (r == 7)
rect(width/2-348,height/2-35,i,height/8-4);
i = 650;
}
}
}
Using loop is in processing defined by function loop() and can be stopped by noLoop() also I am using frameCount (contains the number of frames that have been displayed since the program started - each run of draw() function) to count percentage of loaded progress bar and to stop loading on 3/4 as you want.
boolean loading = false;
int fillX = 0;
void setup()
{
size(300,300);
background(0);
noLoop();
}
void draw()
{
stroke(255);
fill(0);
rect(48, 137, 204, 25);
noStroke();
fill(255);
rect(51, 140, fillX, 20);
if(loading == true)
{
fillX = ((frameCount%301) / 3 * 2);
if(frameCount%(300*0.75) == 0)
{
loading = false;
noLoop();
frameCount = 0;
}
}
}
void mousePressed() {
loading = true;
loop();
}
RectMode(CORNER) is default mode so the is no need to specify it unless you are using different modes within project.
Do you want to do something like this?
int time, myWidth;
boolean loading;
void setup(){
size(800,600);
loading = false;
myWidth = 0;
}
void draw(){
drawLoadingBar();
}
void drawLoadingBar(){
if(myWidth < width/3){
if(loading && millis()-time > 1000){
rect(20, height/2, myWidth, 30);
myWidth = myWidth + 10;
time = millis();
}
}
}
void mousePressed(){
if(loading == false){
time = millis();
loading = true;
}
}
This code works by increasing the bar width by 10 every second after the first mouse click.
I'm using controlP5 processing GUI, and I need counter inside draw() function.
I know that draw() function run continuously and every for loop is shown in its last step.
I need to see every step. I have two inputs, and I can input only once, because of draw(). I need draw() function to wait for input or something like that.
import controlP5.*;
Textarea myTextareaMI;
Textarea myTextareaVI;
Textarea my;
String textValueBODOVI = "";
String textValueZVANJE = "";
boolean mi=false, vi=false;
int i=1;
ControlP5 cp5;
int myColor = color(255);
int c1, c2;
float n, n1;
void setup() {
size(320, 480);
noStroke();
PFont font = createFont("arial", 20);
cp5 = new ControlP5(this);
cp5.addButton("NOVA PARTIJA")
.setValue(0)
.setPosition(0, 0)
.setSize(480, 19)
;
cp5.addButton("PONISTI ZADNJI UNOS")
.setValue(100)
.setPosition(0, 20)
.setSize(480, 19)
;
cp5.addBang("MI")
.setPosition(60, 80)
.setSize(60, 20)
.getCaptionLabel().align(ControlP5.CENTER, ControlP5.CENTER)
;
cp5.addBang("VI")
.setPosition(123, 80)
.setSize(60, 20)
.getCaptionLabel().align(ControlP5.CENTER, ControlP5.CENTER)
;
cp5.addTextfield("BODOVI")
.setPosition(60, 41)
.setSize(60, 20)
.setFont(font)
.setColor(color(255, 0, 0))
;
cp5.addTextfield("ZVANJE")
.setPosition(123, 41)
.setSize(60, 20)
.setFont(font)
.setColor(color(255, 0, 0))
;
;
int l=0;
for (int i=1;i<11;i++,l=l+22) {
my = cp5.addTextarea("MIVI"+i).setPosition(60, 101+l).setSize(123, 20).setFont(createFont("arial", 14))
.setLineHeight(14)
.setColor(color(128))
.setColorBackground(color(255, 100))
.setColorForeground(color(255, 100))
;
}
}
public void bang() {
}
void draw() {
delay(15);
background(myColor);
myColor = lerpColor(c1, c2, n);
n += (1-n)* 0.1;
funkcija();
}
void funkcija(){
int suma= 0;
for( i=1;i<=11;i++){
int brojmi=0;
textValueZVANJE = cp5.get(Textfield.class, "ZVANJE").getText();
textValueBODOVI = cp5.get(Textfield.class, "BODOVI").getText();
int bodovi = int(textValueBODOVI);
int zvanje = int(textValueZVANJE);
int mii, vii;
if(bodovi>0){
if (mi) {
println("mi"+brojmi+i);
int ukupno = 162 + zvanje;
vii = ukupno - bodovi;
cp5.get(Textarea.class, "MIVI"+i).setText(textValueBODOVI+" "+vii);
mi=false;
vi=false;
cp5.get(Textfield.class, "BODOVI").clear();
cp5.get(Textfield.class, "ZVANJE").clear();
loop();
}
if (vi) {
println("vi"+i);
int ukupno = 162 + zvanje;
mii = ukupno - bodovi;
cp5.get(Textarea.class, "MIVI"+i).setText(mii+" "+textValueBODOVI);
mi=false;
vi=false;
cp5.get(Textfield.class, "BODOVI").clear();
cp5.get(Textfield.class, "ZVANJE").clear();
}
}
brojmi++; }
}
public void controlEvent(ControlEvent theEvent) {
mi = theEvent.getController().getName().equals("MI");
vi = theEvent.getController().getName().equals("VI");
}
public void clear() {
cp5.get(Textfield.class, "BODOVI").clear();
cp5.get(Textfield.class, "ZVANJE").clear();
}
Mmmmm, I don't know if I got your question.
If your question is: "i need draw() function to wait for input or something like that.", then use a flag (boolean value) to decide if draw or not. When user input something, assign true to that value.
So your code should be:
void draw () {
// put the code you want to run anyways here...
// code
// code
if (hasUserInput) {
// here write the code you should wait to execute
}
}