使用表达式编辑和访问文本属性

上次更新日期: 2024年10月14日

使用表达式控件编辑文本样式和文本属性。

使用表达式来控制任何文本表达式或动态图形模板中的文本样式。 表达式可用于:

  • 链接多个标题并同时更新它们的样式(对于设计标题非常有用)。
  • 在多个文本图层之间保持字体、大小和样式同步。
  • 对文本属性进行全局更改。
  • 文本图层中设置单个字符的样式属性。

文本图层设置这些属性后,您可以引用该图层属性,以便在整个合成中轻松应用更改。 After Effects 表达式使用属性来读取(获取)文本样式值和函数方法,以将它们写入(设置)表达式引擎。 这样,您可以跨文本图层链接文本样式,或设置控件,以便为其制作动画或将其用于动态图形模板。

在您开始使用表达式编辑文本属性之前

  1. 选择项目设置 > 表达式 > 表达式引擎 > Javascript,将表达式引擎设置为 Javascript。
  2. 将表达式添加文本图层的源文本属性。
  3. 表达式语言弹出菜单中,选择文本 > 属性 > 文本属性文本 > 设置样式

可用的文本属性

可以使用样式对象读取和设置以下文本样式属性:

  • 字体
  • 字体大小
  • 仿粗体
  • 仿斜体
  • 全部大写字母
  • 小型大写字母
  • 跟踪
  • 行距
  • 自动行距
  • 基线偏移
  • 填充(启用/禁用)
  • 填充颜色
  • 描边(启用/禁用)
  • 描边颜色
  • 描边宽度
  • 数字组合
  • 缩放
  • 字符间距
  • 比例间距
  • 基线方向
  • 基线选项
“表达式语言”弹出菜单列出了可供选择的所有文本属性。
“表达式语言”弹出菜单列出了所有文本属性,包括当前在 After Effects 中的所有文本属性。

文本图层的源文本属性由表达式解释为 JavaScript 字符串。 可以使用 sourceText 读取文本本身,但如果要修改样式属性,则必须使用 setText 方法在样式对象上设置文本。 查看一些示例

包含段落的文本图层的表达式

开始新文本行

在字符串表达式中使用 \r 开始一个新的文本行。 例如,要将原始文本从一个图层复制到同一图层上,并在新行中用全部大写的字符重复原始文本,请使用以下表达式:

text.sourceText + “\r” + text.sourceText.toUpperCase()

可用的段落属性 

除了文本样式属性之外,还可以使用段落属性。 只能将这些属性应用于整个文本图层。 段落属性仅在 After Effects 中可用。

  • 方向
  • 多行书写器
  • 首行缩进
  • 对齐方式 
  • 行距类型
  • 左边距
  • 右边距
  • 段后间距
  • 段前间距
  • 罗马式悬挂标点
“表达式语言”弹出菜单列出了所有段落属性,包括当前在 After Effects Beta 版中可用的所有属性。
“表达式语言”弹出菜单列出了 After Effects 中包含的所有段落属性。

PostScript 字体表达式菜单

在表达式中引用字体时,它们必须使用特殊的“系统名称”(或类似名称)。 建议从文本 > 字体 > 选择字体对话框插入这一特殊名称,避免表达式错误。

  • 打开表达式语言弹出菜单,然后选择文本 > 字体。 这将打开一个带有下拉菜单的对话框,用于选择要插入到表达式中的字样和字体。
“字体”菜单
使用“表达式语言”菜单选择要插入到表达式中的字样和字体。

字体同步

仅在表达式编辑器中引用的字体不记录为项目使用的字体。 为确保所有在表达式编辑器中引用的字体将会“自动同步”或填充解析字体对话框,在图层上使用所有这些字体,即使该图层源已隐藏。

样式对象

文本图层的所有样式设置属性都存在于样式对象中,可使用以下方法在源文本属性上访问:

// 使用来源文本属性的完整路径
text.sourceText.style

// 使用当前属性的通用名称
thisProperty.style

使用单独的样式与使用上面两个示例中的任何一个相同,但是如果组合来自多个文本图层的样式属性,这可能会造成混淆。

也可以读取其他文本图层的样式属性。 使用关联器在上面显示的第一个示例的开头创建指向其他文本图层的链接。

// 访问特定文本图层的样式对象

thisComp.layer("Other Layer Name").text.sourceText.style;

文本图层中单个字符的样式属性

除了使用文本表达式来设置整个文本图层的样式属性之外,您还可以在图层中设置单个字符的样式属性。 逐字控件的优点是可自动重新排出文本,例如在缩放字母、使用上标和使用其他字体时,就像使用字符面板中的子字符串样式设置一样。

示例

更改某些词语的字体

text.sourceText.style
.setFont("Montserrat-Light")
.setFont("Gigantic", 0, 6).setFont("Gigantic", 10, 6).setFont("Gigantic", 20)

将文本图层的第一行设置为粗体并放大

text.sourceText.style.setFontSize(100, 0, 30).setFauxBold(true, 0, 30)

设置字符的上标

要使用该字符串,请添加带有“第一和第二位”文本的文本图层,并将以下内容应用于源文本

textourceTexttyleetBaselineOption(“superscript”,1,2)etBaselineOption(“superscript”, 9, 2)

组合样式和源文本

文本和样式
组合样式和源文本

要同时返回样式和实际源文本的值,必须结合使用 getStyleAtsetText 函数。 以下是如何编写此表达式的两个示例。

// 返回指定时间的样式和实际源文本的值(简写)

var sourceTextProperty = thisComp.layer("MAIN TEXT").text.sourceText;

var newStyle = sourceTextProperty.getStyleAt(0,0);

newStyle.setText(sourceTextProperty);

// 返回图层堆叠顺序中前一个图层的样式和实际来源文本值

var sourceTextProperty = thisComp.layer(index - 1).text.sourceText;

var newStyle = sourceTextProperty.getStyleAt(0,0);

newStyle.setText(sourceTextProperty);

下拉字体
将字体或样式链接到下拉菜单

可使用下拉菜单控制文本样式,例如将文本图层锁定为特定字体。 这对于品牌指南、模板、MoGRTS 等都很有用:

// 使用下拉菜单控制将文本图层锁定到特定字体

var dropDownMenu = thisComp.layer("LayerName").effect("Dropdown Menu Control")("Menu");

switch (dropDownMenu.value) {

case 1 :

text.sourceText.style.setFont("Georgia");

break;

case 2 :

text.sourceText.style.setFont("Impact");

break;

default :

text.sourceText.style.setFont("Tahoma");

}

主文本图层

主文本图层
从“文本图层 1”获取文本属性,但覆盖字体大小和填充颜色

将多个文本图层链接到某个主字体控制器以同时控制多个图层的文本样式。 创建两个文本图层,并将此表达式粘贴到其中一个的源文本中:

// 获取文本图层的所有文本属性

thisComp.layer("Text Layer 1").text.sourceText.style;

可以从文本图层获取样式,但需通过使用 Set 函数添加值来覆盖特定的文本属性。 以下是使用填充颜色字体大小的两个示例。

// 从"Text Layer 1"获取所有文本属性,但用硬编码值覆盖填充颜色和字体大小
\n
\n var newStyle = thisComp.layer(\"Text Layer 1\").text.sourceText.style;
\n
\n newStyle.setFillColor(hexToRgb(\"FF0000\")).setFontSize(100);

// 从\"Text Layer 1\"获取所有文本属性,但用图层的当前文本属性覆盖填充颜色和字体大小
\n
\n var newStyle = thisComp.layer(\"Text Layer 1\").text.sourceText.style;
\n
\n var currentFillColor = thisProperty.style.fillColor;
\n
\n var currentFontSize = thisProperty.style.fontSize;
\n
\n newStyle.setFillColor(currentFillColor).setFontSize(currentFontSize);

示例

下面提供了有关如何通过表达式访问和使用文本属性值的示例。

字体

以下是访问文本图层的字体字体大小仿粗体仿斜体字符间距行距的示例:

// 返回文本图层本身的字体名称
text.sourceText.style.font;

// 返回其他文本图层正在使用的字体名称
var otherLayer = thisComp.layer("Other Layer Name");

otherLayer.text.sourceText.style.font;

// 返回文本图层本身的字体大小值
text.sourceText.style.fontSize;

// 返回其他文本图层的字体大小值
var otherLayer = thisComp.layer("Other Layer Name");

otherLayer.text.sourceText.style.fontSize;

// 返回图层文本是否为仿粗体的布尔值(真或假)
text.sourceText.style.isFauxBold;

// 返回图层文本是否为仿斜体的布尔值(真或假)
text.sourceText.style.isFauxItalic;

// 返回文本图层字距的数值
text.sourceText.style.tracking;

// 返回文本图层行距的数值
text.sourceText.style.leading;

填充

以下是访问文本图层的填充填充颜色的示例:

// 返回图层文本是否应用了填充的布尔值(真或假)
\n text.sourceText.style.applyFill;
\n
\n // 返回文本图层的填充颜色值
\n // 默认情况下,这会返回 0 到 1.0 比例的 RGB 值数组
\n text.sourceText.style.fillColor;
\n
\n // 使用 setApplyFill 和 setFillColor 设置文本图层的填充颜色
\n // setFillColor 值定义为 0 到 1.0 比例的 RGB 数组
\n var newStyle = style.setApplyFill(true);
\n
\n newStyle.setFillColor([1.0, 1.0, 1.0]);
\n
\n // 设置文本图层的填充颜色,用 hexToRGB 替换 0 到 1.0 的 RGB 数组,以使用十六进制值定义颜色值
\n var newStyle = style.setApplyFill(true);
\n
\n newStyle.setFillColor(hexToRgb(\"FFFFFF\"));

填充 RGB 值

// 返回填充颜色的红色 (R) 值
\n
\n text.sourceText.style.fillColor[0];

注释

要返回文本图层的 R、G 或 B 的填充颜色值,请分别在括号中添加 0、1 或 2。

描边

以下是访问文本图层的描边描边颜色描边宽度的示例:

// 返回图层文本是否应用了描边的布尔值(真或假)
text.sourceText.style.applyStroke;

// 返回文本图层的描边颜色值
// 默认情况下,这会返回 0 到 1.0 比例的 RGB 值数组
text.sourceText.style.strokeColor;

// 使用 setApplyStroke 和 setStrokeColor 设置文本图层的描边颜色
// setStrokeColor 值定义为 0 到 1.0 比例的 RGB 数组
var newStyle = style.setApplyStroke(true);

newStyle.setStrokeColor([1.0, 0.0, 0.0]);

// 设置文本图层的描边颜色,用 hexToRGB 替换 0 到 1.0 的 RGB 数组,以使用十六进制值定义颜色值
var newStyle = style.setApplyStroke(true);

newStyle.setStrokeColor(hexToRgb("FF0000"));

// 返回文本图层描边宽度的数字值
text.sourceText.style.strokeWidth;

描边 RGB 值

// 返回笔划颜色的绿色 (G) 值
\n
\n text.sourceText.style.strokeColor[1];

注释

要返回文本图层的 R、G 或 B 的描边颜色值,请分别在括号中添加 0、1 或 2。

getStyleAt 函数

使用此 get 函数在特定时间返回特定字符的样式值。 索引应该是一个数字,是需要其样式的字母或字符的索引。 atTime 也应该是一个数字,即在样式已设置关键帧并随时间变化的情况下,在合成中获取样式的时间。

text.sourceText.getStyleAt(index, atTime);

注释

text.sourceText.styletext.sourceText.getStyleAt(0,0) 的使用方法相同。

// 获取时间线开头第一个字符的样式
\n
\n text.sourceText.getStyleAt(0,0);

Set 函数

可以单独使用或组合使用其他 Set 函数来跨图层驱动样式。 对源文本属性的样式对象调用以下每个函数:

// 将字体设置为 Arial
style.setFont("ArialMT")

// 将字体大小设置为 80
style.setFontSize(80);

// 使用布尔值启用仿粗体
style.setFauxBold(true)

// 使用布尔值启用仿斜体
style.setFauxItalics(true)

// 使用布尔值启用全部大写
style.setAllCaps(true)

// 使用布尔值启用小型大写字母
style.setSmallCaps(true)

// 将跟踪设置为数字
style.setTracking(10);

// 将行距设置为数字
style.setLeading(10);

// 使用布尔值启用自动行距
style.setAutoLeading(true);

// 将基线偏移设置为数字
style.setBaselineShift(10);

// 将笔划宽度设置为数字
style.setStrokeWidth(10);

// 将文本图层的第一行设置为粗体并调大字号
text.sourceText.style.setFontSize(100, 0, 30).setFauxBold(true, 0, 30)

// 为字符设置上标
text.sourceText.style.setBaselineOption("superscript",1,2).setBaselineOption("superscript", 9, 2)

文本样式的所有 set 函数都可以链接在一起以轻松设置多个属性,而无需每次都声明新样式,如下例所示:

注释

在设置好最后一个属性之后才使用分号。 在单独的行中列出每个属性有助于使整个链更易于阅读。

// 启用填充,设置填充颜色,设置基线,设置跟踪,并启用自动行距

text.sourceText.style

.setApplyFill(true)

.setFillColor(hexToRgb("FFFFFF"))

.setBaselineShift(10)

.setTracking(25)

.setAutoLeading(true);

源文本表达式的其他用途

向合成添加文本图层并向其源文本属性添加表达式可能是检查其他图层的属性值的一种非常好的方法。 例如,源文本属性的以下表达式以图层堆积顺序报告下一个图层的不透明度属性的名称和值:

var nextLayer = thisComp.layer(index + 1);
nextLayer.name + "\r不透明度 = " + nextLayer.opacity.value;

以下示例在设置其“视频”开关的当前时间以堆积顺序报告用作最高图像图层源的素材项目的名称:

// 创建 sourceFootageName 作为空字符串
var sourceFootageName = "";

// 循环遍历构成中的所有图层
for (var i = 1; i <= thisComp.numLayers; i++) {

// 如果 i 与此图层的索引匹配,则继续下一个循环
if (i == index) {
continue;
}

// 为循环的当前迭代设置 myLayer
var myLayer = thisComp.layer(i);

// 如果 myLayer 没有视频或不活跃,则继续下一个循环/图层
if ( !myLayer.hasVideo || !myLayer.active ) {
continue;
}

// 如果 myLayer 在当前时间活跃
if ( myLayer.active ) {
try {
// 将 sourceFootageName 设置为 myLayer 的源名称
sourceFootageName = myLayer.source.name;
} catch ( err ) {
// 如果 myLayer 没有源,
// 将 sourceFootageName 设置为 myLayer 的名称
sourceFootageName = myLayer.name;
}

// 停止循环
break;
}
}

// 显示 sourceFootageName
sourceFootageName;

将表达式另存为预设

选择添加了表达式的源文本属性。 然后,选择动画 > 保存动画预设,以便在其他项目中重复使用这些表达式。 动画预设保存在效果和预设面板中。

有关更多信息,请参阅效果和动画预设概述

更多表达式资源

当您领会了表达式背后的一些概念之后,请前往社区观看一些真实案例并分享您的作品。

AE Enhancer 论坛也提供了有关表达式、脚本和动画预设的许多示例和大量信息。