Question
Illustrator script with a font drop-down menu and font preview in the user interface.
Is it possible to show a preview about selected font in UI with jsx for Illustrator ?
I share my script but it doesn't work
My script :
var doc = app.activeDocument;
var textObj = doc.selection[0];
if (textObj && textObj instanceof TextFrame) {
// Créer une fenêtre de dialogue
var dialog = new Window("dialog", "Script V1.0 - 2023.12.08");
// Taille de la UI
dialog.size = [340, 500];
var panelBold = dialog.add("panel");
panelBold.orientation = "column";
var imageFileBold = new File("C:/Program Files/Adobe/Adobe Illustrator 2024/Presets/fr_FR/Scripts/Icons/Bold.png");
var imageBold = panelBold.add("image", undefined, imageFileBold);
imageBold.alignment = ["left", "center"]; // Aligner l'image à gauche
var titleText1 = panelBold.add("statictext", undefined, "Choisir la police pour le Bold");
titleText1.graphics.foregroundColor = titleText1.graphics.newPen(titleText1.graphics.PenType.SOLID_COLOR, [0.6, 0.745, 0.129], 1); // Vert Diadem
titleText1.alignment = "left";
var fontListForBold = getFontList();
var dropdownB = panelBold.add("dropdownlist", undefined, fontListForBold);
dropdownB.selection = 0;
// Ajouter la zone de texte pour la prévisualisation
var previewText = panelBold.add("edittext", undefined, "Font Preview");
previewText.graphics.font = ScriptUI.newFont("Helvetica", "BOLD", 16);
previewText.minimumSize.width = 200;
previewText.minimumSize.height = 30;
previewText.maximumSize.width = 200;
previewText.maximumSize.height = 30;
// Écouter les changements dans la liste déroulante
dropdownB.onChange = function () {
var selectedFont = dropdownB.selection.text;
previewText.graphics.font = ScriptUI.newFont(selectedFont, "BOLD", 16);
};
// Ajouter les boutons OK et Annuler
var buttonGroup = dialog.add("group");
var okButton = buttonGroup.add("button", undefined, "OK");
var cancelButton = buttonGroup.add("button", undefined, "Annuler");
// Fonction d'événement pour le bouton OK
okButton.onClick = function () {
var selectedFontForBold = dropdownB.selection.text;
var selectedFontForItalic = dropdownI.selection.text;
var selectedFontForUnderline = dropdownU.selection.text;
applyFontToSelection(textObj, selectedFontForBold, selectedFontForItalic, selectedFontForUnderline);
dialog.close();
};
// Fonction d'événement pour le bouton Annuler
cancelButton.onClick = function () {
dialog.close();
};
// Afficher la fenêtre de dialogue
dialog.show();
} else {
alert("Sélectionnez un cadre texte pour utiliser ce script.");
}
// Fonction pour appliquer la police à la sélection
function applyFontToSelection(textObj, fontForBold, fontForItalic, fontForUnderline) {
var textContent = textObj.contents;
// Remplace <b> par le style gras
textContent = textContent.replace(/<b>(.*?)<\/b>/g, function (match, p1, offset) {
applyFontToRange(textObj, offset + 3, offset + p1.length + 3, fontForBold, false);
return match;
});
}
// Fonction pour appliquer la police à une plage de texte
function applyFontToRange(textObj, start, end, font, isUnderline) {
for (var k = start; k <= end; k++) {
var extractedTextRange = textObj.characters[k];
extractedTextRange.characterAttributes.textFont = app.textFonts.getByName(font);
if (isUnderline) {
extractedTextRange.characterAttributes.underline = true; // Ajout du soulignement
}
}
}
// Fonction pour obtenir la liste des polices disponibles sur le système
function getFontList() {
var fonts = app.textFonts;
var fontList = [];
for (var i = 0; i < fonts.length; i++) {
fontList.push(fonts[i].name);
}
return fontList;
}
AdChoices