Help with liquid animation filling a pipe

[dzineduk (Matt)]

Hi Peeps

I want to create an effect of a pipe filling with liquid from left to right.

Think horizontal white rectangle, an as time goes on, the white becomes yellow going from left to right as if the pipe has been filled with liquid

I think its something to do with masks.

Any help would be appreciated.

[MarkHunte]

This may help you

Masking Elements by using Content Overflow & Groups Help!

I’m trying to create a clipping mask over an image. Ive been following these instructions Masking Elements by using Content Overflow & Groups but it only works horizontally. When i try to make the ‘water’ reveal from bottom to top the position of the water moves with it. How do keep the water in the same position? [image]

[TYancy (Trey Yancy)]

Here’s an example:
1 Create a rectangle for the inside of the pipe. Color it yellow.
2 While it is selected, use Arrange > Group.
3 Select the group and give it a fill of white and a stroke of 0.
4 Dupe the yellow rectangle and drag it out side of the group and move it below the group. Give it a gray stroke (and gray fill, if you want, it doesn’t matter). Adjust the height and position of the stroked rectangle so that it shows evenly on top and bottom. Narrow it so that the right and left edges vanish.
5 Group the whole thing
6 Select the original group and use the Metrics Inspector to set the overflow to hidden.
7 Select the yellow rectangle, go to the end of the planned animation and set a keyframe for Origin (top).
8 Go to the start of the animation, set an origin top keyframe, then drag the yellow rectangle down until it vanishes.

Try it out.

Options: Toss in an object with a yellow-to-white gradient, group it to the yellow object and then insert the keyframes. Add a yellow oval and some horizontal movement and add a sense of flow.

whiteYellowPipe.hype.zip (17.1 KB)