Participating Frequently

Answered

HTML5 Canvas / using html code in dynamic textfield

Forum|Forum|7 years ago
February 11, 2019
3 replies
7838 views

Hello, and first sorry for mu english
I am trying o make a animation with dynamic text field, everything work with simple text, but when I want to manipulate a text with html code it doesn't work

My code

info = "<b>Hello</<b>";

myTextField.text = info; ///doesn't format my text

myTextField.htmlTxt = info; ///doesn't format my text

I am making that in a HTML5 Canvas

Thanks for your help !

This topic has been closed for replies.

Correct answer JoãoCésar17023019

Hi.

Animate regular text fields are canvas based. So you cannot style text using HTML tags.

This is a canvas limitation.

And that html option for text field is greyed out because it only works in AS3 documents.

If you want HTML formatting, you can use a Label component (Window > Components).

Then you can change the text like this:

setTimeout(function()
{
    dom_overlay_container.children[0].innerHTML = "<b>Hello</<b>";
}, 0);

Then you wrap this label component inside of a Graphic or Movie Clip symbol for animation.

I hope this helps.

Regards,

JC

SpoutAuthor

Participating Frequently

Hello,

back to my probleme, the solution work, but when I add a new movie clip with a the text component, I can not add a new HTML text inside(only the first the first is load), and when the animation loop, the text doesn't want to load anymore in any movie clip any idea to solve that problem?

Thanks for your help

JoãoCésar17023019

Community Expert

Hi.

Can you provide a sample showing this issue?

Regards,

JC

SpoutAuthor

Participating Frequently

Hello JC, thanks a lot!

Here is my source : https://we.tl/t-FRnGjInHFH

My mains problems is that :

- when I try to insert two texts for two Components at the same moment, only one is insert

- when the animation loop, there is no text anymore

thanks!

JoãoCésar17023019

Correct answer

Community Expert

Hi.

Animate regular text fields are canvas based. So you cannot style text using HTML tags.

This is a canvas limitation.

And that html option for text field is greyed out because it only works in AS3 documents.

If you want HTML formatting, you can use a Label component (Window > Components).

Then you can change the text like this:

setTimeout(function()
{
    dom_overlay_container.children[0].innerHTML = "<b>Hello</<b>";
}, 0);

Then you wrap this label component inside of a Graphic or Movie Clip symbol for animation.

I hope this helps.

Regards,

JC

avid_body16B8

Legend

Awesome JC, you know your stuff!

G

GoryGreg

Inspiring

Hi,

You can't style dynamic text like that in Animate. The code used in Actions is JS (CreateJS) and not HTML.

Click on your text field on the stage and select your typeface you want in the Properties panel. Click on the small ball (world?) to the right of the Family drop-down and choose from Adobe Fonts or Google Fonts if you like.

SpoutAuthor

Participating Frequently

Thanks a lot Greg!
When I click on the ball it show me TypeKit/google Fonts, I can see in this panel that you can turn on the <> button certainly to use html tag for my text, but I can not acces to this button (My text field is on Dynamic) any idea ?

thanks!

G

GoryGreg

Inspiring

No worries.

Yeah, unfortunately that is greyed out/not accessible as it is not available when you work in HTML5 Canvas mode. Sorry I cant be of more help.

Cheers.

Sign up

To post, reply, or follow discussions, please sign in with your Adobe ID.

Sign in to Adobe Community

To post, reply, or follow discussions, please sign in with your Adobe ID.

Scanning file for viruses.

This file cannot be downloaded