Modifier les styles et les propriétés de texte à l’aide des options pour expressions.
Utilisez des expressions pour contrôler le style de texte dans n’importe quelle expression de texte ou dans les modèles d’animations graphiques. Voici quelques petites choses que vous pouvez faire avec les expressions :
Lier plusieurs titres et mettre tous leurs styles à jour en même temps (très utile pour concevoir des titres).
Garder la police, la taille et le style synchronisés sur plusieurs calques de texte.
Apporter des modifications globales aux propriétés du texte.
Une fois que vous avez défini cela pour un calque de texte, vous pouvez référencer les propriétés de ce calque de façon à appliquer facilement les modifications dans l’ensemble de la composition.
After Effects utilise les fonctions « get » et « set » pour lire et écrire des valeurs pour les propriétés de texte dans le moteur d’expression. Vous utilisez des expressions pour piloter et définir des styles de police, tels que des propriétés de texte sur des calques de texte.
Pour accéder à ces fonctions pour les propriétés de texte :
Ajoutez une expression à la propriété Texte source d’un calque de texte. Pour plus d'informations, voir Expression - les bases.
Dans le menu volant Langage d’expression, sélectionnez Propriétés > du texte > Propriétés.
Enregistrer les expressions en tant que paramètres prédéfinis
Sélectionnez la propriété de texte source sur laquelle sont ajoutées des expressions. Sélectionnez ensuite Animation > Enregistrer l’animation prédéfinie pour réutiliser les expressions dans d’autres projets. Les animations prédéfinies sont enregistrées dans le panneau Effets et paramètres prédéfinis.
Lorsqu’ils font référence à des polices dans des expressions, ils doivent utiliser un « nom système » spécial (ou similaire). Il est recommandé d’insérer ce nom spécial depuis la boîte de dialogue Texte > Police > Sélectionner une police pour éviter les erreurs d’expression.
Ouvrez le menu volant Langage d'expression, puis sélectionnez Texte > Police. Cela fait apparaître une boîte de dialogue avec des menus déroulants pour sélectionner la police de caractères et la police à insérer dans l’expression.
Synchronisation des polices
Les polices auxquelles il est uniquement fait référence dans l’Éditeur d’expressions ne sont pas enregistrées en tant que polices utilisées par le projet. Pour vous assurer que toutes les polices référencées dans l’Éditeur d’expressions se synchronisent automatiquement ou remplissent la boîte de dialogue Résoudre les polices, utilisez toutes ces polices sur un calque, même si la source de calque utilisée est masquée.
L’objet style
Toutes les propriétés de style d’un calque de texte existent sur l’objet style, auquel vous accédez sur la propriété Texte source à l’aide des éléments suivants :
// Utilisation du chemin d’accès complet à la propriété Texte source text.sourceText.style // Utilisation du nom générique de la propriété actuelle thisProperty.style
L’utilisation du style en soi est identique à l’utilisation de l’un des deux exemples ci-dessus, mais cela peut être déroutant si les attributs de style de plusieurs calques de texte sont combinés.
Les attributs de style d’autres calques de texte peuvent également être lus. Utilisez le fouet de sélection pour créer un lien vers l’autre calque de texte au début du premier exemple illustré ci-dessus.
// Accès à l’objet de style d’un calque de texte spécifique thisComp.layer(“Other Layer Name”).text.sourceText.style;
Attributs de texte disponibles
Les attributs de style de texte suivants peuvent être lus et définis à l’aide de l’objet style :
Police
Taille de la police
Faux gras
Faux italique
Tout en majuscules
Petites majuscules
Suivi
Interlignage
Interlignage automatique
Décalage vertical
Remplir (activer/désactiver)
Couleur du fond
Contour (activer/désactiver)
Couleur du contour
Largeur du tracé
La propriété Texte source d’un calque de texte est interprétée dans les expressions telles que les chaînes (String) JavaScript. Le texte lui-même peut être lu avec sourceText, mais il doit être défini sur l’objet style avec la méthode setText si les attributs de style sont modifiés. Voir les exemples ci-dessous.
Combiner le style et le texte source
Combinaison du style et du texte source
Pour renvoyer à la fois les valeurs du style et du texte source réel, vous devrez combiner les fonctions getStyleAt et setText. Vous trouverez ci-dessous deux exemples d’écriture de cette expression.
// Pour renvoyer les valeurs du style et du texte source réel à l’heure (abréviation) var sourceTextProperty = thisComp.layer(« MAIN TEXT »).text.sourceText; var newStyle = sourceTextProperty.getStyleAt(0,0); newStyle.setText(sourceTextProperty);
// Pour renvoyer à la fois les valeurs du style et du texte source réel du calque précédent dans l’ordre d’empilement des calques var sourceTextProperty = thisComp.layer(index - 1).text.sourceText; var newStyle = sourceTextProperty.getStyleAt(0,0); newStyle.setText(sourceTextProperty);
Polices déroulantes
Lier des polices ou des styles à un menu déroulant
Vous pouvez utiliser les menus déroulants pour contrôler les styles de texte, tels que le verrouillage des calques de texte sur des polices spécifiques. Ceci est utile pour les directives de marque, les modèles, MoGRTS, etc. :
// // Pour verrouiller un calque de texte à des polices spécifiques à l’aide d’une commande de menu déroulant 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”); }
Calque de texte principal
Obtenir les propriétés de texte à partir de « Calque de texte 1 » mais remplacer la taille de police et la couleur de remplissage
Liez plusieurs calques de texte à un contrôleur de police principal pour contrôler le style de texte de plusieurs calques à la fois. Créez deux calques de texte et collez cette expression dans le texte source de l’un d’entre eux :
// Pour obtenir toutes les propriétés de texte d’un calque de texte, thisComp.layer(“Text Layer 1”).text.sourceText.style;
Il est possible d’obtenir le style à partir d’un calque de texte, mais de remplacer des propriétés de texte spécifiques en ajoutant des valeurs avec les fonctions Set. Vous trouverez ci-dessous deux exemples utilisant la couleur de remplissage et la taille de police.
// Pour obtenir toutes les propriétés de texte à partir de «Calque de texte 1 », mais remplacer la couleur de remplissage et la taille de police par des valeurs codées en dur var newStyle = thisComp.layer(“Text Layer 1”).text.sourceText.style; newStyle.setFillColor(hexToRgb(“FF0000”)).setFontSize(100);
// Pour obtenir toutes les propriétés de texte à partir de « Calque de texte 1 », mais remplacer couleur de remplissage et taille de police par les propriétés de texte actuelles du calque var newStyle = thisComp.layer(“Text Layer 1”).text.sourceText.style; var currentFillColor = thisProperty.style.fillColor; var currentFontSize = thisProperty.style.fontSize; newStyle.setFillColor(currentFillColor).setFontSize(currentFontSize);
Exemples
Les exemples ci-dessous indiquent comment accéder aux valeurs de propriétés de texte et les utiliser à l’aide d’expressions.
Police
Voici des exemples d’accès à la police, à la taille de police, au faux gras, au faux italique, au suivi et au début d’un calque de texte :
// Pour renvoyer le nom de la police du calque de texte lui-même text.sourceText.style.font ; // Pour renvoyer le nom de la police qu’un autre calque de texte utilise var otherLayer = thisComp.layer(“Other Layer Name”); otherLayer.text.sourceText.style.font; // Pour renvoyer la valeur Taille de police pour le calque de texte lui-même text.sourceText.style.fontSize ; // Pour renvoyer la valeur taille de police pour un autre calque de texte var otherLayer = thisComp.layer(“Other Layer Name”); otherLayer.text.sourceText.style.fontSize ; // Pour renvoyer une valeur booléenne de type texte faux gras ou non (vrai ou faux) text.sourceText.style.isFauxBold ; // Pour renvoyer une valeur booléenne selon que le texte d’un calque est faux italique ou non (True ou False) text.sourceText.style.isFauxItalic ; // Pour renvoyer la valeur du suivi d’un calque de texte sous la forme d’un nombre text.sourceText.style.tracking ; // Pour renvoyer la valeur de l’en-tête d’un calque de texte sous la forme d’un nombre text.sourceText.style.leading ;
Remplir
Voici des exemples d’accès à la couleur de remplissage et au remplissage d’un calque de texte :
// Pour renvoyer une valeur booléenne pour indiquer si Remplissage est appliqué au texte d’un calque (True ou False) text.sourceText.style.applyFill ; // Pour renvoyer la valeur de la couleur de remplissage d’un calque de texte // Par défaut, cela renvoie un tableau des valeurs RVB sur une échelle de 0 à 1.0 text.sourceText.style.fillColor ; // Définir la couleur de remplissage d’un calque de texte avec setApplyFill et setFillColor // Les valeurs setFillColor sont définies comme un tableau RVB sur une échelle comprise entre 0 et 1,0 var newStyle = style.setApplyFill(true); newStyle.setFillColor([1.0, 1.0, 1.0]) ; // Définir la couleur de remplissage d’un calque de texte en remplaçant le tableau RVB 0 – 1.0 par hexToRGB pour définir les valeurs de couleur avec les valeurs hexa var newStyle = style.setApplyFill(true); newStyle.setFillColor(hexToRgb(“FFFFFF”));
Remarque :
Pour renvoyer la valeur de la couleur de remplissage pour R, V ou B d’un calque de texte, ajoutez 0, 1 ou 2 entre parenthèses, respectivement.
// Pour renvoyer la valeur rouge (R) de la couleur de remplissage text.sourceText.style.fillColor[0];
Contour
Voici des exemples d’accès au contour, à la couleur du contour et à la largeur du contour d’un calque de texte :
// Pour renvoyer une valeur booléenne et indiquer si un contour est appliqué au texte d’un calque (True ou False) text.sourceText.style.applyStroke ; // Pour renvoyer la valeur de la couleur de contour d’un calque de texte // Par défaut, cela renvoie un tableau des valeurs RVB sur une échelle de 0 à 1.0 text.sourceText.style.strokeColor ; // Définir la couleur de contour d’un calque de texte avec setApplyStroke et setStrokeColor // Les valeurs setStrokeColor sont définies comme un tableau RVB sur une échelle comprise entre 0 et 1,0 var newStyle = style.setApplyStroke(true); newStyle.setStrokeColor([1.0, 0.0, 0.0]); // Définir la couleur de contour d’un calque de texte remplaçant le tableau RVB 0 – 1.0 par hexToRGB pour définir les valeurs de couleur avec les valeurs hexa var newStyle = style.setApplyStroke(true); newStyle.setStrokeColor(hexToRgb(« FF0000 »)) ; // Pour renvoyer la valeur de la largeur de contour d’un calque de texte sous la forme d’un nombre text.sourceText.style.strokeWidth ;
Remarque :
Pour renvoyer la valeur de la couleur de contour pour R, V ou B d’un calque de texte, ajoutez 0, 1 ou 2 entre parenthèses, respectivement.
// Pour renvoyer la valeur verte (V) de la couleur de contour text.sourceText.style.strokeColor[1] ;
Fonctions Get
Utilisez la fonction « get » pour renvoyer la valeur de style d’un caractère particulier à un moment précis. « index » doit être un nombre, l’index de la lettre ou du caractère dont le style est nécessaire. « atTime » doit également être un nombre, le délai dans la composition pour obtenir le style pour le cas où cclui-ci serait encadré et changerait au fil du temps.
text.sourceText.getStyleAt(index, atTime);
Remarque :
L’utilisation de text.sourceText.style est identique à l’utilisation de text.sourceText.getStyleAt(0,0).
// Obtient le style du premier caractère au début du texte du montage text.sourceText.getStyleAt(0,0);
Fonctions Set
Des fonctions « set » supplémentaires pouvant être utilisées individuellement ou en combinaison les unes avec les autres pour générer des styles au niveau des calques. Chacune de ces fonctions est appelée sur l’objet style d’une propriété de texte source :
// Définissez la police utilisée sur Arial style.setFont(« ArialMT ») // Définissez la taille de police sur 80 style.setFontSize(80) ; // Activez le faux gras avec un style booléen.setFauxBold(true) // Activez le faux italique avec un style booléen.setFauxItalics(true) // Activer toutes les majuscules avec un style booléen.setAllCaps(true) // Activer les petites majuscules avec un style booléen.setSmallCaps(true) // Définissez le suivi comme un style numérique.setTracking(10) ; // Définissez l’interlignage comme un style numérique.setLeading(10) ; Activez l’interligne automatique avec un style booléen.setAutoLeading(true) ; // Définissez le décalage vertical comme un style numérique.setBaselineShift(10) ; // Définissez la largeur du contour comme un style numérique.setStrokeWidth(10);
Toutes les fonctions Set pour les styles de texte peuvent être enchaînées afin de définir facilement plusieurs attributs sans avoir à déclarer un nouveau style à chaque fois, comme dans l’exemple suivant :
Remarque :
Aucun point-virgule n’est utilisé tant que le tout dernier attribut n’est pas défini. Le fait de répertorier chaque attribut sur sa propre ligne permet de rendre l’ensemble de la chaîne plus facile à lire.
// Activer le remplissage, définir la couleur de remplissage, définir la ligne de base, définir le suivi et activer l’interligne automatique text.sourceText.style .setApplyFill(true) .setFillColor(hexToRgb(« FFFFFF »)) .setBaselineShift(10) .setTracking(25) .setAutoLeading(true);
Conseil d’expression de texte de paragraphe
Entrez « \r » dans une expression de chaîne pour commencer une nouvelle ligne de texte. Par exemple, pour copier le texte d’origine d’un calque sur le même calque et le répéter en majuscules sur une nouvelle ligne, utilisez l’expression suivante :
Utilisations supplémentaires des expressions sur le texte source
Ajouter un calque de texte à une composition et une expression à sa propriété Texte source permet un examen efficace des valeurs de propriétés d’autres calques. Par exemple, dans la propriété Texte source, l’expression suivante indique le nom et la valeur de la propriété Opacité du calque suivant dans l’ordre d’empilement des calques :
L’exemple suivant indique le nom du métrage utilisé comme source du calque d’image le plus élevé dans l’ordre d’empilement à l’instant en cours pour lequel l’option Vidéo est définie :
// Créer sourceFootageName en tant que chaîne vide var sourceFootageName = “” ; // Boucle à travers toutes les couches de la composition pour (var i = 1; i <= thisComp.numLayers; i++) { // If i matches this layer's index, continue to next loop if (i == index) { continue; } // Set myLayer for the current iteration of the loop var myLayer = thisComp.layer(i); // If myLayer has no video or isn't active, continue to next loop/layer if ( !myLayer.hasVideo || !myLayer.active ) { continue; } // If myLayer is active at the current time if ( myLayer.active ) { try { // Set sourceFootageName to myLayer's source name sourceFootageName = myLayer.source.name; } catch ( err ) { // If myLayer has no source, // set sourceFootageName to the myLayer's name sourceFootageName = myLayer.name; } // Stop looping break; } } // Afficher le sourceFootageName sourceFootageName;
En savoir plus sur les ressources dʼexpression
Maintenant que vous avez assimilé certains concepts sous-jacents aux expressions, rejoignez la communauté pour découvrir des exemples concrets et partager votre travail.