How to add movieclip inside textfield

Question

I would like to add a movieclip to a textfield. The objective is to be able to scroll the movie clip, since the uiscrollbar only works for textfield, i think my solution to scrolling the movie clip is to put it inside a textfield.

I have tried something like:

myText.addChild(myClip); 

but failed with error: 1061: Call to a possibly undefined method addChild through a reference with static type flash.text:TextField.

Answer 1

The problem is that a TextField is not a DisplayObjectContainer, so you can't add children.

(The good news is that there are a number of alternate solutions you can find through Google)

Answer 2

You won't be able to add it to a textfield and I'm not exactly sure what you're mean by "scrolling the movie clip" but assuming you have a movieclip that is larger than the area you want to display it, something like this might work:

<s:Group>
    <s:Scroller>
        <mx:SWFLoader source="@Embed(source='movieclip.swf')"/>
    </s:Scroller>
</s:Group>

Answer 3

Sorry if this is a bit of a thread-jack, but I recently had a situation where I needed this type of functionality. And while I'm sure you no longer need an answer to this, I hope that the solution that I came up with will help someone else.

Dear god, why would someone do this?!

In my particular case, I had an extremely long textfield that needed to scroll. In my experience, scrolling by moving the movieclip vertially is unreliable when dealing with extremely long textfields which necessitated that I use the Adobe/Flash uiscrollbar-esk method of adjusting the scrollV of the text field.

This was further complicated by the need for both in-line images which pulled from the library (as opposed to an external source) as well as a black-box border around a section of the text, both of which needed to scroll along with the text.

In a nutshell, one would probably only need to do something like this for a completely self contained swf and under extenuating circumstances (like pharma banners).

Inserting Images From Library:

To accomplish this you need to create a movieclip from an image in the library and export that movieclip for Actionscript. Then, in your code, add something like this:

//This is a string from your textfield that you will replace with an image
var matchForImageSplit:String = 'IMAGE 1 GOES HERE';

//This is the code to replace the above string
//Here, "Image1" is the class name of the exported MovieClip
var imageToAdd:String = '<img src="Image1" />';
my_text.htmlText = my_text.htmlText.split(matchForImageSplit).join(imageToAdd);

Adding the black-box border around text:

This was a bit more tricky. What I had to do was create a MovieClip with a border at the size I needed and give it a name. Then I positioned it behind the text where it was supposed to go, and enclose all of that in a parent_mc movieclip.

I then had to code the box to move along with the scrolling. The below is specific my project, but this is the gist of it:

//THIS CODE IS NON-FUNCTIONAL AND SHOULD ONLY BE USED AS A REFERENCE

//Redundant - just making the example more clear.
var my_text:TextField = parent_mc.my_text; 
var borderBox:Sprite = parent_mc.borderBox;

//Vars for calculating position and movement
var borderBoxStartY:Number = borderBox.y;
var incrementRate:Number = my_text.textHeight/my_text.numLines;
var sPos:Number;
var top:Number = dragger.y;
var bottom:Number = (dragger.y + track.height) - dragger.height;
var range:Number = bottom - top;
var ctrl:Number = parent_mc.y; //"parent_mc" is the parent MC that contains the textField and borderBox

function dragScroll():void {
  ratio = my_text.maxScrollV/range;
  sPos = (dragger.y * ratio) - ctrl;  

  my_text.scrollV = Math.ceil(sPos);
  borderBox.y = ((borderBoxStartY + incrementRate) - (my_text.scrollV * incrementRate));
}

One caveat to note before trying all of this is that when utilizing scrollV, text is moved line-by-line and therefore does NOT scroll smoothly (as it would with position based scrolling). This can result in the scrolling looking "jerky".

EDIT: I should also note that this was all custom programmed and does not actually utilize the scrollPane/uiscrollbar components, but behaves in the same fashion.