A Flash Developer Resource Site

Results 1 to 5 of 5

Thread: Text arcing with Actionscript

  1. #1
    Senior Member
    Join Date
    Sep 2005
    Posts
    128

    Text arcing with Actionscript

    I have a project that needs to take dynamic text and arc it. Similar to this:
    http://www.no-refresh.com/button_designer/
    In this example, select a font then click “create text item”. At this point you can slide the meter to change the arc of the text. This is exactly what I need to do.

    My understanding of what needs to be done is I need to first break the letters of the text field into separate text fields, loop thru them then position and rotate each char to the desired arc. The problem is my trigonometry really bites. I’ve tried many tutorials and I’ve gotten similar results, mainly arcing text into a complete circle at different radiuses. But all I need to do is what’s in the example, which is allowing the user to gradually arch the text.

    Please any help would be appreciated.

  2. #2
    Senior Member
    Join Date
    Sep 2005
    Posts
    128
    Please I know this is a difficult one but if anybody can help.

  3. #3
    Senior Member
    Join Date
    Sep 2005
    Posts
    128
    here is what I've been experimenting with:

    //this would be the input text from the user
    //normally I would replace this with the split version
    removeEventListener(Event.ADDED_TO_STAGE, init);
    var tField:TextField = new TextField()
    tField.text = "The world is mine"
    tField.border = true
    tField.x = 100
    tField.y = 100
    tField.width = 150
    tField.height =20
    var myFmt = new TextFormat()
    myFmt.size = 18
    //myFmt.autoSize = true
    tField.setTextFormat(myFmt)
    addChild(tField)

    var arr:Array = tField.text.split("")
    var arc = 45/360//arr.length
    var alpha = 0
    var xCenter = tField.x + tField.width / 2
    var yCenter = tField.y + tField.height/2
    for (var i:int = 0; i < arr.length; i++)
    {
    var t:TextField = new TextField()
    t.x = xCenter + 150 * Math.cos(alpha)
    t.y = yCenter + 150 * Math.sin(alpha)
    t.text = arr[i]
    addChild(t)
    alpha += arc
    }

  4. #4
    Will moderate for beer
    Join Date
    Apr 2007
    Location
    Austin, TX
    Posts
    6,801
    Our own cancerinform has a tutorial for making curved text using the new flash 10 features:
    http://www.flashscript.biz/Flash10/c...urvedtext.html

  5. #5
    Senior Member
    Join Date
    Sep 2005
    Posts
    128
    Thanks this is exactly what I needed.

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  




Click Here to Expand Forum to Full Width

HTML5 Development Center