如何清除 p5js 上的旧文本 canvas

Question

var j=0;
    function keyPressed() {                 
            word[j] =key;
            j++;

            if(keyCode == BACKSPACE){           
                shorten(word);
                shorten(word);
                arrayCopy(word, contents);          
            }
            else{
                contents=key;
            }

    }
    function draw(){
        text(contents, pos_x, pos_y, 300, 300); 
        pos_x = pos_x + textWidth(contents);
    }

当我使用退格键时，我使用 shorten() 删除 array.how 的最后一个元素，将这个新文本放在 canvas 上，而不调用 clear() 和 background() .

Answer 1

您已经概述了您的两种选择。

方案1：每一帧，调用background()函数清除旧帧，然后重新绘制。

选项 2： 使用 createGraphics() 函数将您不想清除的内容绘制到屏幕外缓冲区。然后每一帧，清除旧帧，将屏幕外缓冲区绘制到屏幕上，然后在其上绘制 "dynamic" 内容。

您将不得不尝试这两种方法，并更具体地说明 "performance" 您害怕的是什么。但总的来说，以上两种方法正是你处理这个问题的方法。

如何清除 p5js 上的旧文本 canvas

how to clear old text on p5js canvas

p5.js