Tagged with #text - Processing 2.x and 3.x Forum

Display Text and Strings for debugging

GLV — Mon, 01 Jan 2018 19:26:57 +0000

Hello,

I display text in the console and on screen (graphics window) as required primarily for debugging. Ease of use and editing is important. I posted a sample of code that I wrote and use to display to screen.

Feedback and suggestions welcome.

Added a picture.

GLV

// Author: GLV
// Updated 2018-01-01
// Version 00
// "https://" + "forum.processing.org/two/discussion/25778"
// Displays strings and numerical data on screen primarily for debugging
// Neatly formatted and decimal points align
// Easy to distinguish between ints and floats
// Ease of use and editing a requirement for use in different programs
// I can cut and paste the two columns and easily edit these!
// I may create a class for this later...

//Some variables used for display
  float float1 = PI;
  float float2 = PI;
  float float3 = PI;

  int int1 = 1;
  int int2 = 2;
  int int3 = 3;
  int int4 = 4;
  int int5 = 5;

  int x, y;

public void settings() 
  {  
  size(displayWidth, displayHeight); 
  }

public void setup()
  {
  }

public void draw()
  { 
  background(0);

  int4 = mouseX - mouseY;
  float1 = 10*sin (mouseX/100.0);
  float2 = 10*sin (mouseY/100.0);

  dispText3(width/2,height/2);

  dispText3(20, 20);
  }

// Method dispText3: 
// Displays neatly formatted colums (2 columns) of strings and values for debugging
// Used as an alternative to console as required

int i3;                                     // Needed a global i3 to increment i

void dispText3(int x_loc, int y_loc)
  {
  //location of text on screen
  int x3 = x_loc;
  int y3 = y_loc;

  //offsets for x and y 
  int x3_off = 200;                        //offset for column column 2 
  int y3_off = -30;                      //offset (spacing) for rows  I made this a global for now.

// Display string text for column (left)

  textSize(24);
  textAlign(LEFT, TOP);

//  y3 = y3 - y3_off;                      // Not used                 
  i3=0;  
  text("int1           ", x3,   y3i(y3, y3_off)); 
  text("int2           ", x3,   y3i(y3, y3_off)); 
  text("float1         ", x3,   y3i(y3, y3_off));  
  text("mouseX         ", x3,   y3i(y3, y3_off)); 
  text("mouseY         ", x3,   y3i(y3, y3_off)); 
  text("x              ", x3,   y3i(y3, y3_off)); 
  text("y              ", x3,   y3i(y3, y3_off)); 
  text("float2         ", x3,   y3i(y3, y3_off)); 
  text("int3           ", x3,   y3i(y3, y3_off)); 
  text("int4           ", x3,   y3i(y3, y3_off)); 
  text("int5           ", x3,   y3i(y3, y3_off)); 
  text("float3         ", x3,   y3i(y3, y3_off));  

// Display numerical text for column (right)

//  textSize(24);
  textAlign(RIGHT, TOP);

  x3 = x3 + x3_off;                         //offset for right column
  int f = 53;                               //offset for floating point numbers to align decimal point  
  i3 = 0;                                   //reset i for next column
  text(int1,              x3,   y3i(y3, y3_off)); 
  text(int2,              x3,   y3i(y3, y3_off)); 
  text(float1,            x3+f, y3i(y3, y3_off)); 
  text(mouseX,            x3,   y3i(y3, y3_off)); 
  text(mouseY,            x3,   y3i(y3, y3_off)); 
  text(x,                 x3,   y3i(y3, y3_off)); 
  text(y,                 x3,   y3i(y3, y3_off)); 
  text(float2,            x3+f, y3i(y3, y3_off)); 
  text(int3,              x3,   y3i(y3, y3_off)); 
  text(int4,              x3,   y3i(y3, y3_off)); 
  text(int5,              x3,   y3i(y3, y3_off)); 
  text(float3,            x3+f, y3i(y3, y3_off)); 
  } 

// Method y3i: 
// increments\offets each line (by off) with each function call until i3 reset to i3 = 0;

int y3i(int y_loc, int y_off)
  {
  y_loc =  y_loc - i3*y_off;
  i3++; 
  return  y_loc;
  }

How to display one letter at the time?

juozap — Wed, 03 Aug 2016 15:33:14 +0000

Hello, Processers!

Here I have this simple matter, I'd wish to display (write) a certain text (best out from txt. file) one letter at the time. This' I'd assume would't be difficult, but there's more: Could it be possible to write characters on top of each other until program encounters characters such as vowels and spaces and then write the text with normal spacing again? For example: if text such as "quick brown fox jumps" comes up, processing would display "q" and "i" on top of each other, then "i", and then "c", "k" overlayed again. Then space, "b", "r", "o" on top of each other, and "w" and "n" on one another and so on.

Help from you guys would be much much appreciated!!

Text boxes randomly become skinnier

ailurophile — Sat, 07 May 2016 17:46:05 +0000

I’m trying to put some justified-left text in a text box that is centered horizontally. I thought this would work:

text( message, width / 2 - w / 2, height / 3 + 50, w, height )

(w represents the width of the text box.)

And it does work, but only sometimes — other times, the right side of the text box moves to the left, making the box skinnier and off-center. I see no pattern to how this happens, besides the fact that once it happens once, it happens every time afterwards. This is true across multiple classes that do this same thing. Do you know why this might happen?

need help with 3d text transformation

ira_ira — Mon, 21 Mar 2016 19:51:14 +0000

Hi all! I want to do something like this in processing: https://mir-s3-cdn-cf.behance.net/project_modules/disp/7d7bf511219015.560f42336f0bd.gif I have one image which I use as a texture and I'm constructing complicated plane with beginShape(TRIANGLE_STRIP) to reach
a similar effect, but it's quite difficult to render texture with letters on such complicated object. I thought that it would be much easier to have one rect with this inscription and after that blent this rectangle in different ways. But I have no idea how to do this? I will be very thankful for any suggestion!

Typography rule in text with processing

maxarch — Sat, 05 Mar 2016 23:37:45 +0000

Is there a way to formatting text , like using a hyphen ( and control it ), kerning:optical, setting some open type option like (ligature, small Cap)? Or convert code from a web page like bold < p > < b > is there any control for text into text box.

    textAlign()
textFont()
textMode()
textSize()
textLeading()
textWidth()
textAscent()
textDescent()

[HELP] Make a text Appearing Letter by Letter

GGileWP — Tue, 05 May 2015 08:41:46 +0000

hi, i'm an italian student and i'm learning this fantastic programming language :)

i'm doing a project for my university, where i would like to have a text (internal or with an external file doesn't matter) that appears letter by letter like i'm typing it manually, is it possible? i'm searching everywhere but i was capable only to draw a WORD than substitute it with another word, but is not my case i want that all the letters i type stay and generate a full text ^^ i hope my english is good enough to let you understand what i need.

thanks any help would be 100% appreciated

Need help! Mirroring text movement on x axis?

Bart — Tue, 29 Sep 2015 20:51:00 +0000

The text in the sketch needs to be on the face and following the face. On x axis but it is moving the opposite direction.

code:

import gab.opencv.*;
import processing.video.*;
import java.awt.*;

String text2 = "";

Capture video;
OpenCV opencv;

void setup() {
  size(640*2, 480*2);
  video = new Capture(this, 640, 480);
  opencv = new OpenCV(this, 640, 480);
  opencv.loadCascade(OpenCV.CASCADE_FRONTALFACE);  

  textFont(createFont("Menlo",(5)));

  video.start();
}


void draw() {
  pushMatrix();
  opencv.loadImage(video);
  //background(0); //voor zwarte achtergrond onder tekst
     scale(-1,1);// spiegelen van beeld
     translate(-video.width, 0); //terug plaatsen in kader/
     image(video, 0, 0); // activeer of deactiveer code voor vieobeeld of niet
     scale(-1,1); // spiegel tekst nog een keer
    textSize(40);
//    text(text2, 30, 30);
    textAlign(CENTER);
    text2 = "Watching You";

//  noFill();
//  stroke(255, 0, 0);
//  strokeWeight(300);
  Rectangle[] faces = opencv.detect();
  println(faces.length); //deactiveer voor geen print output in beeld
//scale(-1,1); // spiegel tekst nog een keer  --- deze niet???

// I think the problem maybe somewhere??  V

    for (int i = 0; i < faces.length; i++) {
    println(faces[i].x + "," + faces[i].y);  //deactiveer voor geen print output in beeld
//    rect(faces[i].x, faces[i].y, faces[i].width, faces[i].height);
    text(text2,faces[i].x-width, faces[i].y,width,width);
  }  
      popMatrix();
}

void captureEvent(Capture c) {
  c.read();
}

Is there a way to access the default textsize?

Eeyorelife — Wed, 23 Sep 2015 18:15:19 +0000

in my code I use the default textsize and then I change it and then I want it to go back to the default again. I've found that textsize 12 is almost the same as the default, but size 12 makes a weird extra space between lines every 8th line. It's annoying and it's messing up my code.

Adding text to file with void provisions? Look for text ("Hello", 30, 30); Syntax error.

Ystira — Mon, 07 Sep 2015 20:02:16 +0000

//// Wild circles #2.
String title=  "Click for another circle.";
String subtitle=  "Press any key to erase.";
String author=  "Bruce Alan Martin";

text("Hello", 30, 30);

// GLOBAL VARIABLES //
float x,y;
int h,w;

// Setup:  screen size, initialization. //
void setup() {
  size(500, 500);
  x=  width/2;
  y=  height/2;
  w=  80;          // width of ellipse.
  h=  80;          // height of ellipse
}


// Next frame. //
void draw() {
  text( title, 10, 10 );
  text( subtitle, width/2, 10 );
  text( author, 10, height-10 );
  text( w+"x"+h, width/2,height-10 );
  //
  ellipse(x, y, w, h);
}


//  Handle mouse clicks //
void mousePressed() {
  x=  mouseX;
  y=  mouseY;
}


//  Handle keyboard //
void keyPressed() {
  // Erase everything, change size & color. //
  background( random(255), random(255), random(255) );
  fill( random(255), random(255), random(255) );
  w=  int( random(50,150) );
  h=  int( random(50,150) );
}

add text to PImage

ondsinet_ — Wed, 29 Jul 2015 21:29:44 +0000

My program saves videos from some webcams connected to the pc. I used to draw the Capture to the screen,add some information of the video(duration,time ...) and then take a screenshot of the sketch,and tehn repeat for every webcam. Now to extend the program I directly save the Capture as PImage, but how do I add the text to the image?

Text Scale animation

phoebus — Thu, 23 Jul 2015 14:07:37 +0000

Hi there

I've just franckencode, using code I found here, this sketch to see if I could get some nice subtle UI anim in processing but this anim is really not smooth

Is it possible to get a better animation ?

String message = "press spacebar";
float visualTextSize = 6;

//anim
int startTime;
int stopTime;
int duration = 2000;
float s = 4 ;
boolean ON;
boolean up;

void setup()
{
  size(400, 300);
  smooth();
  textAlign(CENTER, CENTER);
  rectMode(CENTER);
  textFont(createFont("Arial", 30), 30);
}

void draw()
{
  background(128, 128, 128);
  noFill();
  textSize(visualTextSize);

  autoBall();
  // println(s);

  translate(width/2, height/2);
  scale(s);
  translate(-width/2, -height/2);

  //rect(width/2,height/2,textWidth(message),visualTextSize);
  fill(255);

  text2(message, width/2, height/2);
}

void text2(String textToDisplay, float xPos, float yPos)
{
  pushMatrix();

  float matrixScale = g.getMatrix().get(null)[0];
  PVector newTextPos = new PVector(0, 0);
  g.getMatrix().mult(new PVector(xPos, yPos), newTextPos);
  resetMatrix();

  float origTextSize = g.textSize;
  textSize(matrixScale*origTextSize);
  text(textToDisplay, newTextPos.x, newTextPos.y);
  textSize(origTextSize);

  popMatrix();
}

void clock() {
  startTime = millis();
  stopTime = startTime + duration;
}


void  keyPressed() {
  if (keyCode == ' ' ) {
    ON = true ;
    clock();
  }
}

float autoBall() {

  if (ON) {

    if (up != true) {
      if  (millis () < stopTime) {
        s = map(millis(), startTime, stopTime, 4, 5);
      } else {
        up =true;
        clock();
      }
    }

    if (up) {
      if  (millis () < stopTime) {
        s = map(millis(), startTime, stopTime, 5, 4);
      } else {
        up =false;
        clock();
      }
    }
    return s;
  }
  return 111.0;
}

Naming a text file with date and time

stitchineer — Mon, 13 Jul 2015 17:10:27 +0000

I have a program that receives data as it is posted in the serial port of an Arduino program, and as the data is received, it saves to a text file. This part works fine.

I want to create a textfile with the date and time at the start of the program, and save all subsequent data to that same file for the duration of that run, however, it creates a new text file every minute. I have tried every combination that I could think of to fix this, but for some reason, the saveStrings() function will not accept the name of a string variable as an argument.

Here is my code below that works, but creates a new .txt file every minute

//(dataOutput is the name of array to which each new line of data is appended)
void setup(){
    output = createWriter(month()+"."+day()+"-"+hour()+"h"+minute()+".txt");
}
void saveData(){
    saveStrings(month()+"."+day()+"-"+hour()+"h"+minute()+".txt", dataOutput);
}

This is how I want it to work

void setup(){
    String title = month()+"."+day()+"-"+hour()+"h"+minute()+".txt"
    output = createWriter(title);
}
void saveData(){
    saveStrings(title, dataOutput);
}

I have tried a multitude of things in the saveStrings(String, String[]) function with the first argument being: output, dataOutput, PrintWriter, PrintWriter(title), createWriter(title), etc.

Does anyone know of a solution? I have only been using Processing for a week, so I feel like I am floundering around in the dark.

Thanks in advance!

Colour wheel with text inside

SimplyEnvision — Mon, 06 Jul 2015 01:57:22 +0000

Hey there everyone,

So I'm trying to draw a colour wheel with one colour per musical note, and then print the name of the note inside of it's corresponding wheel piece. This is the relevant code:

  int numColors = 12;
  int wheelDiameter = 600;
  float colorSpacing = 1;
  int wheelThickness = 120;
  arrayNotes = { "Do C", "Do# Reb C# Bb", "Re D", "Re# Mib D# Eb", "Mi E", "Fa F", "Fa# Solb F# Gb", 
                   "Sol G", "Sol# Lab G# Ab", "La A", "La# Sib A# Bb", "Si B" };

  if ((runMode == 7)) {

    colorMode(HSB, 360, 100, 100);
    background(0);

    strokeWeight(wheelThickness);
    noFill();
    strokeCap(SQUARE);

    int colorAngle = 360/numColors;

    pushMatrix();
    translate(width/2, height/2);


    for (int i = 0; i < numColors; i++) {

      float startAngle = i * colorAngle + colorSpacing;
      float stopAngle = (i + 1) * colorAngle - colorSpacing;

      //Colour
      stroke(startAngle, 80, 90);
      arc(0, 0, wheelDiameter, wheelDiameter, radians(startAngle), radians(stopAngle));

      textSize(28);

      text(arrayNotes[i], (wheelDiameter/2 + wheelThickness/2) * cos(i*PI/6 + PI/12), 
      (wheelDiameter/2 + wheelThickness/2)* sin(i*PI/6 + PI/12));

    }

    popMatrix();

  }

But for some reason even though the order is right, I paint the wheel piece first and then the text, the text appears behind the wheel. What am I doing wrong? Once I get this right then I want to make sure the text fits inside the wheel. Also, the font seems to be blurry, but I guess that's because I didn't set up a font with PFont?

Any suggestions will be greatly appreciated!

text follow voice

aletropdj — Thu, 28 May 2015 08:43:25 +0000

Hi all,

Im trying to write a code where the text follow the voice. Something like this but less complicated:

tips are welcomed.

Help in Visualization of Data

RifleGirl — Tue, 14 Apr 2015 11:42:29 +0000

I want the images to scale slowly, given an array of values I have, when I click. I also want the text in the corner to change at the same time. What do I need to change in both my logic of this as well as the code to make this work?

//Project in Visualization

void setup()
{
  size(700,700);
  smooth();
  USA = loadImage("map.png");
  bfly = loadImage("bfly.jpg");
}

void draw()
{
  background(255);
  image(USA,-160,-50,1000,880);
  for (int i = 0; i < 4; i++)
  {
    if(mousePressed)
    {
      i++;
    //florida
    image(bfly,450,460,F[i],F[i]);
    //New England
    image(bfly,460,360,NE[i],NE[i]);
    //mexico
    image(bfly,280,540,M[i],M[i]);
    //north dakocta
    image(bfly,290,280,ND[i],ND[i]);
    }
  }
}

void mousePressed()
 {
   textSize(60);
   fill(0); 
   text("2000", 30, 600);
   noLoop();
 }

PImage USA;
PImage bfly;

Change Text by Clicking

RifleGirl — Tue, 14 Apr 2015 02:47:41 +0000

How would you change the text in a specific area by clicking.

I tried void mousePressed but am having difficulty with getting the old number to disappear.

Error due to text

fahadkalis — Wed, 08 Apr 2015 15:32:47 +0000

I am writing a program, to put some text on graphic window. But I am getting below error on it. if I disable text option, it start working well. Can you plz guide me on how do I resolve it.

CODING:-

PImage img;
int pitch=-5; 

void setup() {
  size(448,299, P3D); 
  img=loadImage("imagei.jpg");
  }

void draw() {
  background(img);
  text("ROC   "   + (pitch+5),045,25); 
  }

ERROR:-

Framebuffer error (framebuffer unsupported), rendering will probably not work as expected Read http://wiki.processing.org/w/OpenGL_Issues for help.
OpenGL error 1280 at bot beginDraw(): invalid enumerant
OpenGL error 1286 at bot beginDraw(): invalid framebuffer operation
OpenGL error 1286 at top endDraw(): invalid framebuffer operation
java.lang.RuntimeException: java.lang.RuntimeException: Cannot validate shader program:
Unknow error
    at com.jogamp.common.util.awt.AWTEDTExecutor.invoke(AWTEDTExecutor.java:58)
    at jogamp.opengl.awt.AWTThreadingPlugin.invokeOnOpenGLThread(AWTThreadingPlugin.java:103)
    at jogamp.opengl.ThreadingImpl.invokeOnOpenGLThread(ThreadingImpl.java:206)
    at javax.media.opengl.Threading.invokeOnOpenGLThread(Threading.java:172)
    at javax.media.opengl.Threading.invoke(Threading.java:191)
    at javax.media.opengl.awt.GLCanvas.display(GLCanvas.java:541)
    at processing.opengl.PJOGL.requestDraw(PJOGL.java:688)
    at processing.opengl.PGraphicsOpenGL.requestDraw(PGraphicsOpenGL.java:1651)
    at processing.core.PApplet.run(PApplet.java:2254)
    at java.lang.Thread.run(Unknown Source)
Caused by: java.lang.RuntimeException: Cannot validate shader program:
Unknow error
    at processing.core.PGraphics.showException(PGraphics.java:7852)
    at processing.opengl.PShader.init(PShader.java:936)
    at processing.opengl.PShader.getAttributeLoc(PShader.java:605)
    at processing.opengl.PShader.loadAttributes(PShader.java:1123)
    at processing.opengl.PGraphicsOpenGL.getPolyShader(PGraphicsOpenGL.java:6786)
    at processing.opengl.PGraphicsOpenGL.flushPolys(PGraphicsOpenGL.java:2468)
    at processing.opengl.PGraphicsOpenGL.flush(PGraphicsOpenGL.java:2415)
    at processing.opengl.PGraphicsOpenGL.endDraw(PGraphicsOpenGL.java:1712)
    at processing.core.PApplet.handleDraw(PApplet.java:2404)
    at processing.opengl.PJOGL$PGLListener.display(PJOGL.java:862)
    at jogamp.opengl.GLDrawableHelper.displayImpl(GLDrawableHelper.java:665)
    at jogamp.opengl.GLDrawableHelper.display(GLDrawableHelper.java:649)
    at javax.media.opengl.awt.GLCanvas$10.run(GLCanvas.java:1289)
    at jogamp.opengl.GLDrawableHelper.invokeGLImpl(GLDrawableHelper.java:1119)
    at jogamp.opengl.GLDrawableHelper.invokeGL(GLDrawableHelper.java:994)
    at javax.media.opengl.awt.GLCanvas$11.run(GLCanvas.java:1300)
    at java.awt.event.InvocationEvent.dispatch(Unknown Source)
    at java.awt.EventQueue.dispatchEventImpl(Unknown Source)
    at java.awt.EventQueue.access$200(Unknown Source)
    at java.awt.EventQueue$3.run(Unknown Source)
    at java.awt.EventQueue$3.run(Unknown Source)
    at java.security.AccessController.doPrivileged(Native Method)
    at java.security.ProtectionDomain$1.doIntersectionPrivilege(Unknown Source)
    at java.awt.EventQueue.dispatchEvent(Unknown Source)
    at java.awt.EventDispatchThread.pumpOneEventForFilters(Unknown Source)
    at java.awt.EventDispatchThread.pumpEventsForFilter(Unknown Source)
    at java.awt.EventDispatchThread.pumpEventsForHierarchy(Unknown Source)
    at java.awt.EventDispatchThread.pumpEvents(Unknown Source)
    at java.awt.EventDispatchThread.pumpEvents(Unknown Source)
    at java.awt.EventDispatchThread.run(Unknown Source)

Display Upside Down Text

knowyourenemy — Wed, 08 Apr 2015 10:27:54 +0000

Hi everyone, How to display text or strings upside down in processing (android mode)? This is so that people on both sides of the screen can have text facing them.

Text on gui screen

fahadkalis — Mon, 23 Mar 2015 21:36:53 +0000

Hi, I am writing a program, to show some text on gui screen and also able to change it time to time according to my requirement. Can you please guide on how do I print text on GUI screen.

PImage img;

void setup() {
  size(448,299,P3D);
  }

void draw() {
  img=loadImage("imagei.jpg");
  background(img);
 }

New Line in String Text

OrionMedia — Wed, 11 Mar 2015 21:11:05 +0000

Hello. So the problem that I'm having is developing a text box. I was able to find codes to make the initial box, however when I type in it, the first line goes on forever. How do I make it so that when it reaches the end of the box the text will start to flow on a new line?

Here is my code for reference:

PFont font, font2, font3;

int currentString = 0;
String current = "";
String art1T = "";
String art1B = "";

color white   = color(255,255,255);
color black   = color(0,0,0);
color darkRed = color(100,0,0);
color orange  = color(255,165,0);
color yellow  = color(255,255,0);
color green   = color(0,200,0);
color cyan    = color(0,225,225);
color blue    = color(0,50,255);
color purple  = color(225,0,225);
color currentColor;
color art1Tc= 50;
color art1Bc= 50;

int art1Tp;
int art1Bp;
int a = 0;
int b = 0;
int c = 0;

float circleX, circleXB, circleXC;
float circleY, circleYB;

void setup(){
  size(600,750,P3D);
  background(0);
  font = loadFont("TrajanPro3-Regular-20.vlw");
  font2 = loadFont("TimesNewRomanPSMT-24.vlw");
  font3 = loadFont("TimesNewRomanPSMT-16.vlw");
  frameRate(24);
}

void draw() {
  float art1Tp = textWidth (art1T);
    float art1Bp = textWidth (art1B);
   stroke(50);
    if (mouseX >= 60 && mouseX <= 540 && mouseY >= 40 && mouseY <= 65) {
      if(mousePressed){
        currentString = 1;
        current = art1T;
      }
    }   
    fill(art1Tc);
    rect(50,35,500,30,10);

    if (mouseX >= 60 && mouseX <= 540 && mouseY >= 120 && mouseY <= 600) {
      if(mousePressed){
        currentString = 2;
        current = art1B;
      }
    }
    fill(art1Bc);
    rect(50,110,500,500,10);
    if(currentString == 1){
      line(art1Tp+50, 40, art1Tp+50, 65);
      art1T = current;
      art1Tc= 150;
      art1Bc= 50;
    }else if(currentString == 2){
      line(art1Bp+50, 115, art1Bp+50, 140);
      art1B = current;
      art1Tc= 50;
      art1Bc= 150;
      }
    textFont(font);
    fill(255,0,0,255);
    text("Story Title",50,30);
    text("Tell Me Your Story",50,100);

    textFont(font2);
    fill(currentColor);
    text(art1T, 60, 60);

    textFont(font3);
    fill(currentColor);
    text(art1B, 60, 130);
}

    void keyPressed() {
  if (keyCode == BACKSPACE) {
    if (current.length() > 0) {
      current = current.substring(0, current.length()-1);
    }
  } 
  else if (keyCode != SHIFT && keyCode != CONTROL && keyCode != ALT) {
    current = current + key;
  }
}

Thank you guys, in advance, for your help!