Mattk
Mattk

Reputation: 129

How do you scale a dynamic textfield in flash from the center point using as3?

I'm trying to make a text effect where on every frame the textfield increases in size and decreases in opacity. I'm using the scaleX and scaleY properties of my dynamic textfield to enlarge, but it's doing so keeping the left registration point fixed. I want to make it scale up radially outward, or with the center point fixed. Can anyone tell me how to do this?

Upvotes: 0

Views: 6981

Answers (4)

Mike Hogan
Mike Hogan

Reputation: 10573

I used the code mga posted above and it works. I am posting the entire thing here, as it took me a little time to figure out exactly what to do. What I noticed is that I needed to NOT embed the fonts to get it to work. I'd like to know why? Anyway, this works for me:

package {
import flash.display.MovieClip;
import flash.events.Event;
import flash.text.TextField;
import flash.text.TextFieldAutoSize;
import flash.text.TextFormat;

public class LearningScrollingMain extends MovieClip {
    private var _scalemax:Number = 20;
    private var _ymin:Number = 10;
    private var _scalegrow:Number =1.05;
    private var _scalemin:Number=1;

    public function LearningScrollingMain() {
        drawText("The quick brown fox jumps over the lazy dog", 24, 400, 200);
    }

    private function drawText(str:String, size:int, px:int, py:int):void {
        var mc:MovieClip = new MovieClip();
        var tf:TextFormat = new TextFormat();
        tf.align = "center";
        tf.size=size;
        var _txt:TextField = new TextField();
        _txt.defaultTextFormat=tf;
//        _txt.embedFonts = true;
        _txt.wordWrap = false;
        _txt.selectable = false;
        _txt.autoSize = TextFieldAutoSize.CENTER;
        _txt.antiAliasType = "advanced";
        _txt.text = str;
        _txt.x = -_txt.width / 2;
        _txt.y = -_txt.height / 2;
        mc.scaleX = mc.scaleY = _scalemin;
        mc.x = px;
        mc.y = py;
        mc.addChild(_txt);
        addChild(mc);
        startMove(mc);
    }

    private function startMove(mc:MovieClip):void {
        mc.addEventListener(Event.ENTER_FRAME, moveText);
    }

    private function moveText(e:Event):void {
        var mc:MovieClip = MovieClip(e.target);
        if (mc.scaleX >= _scalemax) {
            mc.scaleX = mc.scaleY = _scalemax;
        } else if (mc.y > _ymin) {
            mc.scaleX = mc.scaleY *= _scalegrow;
        }
        if (mc.alpha <= 0.1) {
            mc.removeEventListener(Event.ENTER_FRAME, moveText);
            mc.parent.removeChild(mc);
        }
    }
}
}

Upvotes: 0

mga
mga

Reputation: 1970

I'm doing pretty much exactly that right now. I am using a wrapper a Theo.T mentions.

This is my code (most of it):

private function drawText(str:String, size:int = 16, px:int = 0, py:int = 0):void {
    var mc:MovieClip = new MovieClip();
    var tf:TextFormat = new TextFormat("Verdana", size, _textcolor);
    tf.align = "center";
    var _txt:TextField = new TextField();
    _txt.embedFonts = true;
    _txt.wordWrap = true;
    _txt.selectable = false;
    _txt.autoSize = TextFieldAutoSize.CENTER;
    _txt.antiAliasType = "advanced";
    _txt.defaultTextFormat = tf;
    _txt.width = _textwidth;
    _txt.text = str;
    _txt.x = -_txt.width / 2;
    mc.scaleX = mc.scaleY = _scalemin;
    mc.x = px;
    mc.y = py;
    mc.addChild(_txt);
    addChild(mc);
    startMove(mc);
}

private function moveText(e:Event):void {
    var mc:MovieClip = MovieClip(e.target);
    if (mc.scaleX >= _scalemax) {
        mc.scaleX = mc.scaleY = _scalemax;
    } else if (mc.y > _ymin) {
        mc.scaleX = mc.scaleY *= _scalegrow;
    }
    if (mc.alpha <= 0.1) {
        mc.removeEventListener(Event.ENTER_FRAME, moveText);
        mc.parent.removeChild(mc);
    }
}

Upvotes: 1

Theo.T
Theo.T

Reputation: 9257

You can easily create a wrapper for the TextField (i.e. a Sprite containing the TextField) to enforce the registration point to the middle. If the TextField is dynamic make sure it's autoSize is set to LEFT. Thereafter you can just set it's x/y position to -textField.width*.5/-textField.height*.5. Of course the scaling should be applied to the parent.

Upvotes: 1

antpaw
antpaw

Reputation: 15985

 textfield.x -= textfield.width /2;
 textfield.y -= textfield.height /2;

if the x and y are 0 this will help

Upvotes: 1

Related Questions