SourceRectAtTime() Expression- Adobe After Effects tutorial
The new sourceRectAtTime() can get you the width and height of text and shape layers. It’s new but it’s good. If you have Ae CC 2014.2 (aka 13.2.0.0) then you can enjoy this. If you don’t have that option open and you want to make solids resize to text you should check out an older tutorial on this site.
This tutorial also talks for a long time about expressions in general, so if you’re not into that… get out now!
This is the expression we wrote on the size:
s=thisComp.layer(“Hello people”);
x=s.sourceRectAtTime(time-s.inPoint,true).width;
y=s.sourceRectAtTime(time-s.inPoint,true).height;
[x,y]
This is the expression we wrote on the position:
content(“Rectangle 1”).content(“Rectangle Path 1”).size/2
If you have any questions just let me know in the comments.
Download this project file:
This file ONLY works in After Effects 13.2 and newer.
Robert
21.02.2016 at 02:02I added a wiggle to the anaitmor that was doing 3D position. The mode was Add and I keyed Min 0 at start and finish and then keyed -15 in the middle and it gave and nice little one bounce effect.Not Inertial but not bad!
Ze'ev Gilad
07.12.2016 at 17:08This is great, but is there a way to set the anchor point to the absolute center or corner of the region? It seems to have 0,0 at the bottom of the first row of text, whose height is arbitrary based on font and size.
ecabrams
07.12.2016 at 17:15Hey Ze’ev. First, the anchor point is certainly not “arbitrary”. The anchor point for text is based on the paragraph settings and located at the baseline in keeping with the paragraph settings. You could use the sourceRectAtTime to relocate that anchor point into the middle centre of a layer if you wanted. You would simply need to move it to the average of the height and width right?
Ze'ev
09.03.2017 at 15:41By “arbitrary” I mean that I don’t see a way to get its value through expressions. [0,0] seems to be at the center of the baseline of the first line of text. Which would change based on the font size of the first line. I need to vertically center blocks of text that have different font sizes.
So not sure what you mean by “use the sourceRectAtTime to relocate that anchor point” … I can offset it from 0,0 — but I don’t know where 0,0 is relative to the bounding box.
Or maybe I’m missing something.
Bardot
07.07.2017 at 10:23Thank you so much for this! Big time saver!
But I am trying to add a little chat bubble “tail”. I cannot add it to the rect,
If I add a shape it won’t align to the bottom of the rect while the rect changes its size.
I cannot seem to connect the “tail” to move with the bottom line of the rect.
Or is it possible to add that shape directly to the shape of the rect?
Tips are welcome and appreciated, as I am not very good in expressions, more the keyframe kind of girl 😉
Bardot
07.07.2017 at 10:40thisComp.layer(“BOX”).content(“Rectangle 1”).content(“Rectangle Path 1”).size
fowls ot, But in both directions. x and y scale. But I only want to move it up and down, aligning to the bottom of the rectangular and .
Tristan Summers
06.12.2017 at 11:06Has anyone ever made this work with centre aligned text and rounded corners, allowing for multiple lines? Animation template maybe?
Costel S
07.02.2018 at 13:22What if I want to start the width and hight from a specific value and then the Box scaling beyound those values with the length of the text if its a long pararaph.
For like a tweet box
ecabrams
26.05.2018 at 10:29You may need to use a if/eles expression in that case.
Emiliano
22.02.2018 at 13:22Hi Evan,
Very nice tutorial.
I don’t know much about expressions, so I’m posting my question here:
What if I want to align the text on the right and have to box grow on the left instead?
Thank you
ecabrams
26.05.2018 at 10:28Then you will need to make use of dynamically changing the position of the parametric rectangle as the size changes. For example if you link the position to be 1/2 of the size that would make it seem like the box grows from one corner.
valdiola
02.04.2018 at 17:15Hi!
the code worked fine to me, thank you very much for the explanation.
I only have a question about the “time-s-inpoint”.. why we need to used and what’s the meaning and use of “ïnPoint”.
Regards.
ecabrams
26.05.2018 at 10:30the inPoint is the time where the layer’s In Point is. So let’s say the layer ran from 1 second to 10 seconds, the in point is 1. Does that clear it up?
Satwinder Kang
28.08.2018 at 06:45Hi great tutorial, just downloaded your project file. When i change the size of the font, the rectangle changes size but moves off above e the text. This results in the text and rectangle separating.
Any advice as to how I can alter the text size and retain the rectangle box at the same time.
Thanks
Sat
Emiliano Grimaldi
05.09.2019 at 08:37Hi Evan,
I think your tutorial is great and simple, I’m trying to figure out how can I resolve this:
I have two dynamic boxes/titles that should have a relationship with each other.
The two boxes contain titles and are on top of each other on the Y-axis.
I would like an expression that makes both boxes/titles expand to the width of the longer box/title, i.e. The one with the longer text dictates the width of the boxes.
Thank you for any help!
ecabrams
01.10.2019 at 19:55You can use an if/else expression to make that happen. The logic is:
if (a>b) {a} else {b}