HEEELP letters moving with no mouse pressed

Processing Libraries
1

Hi Guys I want to make an animated gif with letters but I want the letters to change forms with no mouse Pressed can I do it? And it’s possible to save this gif into png? Thaaanks

import controlP5.*;
boolean record;

ControlP5 cp5;
Group g1;

//vars
int offset = 15;
int orbitRadius = 20;
int radius = 1;

int waveStrengthHorizontal= 5;
int waveStrengthVertical= 5;

float speed = 1;
PFont myFont;

void setupUI()
{  
    cp5 = new ControlP5(this);
    int space = 15;
    int cy = 0;
    int bx = 5;
    int by = 5;
    
    g1 = cp5.addGroup("Parameter")
                .setPosition(100,100)
                .setWidth(250)
                .setBackgroundHeight(100)
                .setBackgroundColor(color(255,50));
    
    cp5.addSlider("offset")
     .setPosition(by, bx + space * cy++)
     .setRange(0,30)
     .setGroup(g1);
     
    cp5.addSlider("orbitRadius")
     .setPosition(by, bx + space * cy++)
     .setRange(0,30)
     .setGroup(g1);
     
    cp5.addSlider("radius")
     .setPosition(by, bx + space * cy++)
     .setRange(0,30)
     .setGroup(g1);
     
    cp5.addSlider("waveStrengthHorizontal")
     .setPosition(by, bx + space * cy++)
     .setRange(0,30)
     .setGroup(g1);
     
    cp5.addSlider("waveStrengthVertical")
     .setPosition(by, bx + space * cy++)
     .setRange(0,30)
     .setGroup(g1);
     
    cp5.addSlider("speed")
     .setPosition(by, bx + space * cy++)
     .setRange(0,30)
     .setGroup(g1);
     
    g1.setPosition(10, height - 120 + 10);
}

void setup()
{
  frameRate(50);
  
  size(500, 500, P2D);
 beginRecord(PDF,"everything.pdf");

  setupUI();
  background(0);
   myFont = createFont("ATSackersHeavyGothic-48.ttf",34);
  
}

void draw()
{
 background(0);

 // text("3",10,10);
  
  int vCount = height / offset;
  int uCount = width / offset;
  
  for(int v = 0; v < vCount; v++)
  {
      for(int u = 0; u < uCount; u++)
      {
          float ox = u * offset;
          float oy = v * offset;
          
          float strength = u * waveStrengthHorizontal + v * waveStrengthVertical;
          int finalSpeed = (int)(360 / speed);
          
          float angle = (float)((((frameCount + strength) % finalSpeed) * Math.PI) / 90);

          float x = (float)(orbitRadius * Math.cos(angle));
          float y = (float)(orbitRadius * Math.sin(angle));
          
          stroke(255);
          fill(255);
          textSize(26);
          text("3",x + ox, y + oy, width/2, height/2);
      }
  }
}

void keyPressed()
{
  if(key == 'h')
  {
     g1.setVisible(!g1.isVisible());    

     if (key == 'q') {
        endRecord();
        exit();
     }
  }
 
  if (record) {
    endRecord();
    record = false;
  }
}

// Use a keypress so thousands of files aren't created
void mousePressed() {
  record = true;
}
1 Like
2

please repair your post and use the

</> code tag

and paste your code in.

( also repair your other recent topics )

now in 2 of them you try to ask something about
mouse pressed,
that is not understood,
if you not want to use the mouse, replace the
export start with a ? ( key == ‘s’ ) keyboard action.

2 Likes
3

Sorry, I want to create a kinetic animation (letters moving again with different direction) but without using the mouse button.

4

-a- why you not repair your code posting?

-b- did you change your code already from mouse click to keyboard ?
( like the PDF export to if ( key == 's' ) )
but
for a singe frame save you must stay close to the example 3 from

with the if ( record ) at begin and end of DRAW()

where is the import line for that library?
import processing.pdf.*;

-c- why you talk about ‘GIF’ and ‘PNG’
for PDF , SVG and DXF export need to use the respective library,
for saving a display window to a picture use:

-d- “letter moving again” is that a project description or a coding question?
start stop a animation ( again, if not mouse use keyboard )
but i not see any code for this?
what is the variable what keeps your characters moving
from one draw loop to the next?

-e- you actually not tell us what is your problem with the

mousePressed

yes, you can not use a general CLICK on the canvas to do one thing
and add use CP5 slider… where you also need to click mouse.

but you could change that export function also to a CP5 button instead keyboard action.

5

Firstly I don’t know how to post my code. Secondly I want the letters to change with time(for a few seconds).

6

import controlP5.;
import processing.pdf.;
boolean record;

ControlP5 cp5;
Group g1;

//vars
int offset = 20;
int orbitRadius = 20;
int radius = 10;

int waveStrengthHorizontal= 15;
int waveStrengthVertical= 5;

float speed = 15;
PFont myFont;

void setupUI()
{

cp5 = new ControlP5(this);
int space = 15;
int cy = 0;
int bx = 5;
int by = 5;

g1 = cp5.addGroup("Parameter")
            .setPosition(100,100)
            .setWidth(250)
            .setBackgroundHeight(100)
            .setBackgroundColor(color(255,50));

cp5.addSlider("offset")
 .setPosition(by, bx + space * cy++)
 .setRange(0,30)
 .setGroup(g1);
 
cp5.addSlider("orbitRadius")
 .setPosition(by, bx + space * cy++)
 .setRange(0,30)
 .setGroup(g1);
 
cp5.addSlider("radius")
 .setPosition(by, bx + space * cy++)
 .setRange(0,30)
 .setGroup(g1);
 
cp5.addSlider("waveStrengthHorizontal")
 .setPosition(by, bx + space * cy++)
 .setRange(0,30)
 .setGroup(g1);
 
cp5.addSlider("waveStrengthVertical")
 .setPosition(by, bx + space * cy++)
 .setRange(0,30)
 .setGroup(g1);
 
cp5.addSlider("speed")
 .setPosition(by, bx + space * cy++)
 .setRange(0,30)
 .setGroup(g1);
 
g1.setPosition(10, height - 120 + 10);

}

void setup()

{
frameRate(50);

size(500, 500, P2D);
beginRecord(PDF,“everything.pdf”);

setupUI();
background(0);
myFont = createFont(“ATSackersHeavyGothic-48.ttf”,34);

}

void draw()
{
background(0);

int vCount = height / offset;
int uCount = width / offset;

for(int v = 0; v < vCount; v++)
{
for(int u = 0; u < uCount; u++)
{
float ox = u * offset;
float oy = v * offset;

      float strength = u * waveStrengthHorizontal + v * waveStrengthVertical;
      int finalSpeed = (int)(360 / speed);
      
      float angle = (float)((((frameCount + strength) % finalSpeed) * Math.PI) / 90);

float x = (float)(orbitRadius * Math.cos(angle));
float y = (float)(orbitRadius * Math.sin(angle));

      stroke(255);
      fill(255);
      textSize(26);
      text("3",x + ox, y + oy, width/2, height/2);
  }

}
}

void keyPressed()
{
if(key == ‘h’)
{
g1.setVisible(!g1.isVisible());

if (key == ‘q’) {
endRecord();
exit();
}
}

if (record) {
endRecord();
record = false;
}
}

void mousePressed() {
record = true;
}Preformatted text

7

You can go back and edit your post (pen icon) or post the code anew

Prior to posting hit ctrl-t in processing to get auto-format

Then post and select the entire code section using the mouse. Then click ’</>’ in the command bar

8

Why I can not do it right? When you said me " Then click ’</>’ in the command bar" where exactly inside my code bar?

9

In Processing: ctrl-t

Then copy and paste it into the forum

Then in the forum select code section with mouse

Then in the forum click the symbol <\> in the command bar OR click ctrl-shift-c

Then click the Reply button

Regards, Chrisir :wink:

10

When editing your code in the forum, highlight the code and format with this </> button

25%20AM
25%20AM746×94 2.77 KB

3 Likes
11

each box where you enter code in the forum has a small command bar right above it

click ’</>’ in the command bar after selecting with mouse