虽然精灵是精灵，但只能将精灵添加到组中

Question

我正在尝试制作一个草图，当我点击另一个精灵时，其中会出现一个精灵动画。它出现在屏幕的中间，它应该能够被鼠标推动，鼠标上也有一个精灵。

一旦我想将出现在MousePressed精灵上的精灵添加到一个组或mouseBlock.replacement((中，我就会收到一个错误，说"；未捕获错误：重叠只能在精灵或组之间检查"。我不明白我做错了什么。是因为精灵是通过一个函数创建的吗？还是我的顺序不对？请帮帮我。

var movingBlocks;
var mouseBlock;
var bb1;
var b1;
function preload() {
mouseBlock = loadImage('mouse.png');
}
function setup() {
createCanvas(windowWidth, windowHeight);
mouseBlock = createSprite(200,200);
mouseBlock.addAnimation('normal', 'mouse.png');
movingBlocks = new Group()
var b1 = createSprite(windowWidth-200,100);
b1.addAnimation('normal', 'stamps/static/BB1/1BuildingBlock0000.png','stamps/static/BB1/1BuildingBlock0001.png','stamps/static/BB1/1BuildingBlock0002.png','stamps/static/BB1/1BuildingBlock0003.png','stamps/static/BB1/1BuildingBlock0004.png','stamps/static/BB1/1BuildingBlock0005.png','stamps/static/BB1/1BuildingBlock0006.png','stamps/static/BB1/1BuildingBlock0007.png','stamps/static/BB1/1BuildingBlock0008.png','stamps/static/BB1/1BuildingBlock0009.png','stamps/static/BB1/1BuildingBlock0010.png','stamps/static/BB1/1BuildingBlock0009.png','stamps/static/BB1/1BuildingBlock0008.png','stamps/static/BB1/1BuildingBlock0007.png','stamps/static/BB1/1BuildingBlock0006.png','stamps/static/BB1/1BuildingBlock0005.png','stamps/static/BB1/1BuildingBlock0004.png','stamps/static/BB1/1BuildingBlock0003.png','stamps/static/BB1/1BuildingBlock0002.png','stamps/static/BB1/1BuildingBlock0001.png','stamps/static/BB1/1BuildingBlock0000.png');
b1.scale = 0.15;

b1.onMousePressed= function() {
var bb1 = createSprite(windowWidth/2,windowHeight/2);
bb1.addAnimation('normal', 'stamps/move/BB1Move/1BBMove0000.png','stamps/move/BB1Move/1BBMove0001.png','stamps/move/BB1Move/1BBMove0002.png','stamps/move/BB1Move/1BBMove0003.png','stamps/move/BB1Move/1BBMove0004.png','stamps/move/BB1Move/1BBMove0005.png','stamps/move/BB1Move/1BBMove0006.png','stamps/move/BB1Move/1BBMove0007.png','stamps/move/BB1Move/1BBMove0008.png','stamps/move/BB1Move/1BBMove0009.png','stamps/move/BB1Move/1BBMove0010.png','stamps/move/BB1Move/1BBMove0009.png','stamps/move/BB1Move/1BBMove0008.png','stamps/move/BB1Move/1BBMove0007.png','stamps/move/BB1Move/1BBMove0006.png','stamps/move/BB1Move/1BBMove0005.png','stamps/move/BB1Move/1BBMove0004.png','stamps/move/BB1Move/1BBMove0003.png','stamps/move/BB1Move/1BBMove0002.png','stamps/move/BB1Move/1BBMove0001.png','stamps/move/BB1Move/1BBMove0000.png');
tint(255,127);
bb1.scale = 0.4;
}
// movingBlocks.add(bb1);
}
function draw() {
background(240,240,240);
mouseBlock.position.x = mouseX;
mouseBlock.position.y = mouseY;
mouseBlock.scale=0.3;
// mouseBlock.displace(bb1);
drawSprites();
}

Answer 1

我找到了！我需要更改代码的顺序。我向一个组添加精灵的地方必须重新定位，然后我可以说mouseBlock.adisplace(movingBlocks(；

var movingBlocks;
var mouseBlock;
var bb1;
var b1;
function preload() {
mouseBlock = loadImage('mouse.png');
}
function setup() {
createCanvas(windowWidth, windowHeight);
mouseBlock = createSprite(200,200);
mouseBlock.addAnimation('normal', 'mouse.png');
movingBlocks = new Group()
var b1 = createSprite(windowWidth-200,100);
b1.addAnimation('normal', 'stamps/static/BB1/1BuildingBlock0000.png','stamps/static/BB1/1BuildingBlock0001.png','stamps/static/BB1/1BuildingBlock0002.png','stamps/static/BB1/1BuildingBlock0003.png','stamps/static/BB1/1BuildingBlock0004.png','stamps/static/BB1/1BuildingBlock0005.png','stamps/static/BB1/1BuildingBlock0006.png','stamps/static/BB1/1BuildingBlock0007.png','stamps/static/BB1/1BuildingBlock0008.png','stamps/static/BB1/1BuildingBlock0009.png','stamps/static/BB1/1BuildingBlock0010.png','stamps/static/BB1/1BuildingBlock0009.png','stamps/static/BB1/1BuildingBlock0008.png','stamps/static/BB1/1BuildingBlock0007.png','stamps/static/BB1/1BuildingBlock0006.png','stamps/static/BB1/1BuildingBlock0005.png','stamps/static/BB1/1BuildingBlock0004.png','stamps/static/BB1/1BuildingBlock0003.png','stamps/static/BB1/1BuildingBlock0002.png','stamps/static/BB1/1BuildingBlock0001.png','stamps/static/BB1/1BuildingBlock0000.png');
b1.scale = 0.15;
b1.onMousePressed= function() {
var bb1 = createSprite(windowWidth/2,windowHeight/2);
bb1.addAnimation('normal', 'stamps/move/BB1Move/1BBMove0000.png','stamps/move/BB1Move/1BBMove0001.png','stamps/move/BB1Move/1BBMove0002.png','stamps/move/BB1Move/1BBMove0003.png','stamps/move/BB1Move/1BBMove0004.png','stamps/move/BB1Move/1BBMove0005.png','stamps/move/BB1Move/1BBMove0006.png','stamps/move/BB1Move/1BBMove0007.png','stamps/move/BB1Move/1BBMove0008.png','stamps/move/BB1Move/1BBMove0009.png','stamps/move/BB1Move/1BBMove0010.png','stamps/move/BB1Move/1BBMove0009.png','stamps/move/BB1Move/1BBMove0008.png','stamps/move/BB1Move/1BBMove0007.png','stamps/move/BB1Move/1BBMove0006.png','stamps/move/BB1Move/1BBMove0005.png','stamps/move/BB1Move/1BBMove0004.png','stamps/move/BB1Move/1BBMove0003.png','stamps/move/BB1Move/1BBMove0002.png','stamps/move/BB1Move/1BBMove0001.png','stamps/move/BB1Move/1BBMove0000.png');
tint(255,127);
bb1.scale = 0.4;
movingBlocks.add(bb1);
// mouseBlock.displace(bb1);
}
}
function draw() {
background(240,240,240);
mouseBlock.position.x = mouseX;
mouseBlock.position.y = mouseY;
mouseBlock.scale=0.3;
// for(var i=0; i<allSprites.length;i++){
//   var block1 = allSprites[i];
// }
mouseBlock.displace(movingBlocks);
drawSprites();
}