# Write lines in random sizes one below the other

**URL:** <https://discourse.processing.org/t/write-lines-in-random-sizes-one-below-the-other/27139>\
**Category:** Coding Questions\
**Created:** [January 17, 2021, 11:27am UTC](https://discourse.processing.org/t/write-lines-in-random-sizes-one-below-the-other/27139 "2021-01-17T11:27:00Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![Ida](https://avatars.discourse-cdn.com/v4/letter/i/ed655f/32.png) [@Ida](https://discourse.processing.org/u/Ida)\
**Post date:** [January 17, 2021, 11:27am UTC](https://discourse.processing.org/t/write-lines-in-random-sizes-one-below-the-other/27139/1 "2021-01-17T11:27:00Z")

</div>

Hey,

I am having trouble with my code. I split my text into lines, which should be drawn in random sizes to the screen. Now, there are two problems: First of all splitTokens deletes all my delimiters, but also ', – and umlauts like ä, ü, ö from the text. Is there a way to add them again to the lines? And second, how could I write more than just one line per frame but all lines that fit in the screen each below the other and then go to the next frame?  
Is there a solution or am I making something completely wrong?  
I am relatively new to Processing, so every answer is helpful. Thanks a lot!

```auto
PFont font;

  String [] lines;
  int index = 0;

void setup() {
  size(1000,100);
  font = createFont("Menlo-Regular", 20);
  String [] s = loadStrings("text.txt");
  String everything = join(s, " ");
  println(everything);
  lines = splitTokens(everything,",.?!;:");
  
  printArray(lines);
  frameRate(2);
}

void draw() {
  background(0);
  textFont(font);
  
  textSize(random(10,50));
  text(lines[index], 10, 20);

  index++;

  saveFrame("output/line_####.png");
  }

```

---

<div class="post-metadata">

**Author:** ![CodeMasterX](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/codemasterx/32/2942_2.png) [@CodeMasterX](https://discourse.processing.org/u/CodeMasterX)\
**Post date:** [January 17, 2021, 11:59am UTC](https://discourse.processing.org/t/write-lines-in-random-sizes-one-below-the-other/27139/2 "2021-01-17T11:59:48Z")

</div>

> [@Ida](#):
>
> ä, ü, ö

this means the font does not include these characters,

> [@Ida](#):
>
> st one line per frame

```auto
for(int i = 0; i < <number of draw repeats> ; i++) { 
    <functions inside draw();> 
}

```

---

<div class="post-metadata">

**Author:** ![Ida](https://avatars.discourse-cdn.com/v4/letter/i/ed655f/32.png) [@Ida](https://discourse.processing.org/u/Ida)\
**Post date:** [January 17, 2021, 3:15pm UTC](https://discourse.processing.org/t/write-lines-in-random-sizes-one-below-the-other/27139/3 "2021-01-17T15:15:22Z")

</div>

Thanks for your help.  
But how can I write lines below previous lines all at once?

---

<div class="post-metadata">

**Author:** ![Ida](https://avatars.discourse-cdn.com/v4/letter/i/ed655f/32.png) [@Ida](https://discourse.processing.org/u/Ida)\
**Post date:** [January 17, 2021, 3:16pm UTC](https://discourse.processing.org/t/write-lines-in-random-sizes-one-below-the-other/27139/4 "2021-01-17T15:16:13Z")

</div>

> [@CodeMasterX](#):
>
> this means the font does not include these characters,

I already checked this. The font does include these characters.

---

<div class="post-metadata">

**Author:** ![CodeMasterX](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/codemasterx/32/2942_2.png) [@CodeMasterX](https://discourse.processing.org/u/CodeMasterX)\
**Post date:** [January 17, 2021, 5:28pm UTC](https://discourse.processing.org/t/write-lines-in-random-sizes-one-below-the-other/27139/5 "2021-01-17T17:28:40Z")

</div>

try ![image](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/6/68c96caaf2bb98b3e380f4e4eaa27c11f78f71f0.png) option in preferences. To get the previous lines do something like: (A simplified form)

```auto
int a = 0;
void draw() {
   for(int i = 0; i < a; i++) {
       print(i);
   }
   println();
   a++;
}

```

which returns:  
frame 1: -  
frame 2: 0  
0 1  
0 1 2  
0 1 2 3  
0 1 2 3 4  
0 1 2 3 4 5  
0 1 2 3 4 5 6  
…  
do something similar

or

```auto
ArrayList<PVector> pos = new ArrayList<PVector>();

void setup() {
  size(600,600);
}
void draw() {
  background(0);
  noFill();
  stroke(255);
  pos.add(new PVector(random(width),random(height)));
  beginShape();
  for(int i = 0; i < pos.size(); i++) vertex(pos.get(i).x, pos.get(i).y);
  endShape();
}

```