Polices personnalisées dans le Flow & Paywall Builder

Lors de la création de flows, vous pouvez utiliser une police personnalisée pour correspondre au reste de votre application. Voici comment ajouter des polices personnalisées et les utiliser dans vos flows.

Tous les flows d’une même application partagent les polices que vous importez, y compris les flows que vous copiez. Les autres applications de votre compte Adapty doivent chacune effectuer leur propre importation.

Tip

Configurez les polices dans le panneau Styles avant de commencer à concevoir le flow. Ainsi, toutes les modifications que vous apportez s’appliqueront globalement.

Polices intégrées

Lorsque vous créez un flow dans le Builder, Adapty utilise par défaut la police système. Il s’agit généralement de SF Pro sur iOS et de Roboto sur Android, bien que cela puisse varier selon l’appareil. Vous pouvez également choisir parmi des polices courantes comme Arial, Times New Roman, Courier New, Georgia et Helvetica. Chacune de ces polices propose quelques options de style.

Ces polices ne sont pas fournies dans le SDK et ne servent qu’à des fins de prévisualisation. Nous ne pouvons pas garantir qu’elles fonctionneront parfaitement sur tous les appareils. Cependant, d’après nos tests, ces polices sont généralement reconnues par la plupart des appareils sans aucune intervention de votre part. Vous pouvez également consulter les polices disponibles par défaut sur iOS.

Polices intégrées

Ajouter une police personnalisée

Warning

Le fichier que vous importez est uniquement pour l’aperçu dans l’éditeur — Adapty ne l’envoie pas sur les appareils des utilisateurs. Pour afficher la police sur l’appareil, incluez le fichier dans le bundle de votre application. Sans cela, le SDK utilisera SF Pro (iOS) ou Roboto (Android) à l’exécution.

Si vous souhaitez utiliser des polices autres que celle par défaut du système, vous pouvez ajouter une police personnalisée.

Pour ajouter une police personnalisée :

  1. Choisissez Upload new font dans l’un des menus déroulants de police.
Ajouter une police personnalisée
  1. Dans la fenêtre Add custom font, faites glisser-déposer les fichiers de polices ou cliquez sur Select files :

    • Formats pris en charge : .ttf et .otf.
    • Polices variables : Adapty crée une face distincte pour chaque style nommé dans le fichier, comme Regular ou Bold.
    • Plusieurs typographies à la fois : Ajoutez toutes vos polices en un seul import. Adapty lit le nom de famille stocké dans chaque fichier et regroupe les fichiers en familles. Par exemple, 10 fichiers de 2 typographies donnent 2 familles de polices avec 5 faces chacune.
    • Familles existantes : Un fichier portant le même nom de famille qu’une police déjà importée la rejoint en tant que nouvelle face.
    Add custom font window with one font file queued
  2. Cliquez sur Add fonts. Adapty téléverse les fichiers et affiche une carte par famille de polices. Pour renommer une famille de polices, cliquez sur le crayon à côté du nom.

    Import review: the Atkinson Hyperlegible family with Regular, Italic, Bold, and Bold Italic faces
  3. Configurez les propriétés de chaque style de police individuellement, si nécessaire :

    • Font Family : La famille à laquelle appartient la police — vous pouvez déplacer le style vers une autre famille.
    • Font Face : La graisse et le style de la police — détectés automatiquement lors de l’import.
    • iOS font name et Android font name : Les noms de la police dans votre application. Ils doivent correspondre à votre bundle d’application.
    Paramètres de la police : Font Family, Font Face, iOS font name et Android font name

En important le fichier de police dans Adapty, vous confirmez que vous disposez du droit de l’utiliser dans votre application.

Gérer une police personnalisée

Cliquez sur Edit custom font pour ouvrir l’écran de modification des propriétés.

Edit custom font window: the family name, four styles, and the Add font face button
  • Pour renommer la famille, modifiez Font family name in Builder.
  • Pour ajouter un nouveau poids ou style, cliquez sur Add font face.
  • Pour corriger le nom de police iOS ou Android d’un style, cliquez sur sa ligne.
  • Pour téléverser un nouveau fichier pour un style, cliquez sur sa ligne, puis sur Replace.

Supprimer une police personnalisée

Pour supprimer une famille de polices ou une seule variante, cliquez sur Delete font family ou Delete font face dans l’écran d’édition des propriétés.

Si l’un de vos flows utilise cette variante, Adapty ne peut pas la supprimer directement. Vous êtes alors invité à choisir une police de remplacement dans votre bibliothèque. Les éléments qui utilisaient l’ancienne variante utiliseront la nouvelle à la place. Cliquez sur Replace & delete pour confirmer.

Replace Ubuntu-Bold before deleting: a replacement family and face for each face in use

Polices personnalisées dans les templates de flow

La bibliothèque de templates de flow inclut des templates avec des polices personnalisées. Survolez la puce Custom font sur la carte d’un template pour voir les polices qu’il utilise.

Adapty ne fournit pas ces polices. Vous devez les obtenir vous-même, en faisant correspondre les noms de polices affichés dans la puce. Certaines polices peuvent nécessiter une licence commerciale.

Une fois que vous avez les fichiers de polices, suivez les étapes de configuration ci-dessous.

Ajouter les fichiers de polices au bundle de votre application

Adapty n’envoie pas les polices personnalisées sur les appareils des utilisateurs, donc votre application doit inclure le fichier de chaque graisse utilisée dans vos flows. Si votre application utilise déjà des polices personnalisées, ajoutez-les de la même façon. Sinon, suivez le guide de votre plateforme :

Le flow identifie chaque police dans votre application par son nom, donc les noms dans Adapty doivent correspondre à ceux de votre application. Pour vérifier les noms, ouvrez le style dans les paramètres de polices :

  • iOS font name : Le nom PostScript stocké dans le fichier de police. iOS identifie la police par ce nom, et non par le nom du fichier. Il doit être unique parmi toutes les polices personnalisées de l’application. Adapty le renseigne automatiquement si le fichier le déclare. Les fichiers de polices variables ne le déclarent souvent pas — saisissez-le alors manuellement. Pour le trouver, ouvrez Font Book > PostScript name, ou utilisez l’API UIFont.
  • Android font name : Le nom du fichier dans res/font/, sans l’extension. Utilisez uniquement des lettres minuscules, des chiffres et des tirets bas. Adapty ne le renseigne jamais automatiquement. Toutes les déclinaisons qu’Adapty a créées à partir d’un même fichier de police variable partagent ce nom.