KeyPressedバックスペースを使用して1つの図形のみを削除する

Question

「Generative」ロゴのコードを作成しました（これはhttp://ebologna.it/です）（これは最初ですので完全ではありません）、バックスペースを1回押しながらちょうど1つの形のために戻ってください。今すぐコードを持っているように、Backspaceを押すとすべてが削除されます。以下は

コードです：

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()); 

} 

は、ありがとう！

Answer 1

もう1つの方法は、forループを使用してテキスト文字列の各文字を調べ、対応する図形を描画することです。

forループは構文が複雑に見えるかもしれませんが、指定された回数/手順で一連の命令を繰り返す方法として見ればそれほど悪くはありません。大体そのような構文：10のステップを歩くの

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

が思うに、一歩時間：

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

あなたが一度に一つのステップを行うことができた場合、あなたはまた、ホップすることができます

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

を

挑戦に戻るには、forループを使用してテキストの各文字を調べることができます。たとえば：

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); 
    } 
    } 
} 

：

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

スニペットは、上記の文字列のコードに適用さ

でのインデックスで文字を検索する文字の数とcharAt()を取得するために、文字列のlength()機能を使用しています

Answer 2

あなたが画面に描かれているものに変更することができるようにしたい場合は、このアプローチを取る必要があるとしている：

ステップ1：あなたがAで画面に描画する必要があるストアすべてデータ構造。あなたのために、あなたが作成するCircleクラスのインスタンスを保持するArrayListかもしれません。

ステップ2：draw()が呼び出されたひとつひとつの時間は、background()関数を呼び出すことで、前のフレームをオフにして、画面へのデータ構造のすべてを描きます。

手順3：画面上の内容を変更するには、データ構造内の内容を変更します。あなたのために、ArrayListの最後の位置にあるCircleを削除することがあります。