Phaser.Text auto size font for dynamic text.

[Sturb]

Hey guys, I did a quick search (and I mean quick) and couldn't find anything on this subject. I'm going to need to adjust the font size of a Phaser.Text object based off the length of the string for localization purposes. It's going to have include both cases where the Phaser.Text object is using word wrap or not. Basically I would want to define the text bounds' width and height then set the text. If the text goes outside the defined, then I would want to be able to adjust the font size to tuck everything back within those bounds.

An example would be dynamic button text for multiple languages. Or an instructions paragraph where the text needs to stay within a certain bounds no matter the language it's in.

If anyone could provide any advice on this, it would be greatly appreciated.

EDIT: Oh! Forgot.. It would be nice if this could work with bitmap font as well.

[Sturb]

Figured out a solution for now. This hasn't been tested with Bitmap font yet because I haven't gotten to that stage of implementation. Here it is if anyone is interested.

export function setText(field: Phaser.Text, text: string, width?: number, height?: number){	// So we don't lose the original value of the font size, create a property on the field to store it.	if (!('defaultFontSize' in field))	{		field['defaultFontSize'] = field.fontSize;	}	// Set the field's font size back to it's original value before setting the new text.	field.fontSize = field['defaultFontSize'];	// If word wrap is set, then use the word wrap width as the bounds' width instead.	if (field.wordWrap)	{		width = field.wordWrapWidth;	}	// Set the field's text property.	field.text = text;	// Check if bounds were provided.	if (width > 0 && height > 0)	{			// Use the default font size as a base for the auto sizing.		var size: number = field['defaultFontSize'];		// While the width or height is greater then the provided bounds, subtract one from the font size.		while ((field.width > width || field.height > height) && field.fontSize > 4)		{			field.fontSize = --size;		}	}}

[GabLeRoux]

Just posting that typescript snippet again, but with proper line ending ?

export function setText(field: Phaser.Text, text: string, width?: number, height?: number) {
    // So we don't lose the original value of the font size, create a property on the field to store it.
    if (!('defaultFontSize' in field)) {
        field['defaultFontSize'] = field.fontSize;
    }

    // Set the field's font size back to it's original value before setting the new text.
    field.fontSize = field['defaultFontSize'];

    // If word wrap is set, then use the word wrap width as the bounds' width instead.
    if (field.wordWrap) {
        width = field.wordWrapWidth;
    }

    // Set the field's text property.
    field.text = text;

    // Check if bounds were provided.
    if (width > 0 && height > 0) {
        // Use the default font size as a base for the auto sizing.
        var size: number = field['defaultFontSize'];
        // While the width or height is greater then the provided bounds, subtract one from the font size.
        while ((field.width > width || field.height > height) && field.fontSize > 4) {
            field.fontSize = --size;
        }
    }
}

Didn't try it, but I'm a simple human and reading code is easier when it's not on a single line.