jardínBit

Manipulación de texto

La base para trabajar con texto en Processing es la clase String (cadena de texto) que funciona como un arreglo de caracteres.

1 Clase String

Para indicar que estamos utilizando una String, utilizamos comillas.

String texto = "¡Hola!";

Nota que cuando estamos utilizando caracteres individuales, utilizamos comillas sencillas.

char caracter = 'a';

1.1 Algunos métodos

Estos son algunos métodos que tiene la clase String.

Puedes encontrar más en la referencia de String de Processing y aún más en la documentación de String de Java.

1.1.1 .length()

Regresa un número entero (int) correspondiente a cuántos caracteres tiene la cadena de texto.

String texto = "Hola mundo";
int numCaracteres = texto.length(); // 10

1.1.2 .charAt( i )

Regresa el caracter que está en la posición dada por el entero i. La cuenta de los caracteres empieza desde el 0, que es el caracter más a la izquierda.

String texto = "Hola mundo";
char c = texto.charAt( 3 ); // 'a'

1.1.3 .toUpperCase() y .toLowerCase()

Estos métodos regresan una String con el case cambiado.

String texto = "Hola Mundo";
String enMinusculas = texto.toLowerCase(); // "hola mundo"
String enMayusculas = texto.toUpperClase(); // "HOLA MUNDO"

1.1.4 .equals( s )

Este método nos permite comparar dos Strings para ver si son exactamente iguales:

String texto = "Hola mundo";

if ( texto.equals( "hola" ) ){  // si el texto es exactamente "hola"
   // ...
}
else{

}

2 Dibuja texto

Podemos dibujar texto en la pantalla de processing utilizando la función text( ):

String texto = "hola mundo";
text( texto, 100, 200); // dibuja el texto en las coordenadas 100, 200

En la referencia de Processing de text() hay más ejemplos y funciones relacionadas.

3 Ejemplos

3.1 Recorre los caracteres de una String

Podemos utilizar los métodos .length() y .charAt( ) para crear un ciclo for similar a los que creamos para recorrer un arreglo.

String texto = "Hola mundo";

for( int i=0; i<texto.length(); i++){
    char c = texto.charAt( i );
    // haz algo con c
}

3.2 Una propia fuente

Podemos utilizar el ciclo anterior para dibujar una figura distinta de acuerdo al caracter en la cadena de texto.

La siguiente plantilla utiliza una String, y a partir de ella dibuja un cuadrado en donde iría cada ‘a’ u ‘o’, un círculo en cualquier otro caracter, y deja espacio en donde hay espacio:

String texto = "Hola mundo";
void setup(){
  size( 640, 480);
}

void draw(){
  background(255);
  fill(0);
  rectMode(CENTER);
  float x = 20; // coordenada x inicial
  float y = 240; // coordenada y
  for( int i=0; i < texto.length(); i = i+1){
    if( texto.charAt( i ) == 'a' || texto.charAt( i ) == 'o' ){
      fill(255);
      rect( x, y, 20, 20);
    }
    else if( texto.charAt( i ) == ' '){
     // en espacio no dibujes nada 
    }
    else{ 
      fill(0);
      ellipse( x, y, 20, 20 );
    }

    x += 20; // incrementa x
  } // cierra for
  
} // cierra draw

3.2.1 usando una función propia

El siguiente ejemplo es similar, pero utiliza una función propia para los caracteres ‘a’ u ‘o’, dando una idea de cómo se podría utilizar con una función para cada posible caracter.

String texto = "Hola mundo";

void setup(){
  size( 640, 480);
}

void draw(){
  background(255);
  fill(0);
  rectMode(CENTER);
  float x = 20; // coordenada x inicial
  float y = 240; // coordenada y
  for( int i=0; i < texto.length(); i = i+1){
    if( texto.charAt( i ) == 'a' || texto.charAt( i ) == 'o' ){
      fill(255);
      tache( x, y );
    }
    else if( texto.charAt( i ) == ' '){
     // en espacio no dibujes nada 
    }
    else{
      fill(0);
      ellipse( x, y, 20, 20 );
    }

    x += 20; // incrementa x
  } // cierra for
  
} // cierra draw

void tache( float x, float y ){
 pushMatrix(); 
  translate( x, y); 
  
  line(-10, -10, 10, 10);
  line(-10, 10, 10, -10);
  
  popMatrix();
}

3.3 Caracteres oscilando

Podemos dibujar a los caracteres habituales, pero con la posibilidad de controlar la posición de cada uno.

Por ejemplo, podemos utilizar una función senoidal para cambiar y animar la posición vertical de cada caracter.

String texto = "The way you can go isn’t the real way."; 

void setup(){
  size( 640, 480);
}

void draw(){
  background(255);
  fill(0);
  textSize( 15 );
  float x = 0; // x inicial
  for( int i=0; i < texto.length(); i = i+1){
    float y = 240*sin( frameCount*0.01 + i*0.2) + 240;
    text( texto.charAt(i), x, y);
    x += 15; // incrementa x
  } // cierra for
  
} // cierra draw

4 Archivos de texto

Podemos entender a un archivo de texto plano (o “texto sin formato”) como una colección de líneas de texto: un arreglo de Strings!

Para agregar un archivo de texto (.txt) a nuestro sketch, lo podemos arrastrar a la ventana de código, o colocarlo en el mismo directorio o carpeta que donde se encuentra nuestro código.

4.1 Ciclo anidado: caracteres en líneas

Este ejemplo carga un archivo de texto plano y dibuja un cuadrado donde hay cualquier carácter, excepto espacio, donde no dibuja nada:

String[] lineas;

void setup(){
  size( 800, 480);
  
  lineas = loadStrings("capitulo1.txt");
}

void draw(){
  background(255);
  fill(0);
  rectMode(CENTER);
  
  // por cada línea de texto...
  for( int i=0; i<lineas.length; i=i+1){

    // por cada caracter de esa línea:
    for( int j=0; j<lineas[i].length(); j=j+1){
      if( lineas[i].charAt(j) == ' '){
        
      }
      else{
        rect( j*20+20, i*20+20, 20, 20);  
      }

    } // cierra for j
  } // cierra for i
  
} // cierra draw