Как сохранить положение камеры при уменьшении масштаба?

Question

У меня есть контейнер с плитками и другими активами, которые служат картой. Поверх этого контейнера находится маска, которая служит камерой, через которую видит игрок. Чтобы переместить камеру, я перемещаю контейнер.

Я могу сосредоточиться на плитке в контейнере, используя следующую формулу:

container.x = ( ( (tile.x + (tile.width / 2) ) * container.scaleX) * -1) + (mask_width / 2);
container.y = ( ( (tile.y + (tile.height / 2) ) * container.scaleY) * -1) + (mask_height / 2);

Это перемещает контейнер в положение относительно маски, так что центром маски будет рассматриваемая плитка.

Недавно я добавил возможность масштабирования, которая просто настраивает scaleX / scaleY контейнера, чтобы сделать его больше или меньше. Я уже исправил приведенный выше центрирующий код, чтобы учесть это, но у меня возникают проблемы с его настройкой, чтобы «камера» не двигалась при уменьшении изображения. По сути, при уменьшении все кажется движущимся влево, потому что контейнер сжимается. Все нормально, когда я концентрируюсь на чем-то с приведенным выше кодом, но мне нужен способ немного повернуть контейнер вправо, основываясь на разнице в scaleX и scaleY, чтобы все выглядело так, как будто оно находится в одной и той же позиции при масштабировании. Я уже попробовал несколько вещей, но я не могу полностью обдумать это.

Answer 1

Мне удалось выяснить это самостоятельно, проведя некоторые исследования в различных классах помощников as3. Так что вот в надежде, что кто-то еще с этой проблемой спотыкается здесь:

movieclip.transform.matrix позволяет изменить точку, с которой он увеличивается при изменении масштаба X / Y. MatrixTransformer содержит функцию, которая позволяет вам сопоставить две точки вместе для вашей точки регистрации. Вот код, который я использовал:

var mat:Matrix = container.transform.matrix.clone();
var externalCenter:Point = new Point(stage.mouseX, stage.mouseY);
var internalCenter:Point = new Point(container.mouseX, container.mouseY);

// container.scaleX and container.scaleY change here

MatrixTransformer.matchInternalPointWithExternal(matrix, internalCenter, externalCenter);
roomContainer.transform.matrix = matrix;

Answer 2

закомментируйте этот код

container.x = ( ( (tile.x + (tile.width / 2) ) * container.scaleX) * -1) + (mask_width / 2);
container.y = ( ( (tile.y + (tile.height / 2) ) * container.scaleY) * -1) + (mask_height / 2);

при загрузке сделайте этот код

cam.x = container.width/2
cam.y = container.height/2

при изменении размера / масштаба сделайте что-то подобное

container.x =  container.x + amountOfWidthChanged/2
container.y = container.y + amountOfHeightChanged/2