Turning on "Cap" centers layer vertically
I’m trying to understand how the Cap/middle/base feature works.
I have 3 layers that I would like to have aligned vertically within a precomp. In my screenshot, you’ll see if I my selected text layer Aligned To the Top with a padding of 10. The “see” layer is attached to the “Brought…” layer on the bottom edge, and the “For more info…” layer is attached to the “See” layer on its bottom edge, both with an attach padding of 20. That works as expected, with the lower two layers following the “Brought” layer.
However, when the “Brought” layer to Cap, “see” to Middle, and “For more” to Base, “brought” moves to the center of the comp, but the “see” and “for more…” layers don’t respond.
I’m really just trying to get the distributed evenly vertically. And I realize I can just use the Distribute Vertically command, but I’m trying to understand how this feature works so that I can use it effectively when the situation arises.
Thanks for getting in touch with us. It’s not 100% clear from these screenshots what’s happening here, but before we move any further in troubleshooting, I wanted to inform you that there’s a new version of Templater coming early next week that should address some previously reported issues with the Alignment/Attachment options. I’d recommend that we wait and check out that update before doing any additional troubleshooting to see if the problems we’re seeing are fixed in the new version of the software.
With that in mind, I did have one other suggestion that might help with this scenario. If we want to align all three layers vertically in the comp, it might be easier to center the middle layer and then align the layers above and below based on that layer’s position.
So, for this scenario, we’d want to choose the “Initialize to center” option for the “see” layer and then align the “Brought to you by” layer to the top of the “see” layer. Then, we can attach the “for more information” layer to the bottom of the “see” layer.
This would make the “see” layer the anchor that determines the vertical positioning of the other two layers and should result in a more uniform layout. In this scenario, we wouldn’t need to use the “Group Position” options, which might get around the issue seen in the screenshots.
Let’s start by checking to see if the new version of Templater changes what we’re seeing here, and then, if we still have problems, we can move forward from there.
@Jeff I like your idea, except when I use “Initialize to center”, it moves the layer to the center both vertically and horizontally. I didn’t show everything in my previous screenshots, so here’s what I’m trying to do overall, and maybe there’s a better way to go about it:
The text in italics will be dynamic layers. What I’m trying to do is vertically distribute the 3 lines in this precomp. And then, based on the length of the italics layer, I want the whole line to be centered horizontally. Is it possible to make a specific section of a text layer to be dynamic, while the rest of the text layer is not? That would make it simple to just center one layer, instead of multiple. I’m okay using expressions if needed to get this to work.
EDIT: I found an expression that might do the trick. I’ll follow up with my results. Thanks!
So, the expression I found didn’t help. It got me part of the way there, but I can’t take it the rest of the way.
Here’s what I have so far, applied to the Right layer, the dynamic text layer:
leftLayer = thisComp.layer("Brought to you by ");
leftSize = leftLayer.sourceRectAtTime();
rightLayer = thisComp.layer(“prp_company”);
rightSize = rightLayer.sourceRectAtTime();
hSpacing = thisComp.layer(“Null 2”).effect(“hSpacing”)(“Slider”).value; //spacing between left and right layers
pLeft = leftLayer.position;
sLeft = leftLayer.scale * .01;
tLeft = leftSize.top * sLeft;
hLeft = leftSize.height * sLeft;
wLeft = leftSize.width * sLeft;
lLeft = leftSize.left * sLeft;
pRight = rightLayer.position;
sRight = rightLayer.scale * .01;
tRight = rightSize.top * sRight;
hRight = rightSize.height * sRight;
wRight = rightSize.width * sRight;
lRight = rightSize.left * sRight;
totalWidth = wLeft + wRight + (hSpacing*2);
centerX = (thisComp.width /2) - (totalWidth/2); // got this from ChatGPT, and it’s not right
I’m really not sure where to go with this. The right layer needs to be offset to the right or left depending on how wide it is, and that offset must always take into account the width of the left layer (which will stay constant) and the hSpacing value.
I did a little thinking on this, and I believe I might have a solution that doesn’t involve quite as much alignment manipulation via Expressions. For this implementation, I think it’ll be easier to consolidate the Templater data into three separate lines and then use an Animator to create a faux italic effect. That way, we can still use Templater to center all three lines vertically in the way that I previously described.
To start with, we’ll want to bring the name of the company and the name of the person in on separate text layers. I’m going to call those layers “company” and “representative” (with no quotes). Once Templater brings those values in correctly, we’ll want to create our three text layers (I’ll refer to them as text1, text2, and text3). I think the easiest way to align them vertically will be the way I suggested, where we center text2 and then attach text1 to the top and text3 to the bottom.
Once all three layers are positioned properly, we’ll want to add the Templater data to the source text. To start, we’ll open up the first layer and alt/option click on the “Source Text” property. From there, we’ll want to apply this Expression:
text.sourceText = "brought to you by " + thisComp.layer("company").text.sourceText;
This will automatically add the text brought in on the “company” layer to the appropriate spot in the text1 sentence.
Similarly, we’ll add this Expression:
text.sourceText = "see " + thisComp.layer("representative").text.sourceText + " at the front"
to the Source Text property of the text2 layer. Using this method, we should now have our Templater text added to text1 and text2 without splitting the layer into multiple parts. This should allow us to use the “Initialize to center” option in the Alignment section of the Templater Settings window to ensure that everything remains centered regardless of the text that’s present.
Finally, we’ll want to set up the Animators to create the faux italic effect. Let’s start with the text1 layer. Open the layer and click the small “play” button next to the “Animate” option. Choose “Skew” from the list. This should add a new menu item to text1 named “Animator 1”. Open up “Range Selector 1” and expand the “Advanced” section. From there, choose “Index” for the Units and “Words” for Based On. Once that’s done, make the “Start” value 4 and the “End” value 5. This should choose only the last word in the sentence for the Animator. Finally, change the “Skew” value to whatever looks right (I used 15 in my testing).
You’ll want to repeat this process for the text2 layer, with 1 as the “Start” and 2 as the “End.” This should apply the “Skew” value to the second word in that sentence. Once all that is done, you should have three lines with the faux italic effect assigned to the appropriate word in the sentence.
Hopefully, that gets you moving in the right direction, but I did want to mention one more thing before wrapping up. The new version of Templater has an option to horizontally center multiple layers of text the way that it seems we were trying to achieve with the earlier Expressions. Once the latest version is released, it may be worth tinkering around with that.
Let us know if you have any questions,
@Jeff After not having any success with the expression I posted, I actually did what you suggested, using an expression to change the source text for each layer, adding in the dynamic text. I just didn’t think of using an Animator for the faux italics, so I had just resigned myself to keeping the font the same. I appreciate your ideas, and I’ll give them a try soon. Thanks!