Cocos2d-x的anchorPoint锚点和scale缩放之间的配合方式

在Cocos2d-x开发中，理解anchorPoint（锚点）和scale（缩放）之间的配合方式至关重要，否则很容易在实际应用中遇到一些意想不到的问题。下面我们通过具体的例子来详细分析它们之间的关系。

假设我们有一个Node放置在一个盒子里，盒子的锚点位于左下角。初始状态下，Node的属性设置如下：

• position=(0, 0)
• anchorPoint=(0, 0)
• scale=1

接下来，我们更改Node的scale值，使其撑满整个区域，此时属性变为：

• position=(0, 0)
• anchorPoint=(0, 0)
• scale=1.09

现在，我们尝试将Node的锚点重新设置为右上角，即anchorPoint=(1, 1)。按照常规理解，我们可能会认为Node的属性应该保持为：

• position=(0, 0)
• anchorPoint=(1, 1)
• scale=1.09

但实际情况并非如此。当我们将锚点设置为(1, 1)后，Node会呈现出与预期不同的效果。这是因为在Cocos2d-x中，当一个Node被设置了scale缩放后，其本身的锚点位置并没有改变，真实的锚点位置仍然是相对于原大小的位置。也就是说，当我们调用setAnchorPoint(1, 1)时，真实的锚点位置还是基于原大小来确定的。之后，Cocos2d-x会以新的锚点位置重新执行scale(1.09)操作，从而导致Node呈现出最终的效果。

此时，我们会发现Node左边会超出盒子，超出部分的大小可以通过以下公式计算： 超出部分的宽度 = (node:getScale() – 1) * node:getContentSize().width

理解了上述原理后，我们在开发过程中就能避免很多不必要的错误。

为了方便开发者在设置锚点时不改变Node的位置，下面提供一个实用的方法：

-- 安全地设置锚点，用于锚点改变后node对象即便设置了scale缩放，其位置也不发生变化
function setSafeAnchor(node, anchorX, anchorY)
local diffX = anchorX * node:getContentSize().width * (node:getScaleX() - 1)
local diffY = anchorY * node:getContentSize().height * (node:getScaleY() - 1)
node:setAnchorPoint(anchorX, anchorY)
node:setPositionX(node:getPositionX() + diffX)
node:setPositionY(node:getPositionY() + diffY)
end

通过这个方法，我们可以在改变Node的锚点时，确保其位置不会因为缩放而发生改变，从而更加灵活地处理anchorPoint和scale之间的配合。