Utiliser une fonte TTF sous iOS

Pour afficher une fonte TrueType personnelle dans une application iOS, il va falloir se reporter un peu à la documentation d'Apple sur le sujet... et je vous souhaite bon courage pour trouver la bonne page. devil

En fait l'ajout d'une fonte TTF sur iOS (et watchOS) est assez simple : il suffit d'embarquer la police sur l'appareil et de la déclarer dans le fichier info.plist accompagnant toute application.

Pour faire cela avec Delphi, il n'y a pas beaucoup plus de difficulté. L'ajout d'une police de caractère à une application iOS se fait en quatre étapes :

  • Compilez une première fois votre projet pour iOS. Delphi ajoute ainsi un fichier "info.plist.TemplateiOS.xml" aux sources du projet.
  • Modifiez le fichier "info.plist.TemplateiOS.xml" pour y ajouter les noms des fichiers TTF à charger au démarrage de l'application, lui permettant ainsi d'y avoir accès quand elle le désire.
  • Ajoutez les fontes TrueType à votre configuration de déploiement.
  • Utilisez la fonte dans votre application en affectant le bon nom à la propriété Font.Family de vos textes.

Pour l'exemple, je vais utiliser la fonte Star Trek Future qui a une petite subtilité bien pratique ici.

Etape 1 : compiler le projet pour iOS

Je ne vous ferai pas l'affront de vous guider pour celà. Vous n'avez qu'à créer un projet, l'enregistrer dans un dossier dédié, choisir une cible iOS (avec un appareil connecté et PAServer en fonctionnement sur le Mac cible) puis de lancer une compilation.

Si tout se passe bien, Delphi ajoute deux fichiers dans votre dossier : Entitlement.TemplateiOS.xml et info.plist.TemplateiOS.xml.

Etape 2 : dire à iOS quelles fontes charger

Depuis la version 3.2 d'iOS, il suffit d'ajouter une clé dans le fichier info.plist de l'application.

UIAppFonts (Array - iOS) Specifies any app-provided fonts that should be made available through the normal mechanisms. Each item in the array is a string containing the name of a font file (including filename extension) that is located in the app’s bundle. The system loads the specified fonts and makes them available for use by the app when that app is run.

Comme info.plist est généré automatiquement par Delphi, Embarcadero nous fournit son template dans lequel on peut effectuer des modifications quand elles ne sont pas disponibles sur les options de projet de l'EDI. C'est le fameux fichier info.plist.TemplateiOS.xml.

Ouvrez le avec un éditeur de texte classique (ne l'ouvrez pas dans un éditeur XML car il n'est pas valide sous cette forme) et ajoutez ces lignes avant la fin du dictionnaire de paramètres clés / valeurs :

<key>UIAppFonts</key>
<array>
	<string>Star_Trek_future.ttf</string>
</array>

A l'indentation prés vous devriez donc obtenir ceci :

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
	<dict>
		<%VersionInfoPListKeys%>
		<%ExtraInfoPListKeys%>
		<key>UIAppFonts</key>
		<array>
			<string>Star_Trek_future.ttf</string>
		</array>
	</dict>
</plist>

Si vous avez plusieurs fontes à utiliser, dupliquez simplement la ligne contenant le nom du fichier de chaque fonte. Faites bien attention à la casse et n'oubliez pas l'extension.

Etape 3 : embarquer les fontes TTF dans le paquet de l'application

Maintenant que iOS sait quelles polices de caractères nous désirons utiliser, il faut les lui fournir. Pour celà elles doivent se situer à la racine du paquet de l'application.

Avec Delphi nous utilisons l'option Projet / Déploiement afin d'ouvrir la fenêtre du gestionnaire de déploiement.

Pour tester le programme il nous faut modifier la configuration DEBUG.
Pour l'avoir uniquement à l'exécution une fois l'application déployées il suffit de modifier la configuration RELEASE.

Je vous recommande de faire la modification sur "Toutes les configurations - périphérique iOS - 32 bits" et "Toutes les configurations - périphérique iOS - 64 bits" pour ne pas en perdre en route. Eventuellement sur les configurations du simulateur iOS si vous l'utilisez pour développer ou tester.

Dans le gestionnaire de déploiement vous devez ajouter chaque fichier TTF à la liste des fichiers en spécifiant le chemin distant "./" pour pointer à la racine du fichier IPA. Si vous le mettez au mauvais endroit ça peut fonctionner sur le simulateur, mais peut-être pas en réel ou inversement. Quoiqu'il en soit souvenez-vous que les fichiers à déployer pour iOS doivent se trouver à la racine ? Ca épargne des neurones et quelques cheveux.

Etape 4 : l'utilisation de la fonte

Reste maintenant la dernière étape, celle que l'on pense être la plus simple : l'utilisation de la fonte dans les écrans et le programme. Le hic, c'est que l'on ne doit pas utiliser le nom du fichier mais le nom de la fonte... et ce n'est pas forcément celui que vous verrez à l'écran dans les propriétés de la fonte sous Windows. Alors méfiance !

Dans le cas de la fonte Star Trek Future, il faut affecter "StarTrekFuture" et non "Star Trek Future" à Font.Family sur les textes à afficher avec cette police.

D'après mes tests le nom utilisé sous iOS (comme sur macOS et watchOS) ne doit pas avoir d'espaces mais conserve la casse du nom de la fonte tel qu'on peut le consulter sous Windows dans les propriétés du fichier TTF. Si vous n'arrivez pas à afficher un texte avec la fonte que vous voulez, vérifiez donc que le nom est le bon, ça vous épargnera des heures à chercher un problème qui n'existe peut-être pas.

Maintenant que vous savez afficher une fonte personnalisée pour iPhone, iPad et iPod touch, il vous reste à le faire sur les autres plateformes.


A lire aussi

Utiliser une fonte TTF sous iOS (11/08/2017)
Régler l'incompatibilité entre Xcode 8.3.x et RAD Studio pour le déploiement iOS. (06/06/2017)
En finir avec l'erreur e800002d retournée lors dune tentative de debug sur iDevice (14/01/2016)

Membre du programme MVP.
Membre du programme MVP