Anchor position seems to change with game object's width

[stathismor]

Is it possible to set an origin of 0? I have a text object whose text changes dynamically. Code looks a bit like this:

const rexAnchor = scene.plugins.get('rexAnchor');
const text = scene.add.text(0, 0, 'Test text ', { color: '#FF69B4' });
rexAnchor.add(text, {
  centerX: '20%+20',
  top: `top+70`,
});

// Stuff happen here, and then text gets updated
text.text = 'New text with different width'

When text changes, the object's position slightly changes. Anchor seems to want origin to be centered. but with a dynamic width and a percentage centerX, is there a way to achieve this?

[rexrainbow]

rexAnchor.add(text, {
  left: '20%',
  top: `top+70`,
});

There are left, right, top, bottom keys for origin 0, 1 anchor.

[stathismor]

Thanks! I think that works... I am a bit confused though. Is the key of the config the position/anchor of the game object? And when referenced in the value, left, right, top, bottom are then relative to the window? I thought they were both referring to the window. So:

rexAnchor.add(text, {
  left: '20%',
  top: `top+70`,
});

Does this mean place the text 20% left of the leftmost side of the visible window, starting from the text's left (x anchor being 0)?

[rexrainbow]

Yes, you are right. The key left, right, top, bottom are alignment bounds of target game object. The value n%+m is the position of view port.

[stathismor]

Got it, thanks a lot, that explains it!