Movie Clip

Documentation DCO Enabler -> ENABLER ADOBE ANIMATE CC -> Movie Clip

MovieClip
➜ MovieClip:SetText
➜ MovieClip: AddTextElement
➳ MovieClip: adapt Text
➽ MovieClip: set And AdapText
↨ MovieClip: vertical Align
✪ MovieClip: add Image
♫ MovieClip: add video

MovieClip

The MovieClip category allows you to inject code in order to dynamize MovieClip components.

It is possible to add text, images, video, and a clickTag. The createJs API used by Adobe Animate offers more flexibility than the TextField (learn more).

If you use the MovieClip‘s code snippet, the MovieClip’s properties (size and position) will automatically be adjusted, even if you change the size afterwards.

Create a MovieClip object as below:

SetText :

The setText method adds text to a MovieClip without changing the text size (more info).

Select the MovieClip and click on “➜ setText”. The dynamization code of the MovieClip is injected.

Result:

addTextElement

The addTextElement method creates a TextField field inside your MovieClip. You can specify the font, size, and behavior.

Settings:

movieClip –> Your MovieClip element (do not edit it)
bounds –> MovieClip size (do not edit it)
font –> Type, size and name of the desired font, for example: “bold 15px ‘Arial’ “
option –> Options to apply to the textField, for example: {color :”red”,lineHeight:15}

Available Options:

textBaseline,textAlign,lineHeight,x,y,lineWidth,MaxMeight,scaleX,scaleY,color,alpha,mask,outline,regX,regY,rotation,shadow,skewX,skewY,tickEnabled,transforMatrix,visible

More information about the properties of TextField.

By using this method, we can create a textField field inside a MovieClip, and its behavior will be identical to a normal textField.

Example :

adaptText

The adaptText method adjusts the font of your text (more info).

Select the MovieClip and click on « ➳ adaptText » :

Fill in the desired minimum font size (highlighted in red above).

Result:

SetAndAdaptTex

As with the adaptText method, the setAndAdaptText method automatically adds and adapts your texts.

Select the MovieClip and click on “➽ setAndAdaptText”. To customize the text, enter the font and its original size, as well as the desired minimum font size, as shown below (more info) :

Result:

VerticalAlign

The verticalAlign method centers your text vertically in a movieClip (more info).

Select the MovieClip and click on « ↨ verticalAlign ».

Result:

AddImage

The addImage method adds an image in a MovieClip.

Two methods are available (more info):

✩ AddImage: adds an image in the MovieClip without changing its size.
✪ addAndAdaptImage: adds an image in the movieClip and adapts its size to the MovieClip’s size.

Select your MovieClip and click on “✪ addAndAdaptImage”:

Make sure to assign your url and/or assets to the method, as above.

Result:

AddVideo

The AddVideo method adds a video in a MovieClip, adapting its size to the movieClip’s size.

Select your movieClip and click on “♫ Add Video”:

Now set up the player by specifying your videos’ URLs (mp4 and webM), behavior (autoplay, show controls), css, and possible click url (more info).

Result:

CODE SNIPPET: Dynamic banner in a few clicks

MENU