Monday, July 31, 2006

Lesson 4 : If/Else

In previous topics, we've covered some basic ways to define or modify parameters using After Effects expressions. But let's do something a little more complex to start harnessing the practical side of expressions.

What we discussed in prior topics was how to create some values based on time, or index. But, these values were always absolute. There is nothing telling After Effects that "if this value reaches a certain point, then do something else". This is exactly what if/else is for.

Consider the following example. Put this on the position of, perhaps, a type layer.

xPos= time * 200 ; yPos = position[1] ;

[ xPos , yPos ]

If you've been reading the other blogs, this should mostly make sense, but let's review.

We declare a variable "xPos" to be equal to time multipied by 200. Remember, time is the current time of the AE playback head or "CTI". As the time in the comp time becomes greater, the value of the term time increases. Therefore, as time in the comp progresses, the text moves in a postive direction in the X axis.

Next, we provide AE with the values that we want our position to be. Unlike parameters like opacity that are defined by one number, position is defined by multiple numbers (x and y, in this case), which we call an array. When we provide AE with the values for an array, we need to use this kind of format:

For a 2d layer:

[ x , y ]

or for a 3D layer:

[ x , y, z ]

So in our example, [ xPos , yPos ] is providing the x and y values.

xPos =========> is X

yPos =========> is Y

position[1] is just like value[1] that we've covered before, just specific to position. So, position[1] is the exisiting Y value that you can modify.

What were we talking about? Oh yeah, if/else.

What if we wanted this movement to stop at, say, a value 200 in the x axis?

In plain English (as that is what I speak), I would say:

"If the position of my object is less than 200, then keep moving, otherwise stop".

The way we say this in expressions is like this:

if (condition){ result1 }else{ result2 }

AE will not even look at anything beyond line result1 if the condition is true. When condition is not true, AE will ONLY be concerned with result2. It's always going to look at result1 OR result2, never both with if/else.

So, for this to work with our example, this would be the code:

xPos= time * 200 ;

yPos = value[1] ;

if (xPos < 200){

[xPos, yPos];

}else{ [200 , yPos ] ; }

Let's take this apart. First we declare our variables:

xPos= time * 200 ; yPos = value[1] ;

Then we have:

if (xPos < 200){

which means: If the condition of xPos being less than 200 is true... then the result is:

[ xPos , yPos ];

However, if it is not true..

}else{

Then set the x position equal to 200, and y position to yPos:

[200 , yPos ] ;

Then close the brace:

}

As xPos increases, our type's x position increases. When xPos is over 200, the type's x-position becomes fixed at 200.

You might be a little overwhelmed by a lot of things that look unfamiliar, like these { and } braces. When using an if/else condition, we have two possible results: if the condition is true do result1, else do result2. Both of the results must be enclosed with these { } braces, even if on different lines. We can right this several ways, like:

if (condition)

{result1}

else

{result2}

But, the first way of writing it is more common, as result1 and result2 are not limited to one line of code, they could be a complex computation, and becomes easier to view if the brackets are pushed out of the way. ALWAYS REMEMBER.. never put one brace { without closing it with another brace }.

Give that a try and check back for more expression topics!

10 Comments:

Blogger Lompoc42 said...

This blog is fantastic! I'm actually understanding and retaining the information presented here.

If you packaged this into a complete book, I'd buy it in a heartbeat.

5:56 PM  
Blogger Harry said...

Mmmmmaaaybe just maybe some video training is coming.

7:49 PM  
Blogger barny said...

Thanks for the blog but still having trouble with the conditional expression. (I only write pretty simple stuff myself and have never gotten into if/else).

Okay, I have a character with four different heads (looking forward, looking sideways and two in-betweens) and I want to control the opacity with a slider ie. so if the slider value is 1 then layer(head_side)'s opacity is 100 and the other layers’ opacity is zero. And if slider value is 2 then layer(head_turn_1)'s opacity is 100 and the other... etc.

so I put in a null and called it "head_crtl", applied a slider then created an expression in in "head_forward"'s opacity reading-

if(thisComp.layer("head_ctrl).effect("Slider Control")("Slider")=1){100}
else{0}

I thought that would do it but I get an error message "Can't appear on the left hand side of an assignment, because it is read only. Error occurred at line 1.”

I know I’m probably going about this ass backwards but if anyone could tell me what I'm doing wrong it would be much appreciated. It would seem to be a simple thing to write. Thanks

7:34 PM  
Blogger Lloyd Alvarez said...

Hey Barny, You have a small error in your expression.

In Javascript one = sets a value and == means "equal"

myvariable = 1 //sets the value of myvariable to 1

if (myvariable == 1) //asks if the value of myvariable is 1. Then the conditional is true.

Hope that helps, Lloyd

1:04 PM  
Blogger Andy said...

Thank you so much! This is the most well written stuff sbout expressions I have seen so far on any site!

7:05 AM  
Blogger Nate Bro said...

This really is a well written site. Even the user comments teach you something! I am planning on taking college courses in javascript programming, but as of right now am just a beginner. In the realm of amatures, there is no other tool quite so concise, informative, and correct as this blog! (Believe me. I checked) Thanks for all your work. :)

3:51 PM  
Blogger james william said...

I love your site! You will be in our prayers and thoughts! Nice and informative post on this topic thanks for sharing with us.Thank you


Logo Maker

5:29 AM  
Blogger Charles Sorensen said...

Very nice article! nice to reading this post!!

best essay writing service company

12:20 AM  
Blogger sindhu said...

A nice article here, i think that people who have grown up with the idea of using computers are showing more responsibility towards writing posts that are thoughtful, do not have grammar mistakes and pertinent to the post..

CRO Agency in Chennai

3:29 AM  
Blogger Anthony Fedor said...

Very useful post actually your shared here.I am sure your post will help students more in their study. It helped me lot. Thank you.
best essay writing service

9:57 PM  

Post a Comment

<< Home