How could I change the colour for some characters in the text element?

Help & Support
#1

I want to stylise the text.

#2

https://developer.playcanvas.com/en/api/pc.ElementComponent.html#text

#3

@yaustar

Could you please give an example?
Also do we need to enable markup for the text field?

#4

Don’t bother, I got it thanks.

#5

@yaustar Is there a way to store the text in a variable and use the same here?

#6

I have a string being passed to me which I have to highlight.

#7

Not sure what you mean here? You can store strings in variables as normal

#8

like I want this text to be dynamic such that I don’t have to write the whole expression separately for each of them. Is there any regex that we could use to wrap up the text within the required expression?

#9

It’s a string so you can do whatever you like that you can do with a string. I’m not exactly sure what you are asking here?

Can you give a clear example?

#10

this seems working well ‘[color="#ff0000"]text[/color]’

but when I am doing as follows the output is “myText” in red colour.

let myText = “hello world”;
using ‘[color="#ff0000"]myText[/color]’

Is there a way we could sort it out?

#11

Still not sure what you are asking?

let myText = "hello world";
this.element.text = '[color="#ff0000"]' + myText + '[/color]';

Is this what you are asking?

#12

Yes apparently it seems to be an easy string append. Don’t know what I was thinking there with regex. Sorry to bother you.