Skip to main content
Inspiring
October 27, 2023
Question

Linking gradient ramp to slider

  • October 27, 2023
  • 4 replies
  • 792 views

I have a gradient ramp, and I want to link only the vertical axes of the Start and End to a single Slider control. And I want them to stay 100 pixels apart. How do I do this?

 

Thank you.

This topic has been closed for replies.

4 replies

Community Expert
October 27, 2023

You would add an expression control slider to the layer, tie the y position of the Start Value for the gradient to the slider, and

then add 100 to the y value of the End Value for the gradient. If the gradient is on a shape layer, the expressions would look like this:

// Start property
t = - thisComp.height/2;
y = t + effect("Slider Control")("Slider") * 20;
[value[0], y]

// End property
x = content("Rectangle 1").content("Gradient Fill 1").startPoint[0];
y = content("Rectangle 1").content("Gradient Fill 1").startPoint[1] + 100;
[x, y]

Because the gradient position is centered on the layer, you would define the top of the comp by subtracting half the comp height. To make the slider work on a percentage of the comp height, instead of having to scroll to numbers over 1000, multiply the slider value by 20, so zero to one hundred will give you a slider that moves the start point from the top to the bottom of the comp.  

 

If you are using Gradient Fill, you don't have to subtract half the comp height.

 

 

Inspiring
October 27, 2023

Thank you. Sorry, I'm not quite understanding. Shouldn't I simply pick-whip the Start and End ramp positions to the slider, then modify the expressions that AE generates? If I was able to separate the x and y positions of those points, like you can with a lot of other things, I wouldn't be so confused.

Inspiring
October 27, 2023

... for example... when I pick-whip the ramp start to the slider, and type at the end of AE's expression "+100" it does what I think it should do, but only on the x-axis instead of the y. I don't know how to make it effect the y and not the x.