KeyPressed BACKSPACE et supprimer une seule forme

Question

J'ai créé un code pour un "génératif" logo {comme ceci http://ebologna.it/} (c'est au début donc n'est pas complète), et je veux que tout en appuyant une fois sur le RETOUR je peux reviens juste pour une forme. Maintenant, comme j'ai mon code, quand j'appuie sur Backspace, tout supprimer.

est Ci-dessous le code:

import controlP5.*; 

ControlP5 cp5; 

String textValue = ""; 
String val; 

void setup() { 
    size(700,800); 

    PFont font = createFont("arial",20); 

    cp5 = new ControlP5(this); 

    cp5.addTextfield("INPUT") 
    .setPosition(width/2-100,600) 
    .setSize(200,40) 
    .setFont(font) 
    .setFocus(true) 
    .setColor(color(255,255,255)) 

    ; 

    textFont(font); 
    background(0); 
    noStroke(); 
} 
void draw() { 


    if (keyPressed) { 

    if (key == 'o' || key == 'O') { 
     fill(205, 152, 59, 100); 
     ellipse(width/2, height/2, 50, 50); 
    } 

     if (key == 'b' || key == 'B') { 
     fill(20, 84, 42, 100); 
     rectMode(CENTER); 
     rect(width/2, height/2, 50, 50); 
     } 
    } 
    if (key == BACKSPACE) { //This reset all, I want to reset just the last one shape 
    background (0); 
} 

val = cp5.get(Textfield.class,"INPUT").getText(); 
println(val.length()); 

} 

Merci!

Answer 1

Une autre option consiste à utiliser une boucle for pour parcourir chaque caractère de la chaîne de texte et dessiner la forme correspondante.

Une boucle for peut sembler compliquée en raison de sa syntaxe, mais ce n'est pas trop mal si vous la regardez comme un moyen de répéter un ensemble d'instructions pour un nombre donné de fois/étapes. La syntaxe à peu près comme ceci:

for(intial step ; condition to stop ; incrementation){ 
//something to repeat while the condition to stop is still false 
} 

penser à marcher 10 étapes, une étape fois:

for(int step = 0 ; step < 10 ; step = step+1){ 
    println("step index: " + i); 
} 

Si vous pouvez faire un pas à la fois, vous pouvez également sauter:

for(int step = 0 ; step < 10 ; step = step+2){ 
     println("step index: " + i); 
    } 

Pour revenir à votre défi, vous pouvez utiliser une boucle for pour parcourir chaque caractère du texte. Par exemple:

String text = "go"; 
for(int letterIndex = 0 ; letterIndex < text.length(); letterIndex = letterIndex + 1){ 
    //get the character 
    char letter = text.charAt(letterIndex); 
    println(letter); 
} 

L'extrait ci-dessus utilise la fonction de chaîne length() pour récupérer le nombre de caractères et le charAt() pour récupérer un personnage par elle son index dans la chaîne

appliquée à votre code:

import controlP5.*; 

ControlP5 cp5; 



void setup() { 
    size(700,800); 

    PFont font = createFont("arial",20); 

    cp5 = new ControlP5(this); 

    cp5.addTextfield("INPUT") 
    .setPosition(width/2-100,600) 
    .setSize(200,40) 
    .setFont(font) 
    .setFocus(true) 
    .setColor(color(255,255,255)); 

    textFont(font); 
    background(0); 
    noStroke(); 
} 
void draw() { 
    background (0); 
    //get the text string 
    String text = cp5.get(Textfield.class,"INPUT").getText(); 
    //loop through each character 
    for(int letterIndex = 0 ; letterIndex < text.length(); letterIndex = letterIndex + 1){ 
    //get the character 
    char letter = text.charAt(letterIndex); 
    //draw the coresponding shape 
    if (letter == 'o' || letter == 'O') { 
     fill(205, 152, 59, 100); 
     ellipse(width/2, height/2, 50, 50); 
    } 
    if (letter == 'b' || letter == 'B') { 
     fill(20, 84, 42, 100); 
     rectMode(CENTER); 
     rect(width/2, height/2, 50, 50); 
    } 
    } 
} 

Answer 2

Si vous voulez être en mesure de changer ce qui a été dessiné à l'écran, vous allez devoir prendre cette approche:

Étape 1: tout magasin vous devez dessiner à l'écran dans un Structure de données. Pour vous, cela peut être un ArrayList qui contient des instances d'une classe Circle que vous créez.

Étape 2: Chaque fois draw() est appelé, effacer les images précédentes en appelant la fonction background(), puis tirer tout dans la structure de données à l'écran.

Étape 3: Pour modifier ce qui est à l'écran, modifiez simplement la structure de données. Pour vous, vous pouvez supprimer le Circle dans la dernière position du ArrayList.