Using Phaser Anchor set

[mdere]

It seems like when I use input_field_object.anchor.setTo(0.5) and it seems like does anchor the input field to center, but the input itself is out of aligned.

Is this expected behavior?

Reason I am doing this way because I want the center of the input field to be absolute based on game.word.centerX, if do that without anchor - it seems like the left of the input box is where the start of the x and y coords begin.

[DavidZwit]

Would you care to give us a small code snipped of the problem causing code? We tried to recreate it and the only way it's reappearing is when we hard set the x position of the text. The alignment of the input box should all be handled correctly by the plugin and no manual positioning should be needed.

[mdere]

@DavidZwit - hm I pretty much gave up and just did relative position - all I remember was that the anchor.set on that input object screws up the input box

have you tried to anchor it to (0.5)?

[tommitytom]

I'm having this exact issue. My code is very simple:

export default class Menu extends Phaser.State {
    public game: PhaserInput.InputFieldGame;

    private nameInput: PhaserInput.InputField;

    public create() {
        this.nameInput = this.game.add.inputField(this.game.width / 2, this.game.height / 2, {
            font: '50px Arial',
            fill: '#212121',
            fontWeight: 'bold',
            width: 600,
            padding: 8,
            borderWidth: 1,
            borderColor: '#000',
            borderRadius: 6,
            placeHolder: 'Name',
            textAlign: 'center'
        });

        this.nameInput.anchor.setTo(0.5, 0.5);
    }
}

The rest of my setup is detailed in issue https://github.com/orange-games/phaser-input/issues/53

[ghandhikus]

56

[RollinSafary]

there is need to add options for horizontal and vertical textAlign, so if textbox has none default height textAlign: center doesn't work properly for height alignment