Как сделать координаты относительно холста

Question

У меня есть экран с разрешением 600x1000 пикселей, и мой плеер начинается в левом нижнем углу. Его координаты x и y равны (50, 900). Я рисую этого игрока на холсте и используя canvas.translate(-player.getX()+GAMEWIDTH/2, 0) , чтобы убедиться, что плеер находится посередине экрана относительно оси x. Это приводит к тому, что мой игрок оказывается на (300, 900), однако координаты x и y игрока остаются на (50, 900). Это представляет проблему, потому что мне нужно, чтобы координаты игрока были такими же, как и его рендер-местоположение, потому что я использую события касания на прямоугольниках столкновения игрока, чтобы переместить его. Есть ли способ сделать координаты моего экрана относительно моих координат холста, чтобы координаты моего игрока соответствовали тому, где они фактически оказываются? Или может быть другой способ сделать это?

Answer 1

Сенсорные элементы всегда основаны на x & y относительно самого элемента холста. Поскольку представление центрирует символ, переведя вид canvas.translate(-player.getX() + GAMEWIDTH/2 , 0);, вам также необходимо применить этот перевод к touchEvent. Вы можете сделать это непосредственно в обработчике касания, или вы можете сохранить как относительную, так и абсолютную позицию для предметов в игровом мире. Это станет более важным, если элементы станут вложенными друг в друга. Обычно это делается путем хранения родительского элемента спрайта/объекта.

//example of how I usually handle object hierarchy 
this._x = this.x + this.parent._x; 
this._y = this.y + this.parent._y; 

холст/стадия также хранить бы это центр как ._x и ._y, который будет родительским из объектов добавил, таким образом, когда вы создаете глобальную позицию, чтобы сделать ваши touchEvents против вместо прохождения в .x или .y вы передадите в ._x и ._y, которые уже переведены GAMEWIDTH/2.