Loading...
Logo
Processing Forum
Hi,

I just want to know if someone can help me with this....I have this code here:


PFont f;
PFont font;
String[] lines;
String joinedText;

String alphabet = "ABCDEFGHIJKLMNOPQRSTUVWXYZÇ1234567890<>'^*`ÄÖÜß,.;:!? ";
int[] counters = new int[alphabet.length()];
boolean[] drawLetters = new boolean[alphabet.length()];

int ledTest = 13;
float soufleX;
float charSize;
color charColor = 0;
int posX = 20;
int posY = 50;

boolean drawGreyLines = false;
boolean drawColoredLines = true;
boolean drawText = true;


String[] poem = {
  "L'art web, l'art au bout des doigts",

};

//gets the number of lines
int numLines = poem.length;

//declare a 2D array, one element (x,y) for ach letter
Letter[][] p1 = new Letter[numLines][];

void setup() {
 
  size(1056,706);

  f = createFont("Helvetica", 12, true);
  textFont(f);
 
 
  // loop over each line
  for (int y = 0; y < p1.length; y++)
  {
    //loop over the letters in that line
    p1[y] = new Letter[poem[y].length()];
    for (int x = 0; x < p1[y].length; x++) {
 
      // create a new letter in each spot
      p1[y][x] = new Letter();
 
      // set the letter, x and y
      p1[y][x].ch = poem[y].charAt(x);
      p1[y][x].x = 50 + x*7;
      p1[y][x].y = 50 + y*30;
    }
  }
}
 
 
void draw() {
  background(255);

 
  // draw each letter
  for (int y= 0; y < p1.length; y++) {
    for (int x = 0; x < p1[y].length; x++) {
      p1[y][x].display();
     
       
    }
   
   
  }
 
  //when mouse is released the letters shake randomly
  if (!mousePressed) {
   
    for (int y= 0; y < p1.length; y++) {
      for (int x = 0; x < p1[y].length; x++) {
        p1[y][x].shake();
      }
    }
  }
  //when mouse is pressed the letters form a text
  else if (mousePressed) {
    for (int y= 0; y < p1.length; y++) {
      for (int x = 0; x < p1[y].length; x++) {
        p1[y][x].home(pmouseX + x*6.6, pmouseY + y*15); // the letters follow the mouse
      }
    }
  }
}


class Letter
{
  float x, y;
  char ch;
 
  void display() {
    fill(0);
    textAlign(CENTER);
    text(ch, x, y);
  }
 
  void shake() {
    x += random(-1, 1);
    y += random(-1, 1);
  }
 
  void home(float homeX, float homeY) {
 x = lerp(x, homeX, .02);
 y = lerp(y, homeY, .02); 
  }
}



and I want to know if it's possible to joint the letters together like in this the picture below and I want to know if it's possible to make them moved with the mousemoved and not the mousepressed ?
Thank you!!


Replies(4)



like this?





Copy code
  1. PFont f;
  2. PFont font;
  3. String[] lines;
  4. String joinedText;
  5. String alphabet = "ABCDEFGHIJKLMNOPQRSTUVWXYZÇ1234567890<>'^*`ÄÖÜß,.;:!? ";
  6. int[] counters = new int[alphabet.length()];
  7. boolean[] drawLetters = new boolean[alphabet.length()];
  8. int ledTest = 13;
  9. float soufleX;
  10. float charSize;
  11. color charColor = 0;
  12. int posX = 20;
  13. int posY = 50;
  14. boolean drawGreyLines = false;
  15. boolean drawColoredLines = true;
  16. boolean drawText = true;
  17. String[] poem = {
  18.   "L'art web, l'art au bout des doigts",
  19. };
  20. //gets the number of lines
  21. int numLines = poem.length;
  22. //declare a 2D array, one element (x,y) for ach letter
  23. Letter[][] p1 = new Letter[numLines][];
  24. void setup() {
  25.   size(1056, 706);
  26.   f = createFont("Helvetica", 12, true);
  27.   textFont(f);
  28.   // loop over each line
  29.   for (int y = 0; y < p1.length; y++)
  30.   {
  31.     //loop over the letters in that line
  32.     p1[y] = new Letter[poem[y].length()];
  33.     for (int x = 0; x < p1[y].length; x++) {
  34.       // create a new letter in each spot
  35.       p1[y][x] = new Letter();
  36.       // set the letter, x and y
  37.       p1[y][x].ch = poem[y].charAt(x);
  38.       p1[y][x].x = 50 + x*7;
  39.       p1[y][x].y = 50 + y*30;
  40.     }
  41.   }
  42. } // func
  43. void draw() {
  44.   background(255);
  45.   // draw each letter
  46.   for (int y= 0; y < p1.length; y++) {
  47.     for (int x = 0; x < p1[y].length; x++) {
  48.       if (x<p1[y].length-1) {
  49.         stroke(177); // connect
  50.         line (p1[y][x].x, p1[y][x].y, p1[y][x+1].x, p1[y][x+1].y);
  51.       }
  52.       // write letter
  53.       p1[y][x].display();
  54.     }
  55.   }
  56.   //when mouse is Pressed (was released) the letters shake randomly
  57.   if (mousePressed) {
  58.     for (int y= 0; y < p1.length; y++) {
  59.       for (int x = 0; x < p1[y].length; x++) {
  60.         p1[y][x].shake();
  61.       }
  62.     }
  63.   }
  64.   //when mouse is (not) pressed the letters form a text
  65.   else if (!mousePressed) {
  66.     for (int y= 0; y < p1.length; y++) {
  67.       for (int x = 0; x < p1[y].length; x++) {
  68.         p1[y][x].home(pmouseX + x*6.6, pmouseY + y*15); // the letters follow the mouse
  69.       }
  70.     }
  71.   }
  72. }
  73. // =========================================================================
  74. class Letter
  75. {
  76.   float x, y;
  77.   char ch;
  78.   void display() {
  79.     fill(0);
  80.     textAlign(CENTER);
  81.     text(ch, x, y);
  82.   }
  83.   void shake() {
  84.     //x += random(-1, 1);
  85.     //y += random(-1, 1);
  86.     int myDistance=int( .05 * dist(x, y, mouseX, mouseY));
  87.     if (random (100) > 90) {
  88.       x += random(-myDistance, myDistance);
  89.       y += random(-myDistance, myDistance);
  90.     }
  91.   }
  92.   void home(float homeX, float homeY) {
  93.     x = lerp(x, homeX, .02);
  94.     y = lerp(y, homeY, .02);
  95.   }
  96. }

Chrisir





Nice Thank!!

But can it be like the letters shake randomly with the lines (just like you did) on a certain point (juste like in the first code) and when the mouse is pressed they become the sentence, follow the mouse and on the mouseReleased the letters stay there and shake randomly again (with the joint lines). Actually, is just add the joint lines to the letters in the first code.
Thank you very much you help me a lot...(I'm not that good in processing)

thanks again!!




like this...



Copy code
  1. PFont f;
  2. PFont font;
  3. final float mySpacing = 6.6; // spacing between letters; 16.6 for sizze 36; 6.6. for size 12
  4. String[] lines;
  5. String joinedText;
  6. String alphabet = "ABCDEFGHIJKLMNOPQRSTUVWXYZÇ1234567890<>'^*`ÄÖÜß,.;:!? ";
  7. int[] counters = new int[alphabet.length()];
  8. boolean[] drawLetters = new boolean[alphabet.length()];
  9. int ledTest = 13;
  10. float soufleX;
  11. float charSize;
  12. color charColor = 0;
  13. int posX = 20;
  14. int posY = 50;
  15. boolean drawGreyLines = false;
  16. boolean drawColoredLines = true;
  17. boolean drawText = true;
  18. String[] poem = {
  19.   "L'art web, l'art au bout des doigts",
  20. };
  21. //gets the number of lines
  22. int numLines = poem.length;
  23. //declare a 2D array, one element (x,y) for each letter
  24. Letter[][] p1 = new Letter[numLines][];
  25. void setup() {
  26.   size(1056, 706);
  27.   f = createFont("Helvetica", 14, true);
  28.   textFont(f);
  29.   // loop over each line
  30.   for (int y = 0; y < p1.length; y++)
  31.   {
  32.     //loop over the letters in that line
  33.     p1[y] = new Letter[poem[y].length()];
  34.     for (int x = 0; x < p1[y].length; x++) {
  35.       // create a new letter in each spot
  36.       p1[y][x] = new Letter();   // could use constructor here
  37.       // set the letter, x and y
  38.       p1[y][x].ch = poem[y].charAt(x);
  39.       p1[y][x].x = 50 + x*7;
  40.       p1[y][x].y = 50 + y*30;
  41.     }
  42.   }
  43. } // func
  44. void draw() {
  45.   background(255);
  46.   // draw each letter
  47.   for (int y= 0; y < p1.length; y++) {
  48.     for (int x = 0; x < p1[y].length; x++) {
  49.       if (x < p1[y].length-1) {
  50.         // connect with lines
  51.         p1[y][x].connect(y, x+1);
  52.       }
  53.       // write letter
  54.       p1[y][x].display(x*2);
  55.     }
  56.   }
  57.   //when mouse is released the letters shake randomly
  58.   if (!mousePressed) {
  59.     for (int y= 0; y < p1.length; y++) {
  60.       for (int x = 0; x < p1[y].length; x++) {
  61.         p1[y][x].shake();
  62.       }
  63.     }
  64.   }
  65.   //when mouse is pressed the letters form a text
  66.   else if (mousePressed) {
  67.     for (int y= 0; y < p1.length; y++) {
  68.       for (int x = 0; x < p1[y].length; x++) {
  69.         p1[y][x].home(pmouseX + x*mySpacing, pmouseY + y*15); // the letters follow the mouse
  70.       }
  71.     }
  72.   }
  73. }
  74. // =========================================================================
  75. class Letter {
  76.   float x, y;
  77.   char ch;
  78.   // has no constructor yet
  79.   void display( int a ) {
  80.     //fill(a+80, 0, 0);
  81.     fill(0, 0, 0);   
  82.     textAlign(CENTER);
  83.     text(ch, x, y);
  84.   }
  85.   void shake() {
  86.     x += random(-1, 1);
  87.     y += random(-1, 1);
  88.     /*
  89.     int myDistance=int( .05 * dist(x, y, mouseX, mouseY));
  90.      if (random (100) > 80) {
  91.      x += random(-myDistance, myDistance);
  92.      y += random(-myDistance, myDistance);
  93.      }
  94.      */
  95.   } // func
  96.   void home(float homeX, float homeY) {
  97.     x = lerp(x, homeX, .02);
  98.     y = lerp(y, homeY, .02);
  99.   }
  100.   void connect(int elementX, int elementY) {
  101.     // connect with lines
  102.     stroke(177);
  103.     line (x, y,
  104.     p1[elementX][elementY].x, p1[elementX][elementY].y);
  105.   }
  106. } // class




Nice Thank you very much it works so well!!!