Question

I need to create a ‘rolling’ percentage text field, the only problem is as the size of the characters changes, the text jolts a little from right to left and back.

How can this be overcome for a smoother effect?

private function init(e:Event = null):void 
    {
        removeEventListener(Event.ADDED_TO_STAGE, init);
        // entry point

        _label = new TextField();
        _label.width = 140

        _format = new TextFormat();
        _format.align = TextFormatAlign.RIGHT;
        _format.size = 48;
        _format.font = "Gotham";
        _format.color = 0x000000;
        _label.defaultTextFormat = _format;
        addChild(_label);

        _timer = new Timer(20,100);
        _timer.addEventListener(TimerEvent.TIMER, update);
        _timer.start();
    }

    private function update(e:TimerEvent):void
    {
        _count += 1;
        _label.text = _count.toString() + "%";
    }

Answer 1

The complicated way: Have 4 Textfield’s. One for each digit plus one for %.

The smarter Solution: Use a Font with fixed letter width (like console fonts).