• Adobe After Effects Expressions

  Expression to a change layer’s position depending on direction of Parent

  Posted by Matthew Posorske on June 3, 2021 at 9:55 pm

  I’m building a modular Menu UI in After Effects but I’m having trouble figuring out how to write the expression for part of it. I’ve included a GIF mock-up of what I’m trying to attempt to give some clarity.

  Specifically, I have a list and a header and when you scroll down the list the header slides up out of frame. So far so good. However, my issue is bringing the header back as soon as you scroll up the list, and to match the speed of the list. In other words, if you scroll all the way to the bottom of the list and slowly scroll up, then the header starts reappearing immediately and at the same speed.

  Hopefully, that makes sense. Any help or suggestions would be appreciated!

  

  Dan Ebberts

  

  replied 5 years, 3 months ago 2 Members · 3 Replies
• 3 Replies

• 

  Dan Ebberts

  June 4, 2021 at 2:38 pm

  I think your expression first needs to determine if the list is scrolling up, and if so, how far has it moved? To calculate the how far part, I think you’ll need to use valueAtTime(), to move back in time, frame by frame, to find the frame where the scrolling up began, and harvest the list’s position at that frame. Use that and the list’s current position to calculate how much of the header should currently be exposed. Tricky, but possible.
• 

  Matthew Posorske

  June 7, 2021 at 8:48 pm

  Thanks for the thoughts Dan! I’ve been able to write out an UP or DOWN expression:

  var oneFrame = thisComp.frameDuration;

  var previousFrame = time – oneFrame;

  var currentPosition = thisComp.layer(“Blue”).transform.yPosition;

  var lastPosition = currentPosition.valueAtTime(previousFrame);

  if(lastPosition > currentPosition) {“UP”;}else{“DOWN”;};

  But not sure how I would go about triggering the ValueAtTime() and attaching it to the position.

   
• 

  Dan Ebberts

  June 7, 2021 at 10:05 pm

  The key to the whole thing is finding the time when the list starts moving in the direction that causes the header to be revealed. That code will probably look something like this, but not knowing how you have things set up, I’m not sure what you need to do with the resulting time value, t:

  y =  thisComp.layer("Blue").transform.yPosition;
  t = 0;
  if (y.velocity >= 0){
    for (f = timeToFrames(time); f >= 0; f--){
        if (y.velocityAtTime(framesToTime(f)) >= 0) continue;
        t = time - framesToTime(f);
        break;
    }
  }
  t

Reply to this Discussion! Login or Sign Up