Lots of examples in the forum
see User Type Input - #2 by MiguelSanches
Example
// Sketch to show customers in a store the positions of items/products.
// Sketch can be improved a lot
// const
final int NONE = -1; //undefined
//sets up input
String inputText = "";
// for blink
boolean cursorBlinkingOn=false;
// current radius (grwoing)
float radius=0;
// number of typed item
int currentItem=NONE;
// list of items
final int max = 100; // const
String[] items = new String[max]; // could be a class
int[] x = new int [max];
int[] y = new int [max];
int[] col = new int [max];
// to retrieve index from the String screwdrivers
HashMap<String, Integer> list = new HashMap<String, Integer>();
// --------------------------------------------------------------------
void setup() {
size(1200, 600);
background(255);
// pre init
for (int i=0; i<items.length; i++) {
items[0] = "";
}
// setup items / could be read from a file
int i=0;
items[i] = "screwdrivers";
x[i]=210;
y[i]=250;
col[i] = color(255, 0, 0);
list.put(items[i], i);
i++;
items[i] = "hammer";
x[i]=600+120;
y[i]=60+70;
col[i] = color(0, 255, 0);
list.put(items[i], i);
}
void draw() {
background(255);
// show scene / ground floor plan
scene();
// show item when there has been one typed in
showCurrentItem();
// show help and current word that is typed in
textSize(20);
fill(0);
text("Enter shop item (Use Backspaace, ESC to delete, Enter to submit, # for 'screwdrivers', try hammer): "
+ inputText
+ blinkingCursor(),
10, height-22);
}
// --------------------------------------------------------------------
//key inputs
void keyPressed() {
// eval
smallReset();
if (key == ENTER || key == RETURN) {
submit();
} else if (key == '#') {
inputText="screwdrivers";// test
} else if (key == BACKSPACE) {
inputText = inputText.substring(0, max(0, inputText.length()-1));
} else if (key == ESC) {
key=0;//kill Esc
inputText = "";//delete word
} else {
if (! (key == CODED)) {
inputText = inputText + key;
}
}
}
// --------------------------------------------------------------------
// Tools
void smallReset() {
radius=0;
currentItem=NONE;
}
void showCurrentItem() {
if (currentItem==NONE)
return; // leave
// show ellipse
fill(col[currentItem]);
ellipse(x[currentItem], y[currentItem], radius, radius);
if (radius<=40 && frameCount%4==0) {
radius++; // grow
}
// show text when animation is almost finished
if (radius>=30) {
fill(col[currentItem]);
text(items[currentItem],
x[currentItem]+22, y[currentItem]+22);
}
}
void submit() {
// submit input
int result;
if (list.get(inputText)!=null) {
//found
result = (int)list.get(inputText);
currentItem=result;
} else {
currentItem=NONE;
return;
}
}
void scene() {
fill(111);
rect(201, 200, 70, 170);
rect(601, 60, 240, 70);
}
String blinkingCursor() {
if (frameCount%17==0)
cursorBlinkingOn =
! cursorBlinkingOn; // toggle
if (cursorBlinkingOn)
return "|";
else return "";
}
//
NEW VERSION
- can read now from a String list (that you can replace with load Google Sheet or whatever, using the loadStrings line instead of the array thereafter)
- not case-sensitive anymore, all goes upper-case internally
- The input (when longer 1) will be searched in the list and suggestions are given upper right corner
To point 1: when reading the String list, the name of the item is retrieved and the Cabinet location also. The item is just copied. BUT the Cabinet location is translated into a screen position. This you have to do manually in the code. So for all Cabinet locations you have to write down the respective position in the switch-statement.
// https://discourse.processing.org/t/type-words-to-start-an-animation/38273/2
// Sketch to show customers in a store positions of items/products.
// Sketch can be improved a lot
// const
final int NONE = -1; //undefined
//sets up input
String inputText = "";
// for blink
boolean cursorBlinkingOn=false;
// current radius (grwoing)
float radius=0;
// number of typed item
int currentItem=NONE;
// list of items
final int max = 100; // const
String[] items = new String[max]; // could be a class
int[] x = new int [max];
int[] y = new int [max];
int[] col = new int [max];
// to retrieve index from the String screwdrivers
HashMap<String, Integer> list = new HashMap<String, Integer>();
ArrayList<String> listSuggestions= new ArrayList();
//String[] listFromFile = loadStrings(...);// from Google Sheet
String[] listFromFile = {
"screwdrivers,Cabinet 1",
"screws,Cabinet 2",
"hammer,Cabinet 3"
};
// --------------------------------------------------------------------
void setup() {
size(1200, 600);
background(255);
// pre init
for (int i=0; i<items.length; i++) {
items[i] = "";
}
int i=0;
for (String currentLine : listFromFile) {
String[] singlePartsOfLine=split(currentLine, ",");
items[i] = singlePartsOfLine[0].trim().toUpperCase();
col[i] = color(255, 0, 0);
list.put(items[i], i);
// get x,y
//float x1=10, y1=10;
switch(singlePartsOfLine[1].trim()) {
case "Cabinet 1":
x[i]=210;
y[i]=250;
println("OK");
break;
case "Cabinet 2":
x[i]=600+120;
y[i]=60+70;
break;
case "Cabinet 3":
x[i]=600+120+110;
y[i]=60+70;
break;
default:
println("Cabinet not found "
+ singlePartsOfLine[1]);
break;
}//switch
i++;
}//for
/*
// setup items / could be read from a file
int itemNo=0;
items[itemNo] = "screwdrivers".toUpperCase();
x[itemNo]=210;
y[itemNo]=250;
col[itemNo] = color(255, 0, 0);
list.put(items[itemNo], itemNo);
itemNo++;
items[itemNo] = "hammer".toUpperCase();
x[itemNo]=600+120;
y[itemNo]=60+70;
col[itemNo] = color(0, 255, 0);
list.put(items[itemNo], itemNo);
itemNo++;
items[itemNo] = "screws".toUpperCase();
x[itemNo]=600+120+110;
y[itemNo]=60+70;
col[itemNo] = color(0, 255, 0);
list.put(items[itemNo], itemNo);
// more items HERE
*/
// all upper case
for (int i2=0; i2<items.length; i2++) {
items[i2] = items[i2].toUpperCase();
}
}
void draw() {
background(255);
// show scene / ground floor plan
scene();
// show item when there has been one typed in
showCurrentItem();
// show help and current word that is typed in
textSize(20);
fill(0);
text("Enter shop item (Use Backspaace, ESC to delete, Enter to submit, # for 'screwdrivers', try hammer): "
+ inputText
+ blinkingCursor(),
10, height-22);
//show suggestions
int i3=0;
textSize(12);
fill(0);
for (String s1 : listSuggestions) {
text( s1, width-190, i3*20+22);
i3++;
}
}
// --------------------------------------------------------------------
//key inputs
void keyPressed() {
// eval
smallReset();
if (key == ENTER || key == RETURN) {
submit();
} else if (key == '#') {
inputText="screwdrivers";// test
} else if (key == BACKSPACE) {
inputText = inputText.substring(0, max(0, inputText.length()-1));
} else if (key == ESC) {
key=0;//kill Esc
inputText = "";//delete word
} else {
if (! (key == CODED)) {
inputText = inputText + key;
}
}
listSuggestions.clear();
if (inputText.length()>=1) {
for (int i=0; i<items.length; i++) {
if ( items[i].contains(inputText.toUpperCase())) {
listSuggestions.add(items[i]);
if (listSuggestions.size()>19) {
break; // leave
}
}
}
}
}
// --------------------------------------------------------------------
// Tools
void smallReset() {
radius=0;
currentItem=NONE;
}
void showCurrentItem() {
if (currentItem==NONE)
return; // leave
// show ellipse
fill(col[currentItem]);
ellipse(x[currentItem], y[currentItem], radius, radius);
if (radius<=40 && frameCount%4==0) {
radius++; // grow
}
// show text when animation is almost finished
if (radius>=30) {
fill(col[currentItem]);
text(items[currentItem],
x[currentItem]+22, y[currentItem]+22);
}
}
void submit() {
// submit input
int result;
if (list.get(inputText.toUpperCase())!=null) {
//found
result = (int)list.get(inputText.toUpperCase());
currentItem=result;
} else {
currentItem=NONE;
return;
}
}
void scene() {
fill(111);
rect(201, 200, 70, 170);
rect(601, 60, 240, 70);
}
String blinkingCursor() {
if (frameCount%17==0)
cursorBlinkingOn =
! cursorBlinkingOn; // toggle
if (cursorBlinkingOn)
return "|";
else return "";
}
//