Home > Flex, Math > Text Along Spline Code Part III

Text Along Spline Code Part III

October 24, 2008

The high-level deconstruction of the basic algorithm is given in this post, with the corresponding code segment posted here. In this post, we look at the following code,

__spline.draw(1.0);
__myText = __input__.text;

// first pass - get total width of displayed text (using
// uniform spacing - punctuation taken into account later)
var totalWidth:Number = 0;
for( var i:uint=0; i<__myText.length; ++i )
{
  var tf:TextField = __createLetter(__myText.charAt(i));
  totalWidth      += tf.textWidth + __tracking;
  __letters[i]     = tf;
}

var arcLength:Number = __spline.arcLength();
var aInverse:Number  = 1/arcLength;
var maxS:Number      = totalWidth*aInverse;

Recall that the spline is parameterized on arc length that has been normalized to [0,1].  The first line of code draws the entire spline.  The for loop creates a TextField for each character and computes the total width taken up by the text string, along with one space padding on the end.  This allows a sprite, for example to be placed at the end of the text string, one space from the last character.  This part of the computation is optional.

The lines,

var arcLength:Number = __spline.arcLength();
var aInverse:Number  = 1/arcLength;
var maxS:Number      = totalWidth*aInverse;

compute the total arc length along the Bezier spline.  The inverse of the arc length is used to multiply cumulative text length to convert to an equivalent arc-length parameter along the spline.  The maxS variable is optional.  It stores the arc-length or s-parameter along the spline corresponding to the end of the text string.  It could be greater than 1 if the amount of text exceeds the arc length along the spline.  It may be the case that you want to use a different algorithm in such cases than the one provided in this deconstruction.  The variable also provides a way to quickly place something at the end of the string at a later point, perhaps in response to an event handler.

At this point, references to TextFields containing the individual letters are stored in an array.  The remaining code places text along the spline and will be deconstructed in two subsequent posts; one dealing with text that can be entirely distributed along the spline and the other dealing with the case where text extends beyond the final knot.

  1. No comments yet.
  1. October 28, 2008 at 5:56 am
Comments are closed.
%d bloggers like this: