ADOBE AFTER EFFECTS: Forum Expressions Tutorials Creative Cloud

changing text color within a "tag"

COW Forums : Adobe After Effects Expressions

<< PREVIOUS   •   FAQ   •   VIEW ALL   •   PRINT   •   NEXT >>
nicholas kiray
changing text color within a "tag"
on Jul 31, 2017 at 8:41:15 pm

hi!

I want to create an expression that changes color between two tags. For example, in this sentence:
Hello, my name is Nick.

it would be typed like this in the text layer
Hello, my name is [Nick].

I already figured out how to remove the brackets, what I'm struggling with now is how to change the color. I tried making an expression in the fill color but nothing happens, even when I disable the expression that removes the brackets from the string.

(note: "<" is showing up as "<" for some reason in the code")

thank you!
Nick

<code>

highlight = comp("COLOR CONTROL").layer("TYPE ACCENT COLOR HERE").text.animator("Animator 1").property.fillColor;
normal = comp("COLOR CONTROL").layer("TYPE TEXT COLOR HERE").text.animator("Animator 1").property.fillColor;
output = normal;

for (i = 0; i &lt; text.sourceText.length; i++){
if (text.sourceText[i] == "["){
output = highlight;
}
if (text.sourceText[i] == "]"){
output = normal;
}
}

output


</code>


Return to posts index

Dan Ebberts
Re: changing text color within a "tag"
on Jul 31, 2017 at 10:40:46 pm

I'm not sure this will help, but it might give you some ideas.

If you add a Fill RBG animator, and an Expression selector, then apply this expression to the Amount property:


txt = text.sourceText;
val = 0;
b1 = txt.indexOf("[");
b2 = txt.indexOf("]");
if (b1 > -1 && b2 > -1 && b2 > b1){
if ((textIndex-1) > b1 && (textIndex-1) < b2) val = 100;
}
val


It should apply the fill color to anything between "[" and "]". The expression would need to be modified if you have multiple lines in the text. It would also need to be modified if you have more than one word that needs to be tagged.

BTW--the way to avoid having your < characters mangled is to post direct, without previewing.

Dan



Return to posts index

nicholas kiray
Re: changing text color within a "tag"
on Aug 1, 2017 at 3:22:21 pm

it works!!!!! thank you so much!!!!!

the only issue I have now is when I remove the "[" and "]" brackets from the string using the below code, it doesn't read as characters in the fill. Is there a way I can read the "fill" expression before the source text's expression?

str = text.sourceText;

res1 = str.replace("[", "");
res2 = res1.replace("]", "");

[res2]


Return to posts index


Dan Ebberts
Re: changing text color within a "tag"
on Aug 1, 2017 at 4:10:39 pm

I think I'd try it this way--change your Source Text expression so that it replaces the brackets with zero-width space characters:

str = text.sourceText;
zws = "\u200b";
res1 = str.replace("[", zws);
res2 = res1.replace("]", zws);


Then change your Expression Selector expression to look for those:


txt = text.sourceText;
zws = "\u200b";
val = 0;
b1 = txt.indexOf(zws);
b2 = txt.lastIndexOf(zws);
if (b1 > -1 && b2 > -1 && b2 > b1){
if ((textIndex-1) > b1 && (textIndex-1) < b2) val = 100;
}
val



Dan



Return to posts index

nicholas kiray
Re: changing text color within a "tag"
on Aug 1, 2017 at 4:17:04 pm

I had a similar idea! I did it a little differently though; basically added an expression selector for "opacity" and "tracking" and when the if statement found a "[" or "]", it would change the opacity to 0 and change the tracking to -45. Technically the brackets are still there but they are invisible ☺

thank you so much for your help dan!

txt = text.sourceText;
val = 0;
b1 = txt.indexOf("[");
b2 = txt.indexOf("]");
if (textIndex== b1 || textIndex == b2) val = textIndex;
val


Return to posts index

nicholas kiray
Re: changing text color within a "tag"
on Aug 1, 2017 at 9:23:54 pm

I had a similar idea! I did it a little differently though; basically added an expression selector for "opacity" and "tracking" and when the if statement found a "[" or "]", it would change the opacity to 0 and change the tracking to -45. Technically the brackets are still there but they are invisible ☺

thank you so much for your help dan!

*edit* your method of using the zero width space worked much better than my kerning attempt. nice job!


Return to posts index


Christian Geijer
Re: changing text color within a "tag"
on Mar 7, 2018 at 6:44:58 pm

Hi Dan!

I've used your example with zero width space replacement and it works perfectly. However I'm trying to get it to work with multiple instances of [ ]-tagged words. I'm creating a template and I want the user to be able to highlight as many words they like with [ ]-tags.

Is this possible to do? And I hope it's okay to bump an old thread like this.

Thanks!


Return to posts index

Dan Ebberts
Re: changing text color within a "tag"
on Mar 7, 2018 at 7:59:35 pm

You could try it with this for source text:


str = text.sourceText;
zws = "\u200b";
res1 = str.replace(/\[/g, zws);
res2 = res1.replace(/\]/g, zws);


and this for the expression selector:


txt = text.sourceText;
zws = "\u200b";
idx = 1;
i = 0;
n = 0;
while (idx < textIndex){
if (txt[i] == "\r"){
i++;
continue;
}
if (txt[i] == zws) n++;
i++;
idx++;
}
if (n%2) 100 else 0



Dan



Return to posts index

Christian Geijer
Re: changing text color within a "tag"
on Mar 7, 2018 at 8:38:23 pm

Amazing! It works perfectly!

The only thing is that we import the sourceText value from a .json file embedded in the project. When changing the text in that file I get an error.
"Error at line 7 in property 'Amount' (...) property or method named 62 in Class 'TextProperty' is missing or does not exist."
But when I enter edit mode in the expression on 'Amount' and just apply the expression again, everything works. It somehow doesn't like having the text changed externally.

However, if I import the text value on a different text layer, and point to that sourceText from my first layer, everything works even when updating the values.

If the external connection doesn't like the .json connection, this is a way to go around it.

Thank you once again. I really appreciate the help.

/C


Return to posts index


Christian Geijer
Re: changing text color within a "tag"
on Mar 8, 2018 at 8:31:11 am

Hi again.

I appreciate the help, but is it okay if I ask another question regarding this?
Your solution works, but it takes about ten times more time to preview and render. Is that something that is solvable, or are these kinds of looping expressions just too heavy for After Effects? is it possible to reduce the times in any way?

Thanks
/C


Return to posts index

Dan Ebberts
Re: changing text color within a "tag"
on Mar 8, 2018 at 5:49:30 pm

I just threw it together to demonstrate the technique. I suspect there are ways to optimize it, and probably better ways to do it. One of the issues is dealing with the difference between textIndex and the index into sourceText for the same character if there are multiple lines. If you're not dealing with multiple lines, I'm sure we can make a lot more efficient.


Dan



Return to posts index

<< PREVIOUS   •   VIEW ALL   •   PRINT   •   NEXT >>
© 2018 CreativeCOW.net All Rights Reserved
[TOP]