Tutorial - Ingreso de datos (Primera parte)

Para poder crear campos de texto para ingresar datos, vamos a usar una librería llamada "ControlP5", para ello entramos a "Sketch - Import Library... - Add Library".

Luego escribimos en el buscador "control p5" y damos click en la opción de "Install" como se observa la figura.

Un primer programa que vamos a probar es un sketch en el cual creamos un campo de texto con un nombre dado "Texto", y detectamos el momento en el que se da un "enter". El texto ingresado se verá en el visualizador serial que posee Processing en la parte inferior de la pantalla del IDE.

El programa es el siguiente:

/* 
   PROGRAMA DE PRUEBA DE COMUNICACION SERIAL
   
   El siguiente programa nos ayuda a escribir un dato en un campo de texto para luego ser visualizado
   por el visualizador serial de Processing
   
   Autor: Renato H.
   http://beetlecraft.blogspot.pe/
  
   El siguiente programa es de uso publico, cualquier modificacion o mal uso del mismo que pudiera 
   ocasionar el mal funcionamiento de la plataforma de uso de la misma no es responsabilidad del autor
*/

import controlP5.*; // Importacion del la libreria ControlP5
ControlP5 cp5;      // Creacion del objeto cp5

String[] cabeceraCT = {"Texto"}; // Cabecera del campo de texto

void setup() {
  size(200,100); // Tamano del canvas ancho, alto

  PFont fuente = createFont("arial",20); // Tamano de la fuente

  cp5 = new ControlP5(this); // Inicializacion de la funcion cp5

  for(String nombre: cabeceraCT){    // Orden de campo de texto y cabecera
    cp5.addTextfield(nombre)         // Crea un campo de texto 
       .setPosition(20,20)           // Ubicacion del texto en coordenadas x, y
       .setSize(100,40)              // Tamano del campo de texto ancho, alto
       .setFont(fuente)              // Fuente del texto
       .setColor(color(255,255,255)) // Color de la fuente r, g, b
       ;
  }
  textFont(fuente);
}

void draw() { background(0); } // Funcion de dibujo

void controlEvent(ControlEvent evento) {         // Control de evento de entrada de texto
  if(evento.isAssignableFrom(Textfield.class)) { // Revisa si se ha ingresado un texto y apretado "enter"
    
    // Muestra nombre de la cabecera del campo de texto y el texto escrito 
    println("Texto introducido: '" + evento.getName()+"': " + evento.getStringValue());
  }
}

El resultado es el siguiente:

Autor: